Ekhosoft (Power Factors)2 of 6

The initial request was to add status display to the Planner cards. Upon analyzing the problem, I discovered two other components on the site that all used a visual language and provided a very similar user experience. Therefore, I simplified these three distinct elements (components): the Planner cards, Forms, and PlantViewTeaser, by combining them into a single matrix (UI component) within the Figma mockups. By creating a single UI component and programming its possible variations as properties from my Figma mockups, I brought all the elements together in a single matrix, making it much easier to communicate to developers. This gives them access to all possible parameters before they even begin coding. This workflow, where the Figma mockup accurately reflects the component’s front-end architecture, results in increased efficiency and cost savings during development.