Lead product design efforts and external consulting at B2B Climate Tech start up.

Under my leadership, we produced a design system to accommodate a faster product iteration environment and improve developer collaboration.

Process

A design-led workshop with members from product, design and development gave us a shared view on the state of the product in terms of UI and UX. We discussed design pain points, bottle necks and missing features. Together we grouped different sections to find similarties and differences. The goal was to have a common view on a component drive approach that would benefit the whole product cycle.

Filtering and constraints

After the workshop, we compiled the results and listed components that we would need in our design system. We sorted them out by frequency of use, and also chose an area of the application where we could test them out as we work on them. Additionally, in conversation with our front-end lead we agreed on building our interfaces on top of PrimeNG, and managing and testing components in storybookjs. We went through our list of components to make this decision, while also considering which of those had to be built from scratch.

Iteration, components and interfaces (ongoing)

Perhaps the step that never ends. After engineering and management approval, we have taken components from rough ideas to polished, finished interface elements. As we define more components as done, it becomes easier to unlock the potential of the system by building interface groups and pages out of highly-scalabe groups..