B2B

B2B

UI/UX

UI/UX

Shipped

Shipped

ENHO Design System

ENHO Design System

Built a design system for Enphase Homeowners App to ensure consistency, scalability, and faster updates for a seamless solar tracking experience.

Built a design system for Enphase Homeowners App to ensure consistency, scalability, and faster updates for a seamless solar tracking experience.

Yellow Flower
Yellow Flower
Yellow Flower

Industry

Industry

Green Energy

Green Energy

Headquarters

Headquarters

Fremont, CA

Fremont, CA

Founded

Founded

2006

2006

Company size

Company size

2000-5000

2000-5000

Opportunity

The aim of creating a design system for the Enphase Homeowners App was to streamline design processes, improve collaboration with development teams, and reduce turnaround time for implementing design enhancements. Additionally, it ensured consistency across the app’s interface, enhanced scalability for future features, and simplified maintenance, ultimately delivering a cohesive and user-friendly experience for homeowners tracking their solar production.

Opportunity

The aim of creating a design system for the Enphase Homeowners App was to streamline design processes, improve collaboration with development teams, and reduce turnaround time for implementing design enhancements. Additionally, it ensured consistency across the app’s interface, enhanced scalability for future features, and simplified maintenance, ultimately delivering a cohesive and user-friendly experience for homeowners tracking their solar production.

Opportunity

The aim of creating a design system for the Enphase Homeowners App was to streamline design processes, improve collaboration with development teams, and reduce turnaround time for implementing design enhancements. Additionally, it ensured consistency across the app’s interface, enhanced scalability for future features, and simplified maintenance, ultimately delivering a cohesive and user-friendly experience for homeowners tracking their solar production.

Outcome

The design system improved efficiency, reducing turnaround time for related design tasks by an average of 19%. For more complex updates, such as building intricate flows or addressing edge cases, the improvement was more pronounced, with tasks completed up to 30% faster as a team. Additionally, the standardised components and clear documentation minimised back-and-forth between design and development, cutting handoff time by 20%. This enabled the team to handle 25% more design iterations within the same timeframe, improving overall productivity while maintaining high quality - evidenced by the 28% fewer bugs reported in QA.

Outcome

The design system improved efficiency, reducing turnaround time for related design tasks by an average of 19%. For more complex updates, such as building intricate flows or addressing edge cases, the improvement was more pronounced, with tasks completed up to 30% faster as a team. Additionally, the standardised components and clear documentation minimised back-and-forth between design and development, cutting handoff time by 20%. This enabled the team to handle 25% more design iterations within the same timeframe, improving overall productivity while maintaining high quality - evidenced by the 28% fewer bugs reported in QA.

Outcome

The design system improved efficiency, reducing turnaround time for related design tasks by an average of 19%. For more complex updates, such as building intricate flows or addressing edge cases, the improvement was more pronounced, with tasks completed up to 30% faster as a team. Additionally, the standardised components and clear documentation minimised back-and-forth between design and development, cutting handoff time by 20%. This enabled the team to handle 25% more design iterations within the same timeframe, improving overall productivity while maintaining high quality - evidenced by the 28% fewer bugs reported in QA.

25%

Faster user journeys

35%

Faster Design TAT

28%

Fewer QA bugs

Industry

Green Energy

Headquarters

Fremont, CA

Founded

2006

Company size

2000-5000

25%

Faster user journeys

35%

Faster Design TAT

28%

Fewer QA bugs

Execution

Built from the ground up, leveraging variables, styles, and atomic design principles to create a cohesive and highly customisable framework. The system was designed to simplify workflows, providing a clear and consistent foundation for designers and developers alike. Each component included multiple states, ensuring seamless flow creation and comprehensive coverage of all use cases. This approach reduced ambiguity for developers and minimised the time required for designers to build end-to-end user journeys.

Execution

Built from the ground up, leveraging variables, styles, and atomic design principles to create a cohesive and highly customisable framework. The system was designed to simplify workflows, providing a clear and consistent foundation for designers and developers alike. Each component included multiple states, ensuring seamless flow creation and comprehensive coverage of all use cases. This approach reduced ambiguity for developers and minimised the time required for designers to build end-to-end user journeys.

The variable structures (above) for colour and typography tokens.

To align the design system closely with the development process, I conducted interviews with developers to understand the structure of their variable and component libraries. This collaboration ensured the design and development libraries shared a unified foundation, eliminating miscommunication with a more streamlined handoff process. The result was a robust and flexible design system that not only enhanced efficiency, but also bridged the gap between design and development. This initiative reduced turnaround times for design improvements, simplified onboarding for new team members, and ensured the app delivered a polished experience for users.

The variable structures (above) for colour and typography tokens.

To align the design system closely with the development process, I conducted interviews with developers to understand the structure of their variable and component libraries. This collaboration ensured the design and development libraries shared a unified foundation, eliminating miscommunication with a more streamlined handoff process. The result was a robust and flexible design system that not only enhanced efficiency, but also bridged the gap between design and development. This initiative reduced turnaround times for design improvements, simplified onboarding for new team members, and ensured the app delivered a polished experience for users.

Testimonials

Comments from colleagues and friends

Testimonials

Comments from colleagues and friends