Design system + Storybook:
Reducing time spent on design and development
Design system + Storybook:
Reducing time spent on design and development
CHALLENGE
CHALLENGE
Our Design system was outdated, inconsistent and full of exceptions. Designers, Developers and Product Owners all struggled to work from it and Adobe XD made project overviews and prototypes unclear and slow.
The result was misalignment, rework and unnecessary delays.
Our Design system was outdated, inconsistent and full of exceptions. Designers, Developers and Product Owners all struggled to work from it and Adobe XD made project overviews and prototypes unclear and slow.
The result was misalignment, rework and unnecessary delays.
THE SOLUTION
THE SOLUTION
Change to Figma instead of Adobe XD.
Then, a new scalable Design System was set up in Figma with clear rules, consistent naming and components that reflect how we actually build.
In parallel, Storybook (Material UI) was implemented as a shared component source for all development teams, fully aligned with Figma for seamless updates.
(Storybook is an open source tool for React for building and structuring UI components that allows developers to create and test the components in isolation.)
Change to Figma instead of Adobe XD.
Then, a new scalable Design System was set up in Figma with clear rules, consistent naming and components that reflect how we actually build.
In parallel, Storybook (Material UI) was implemented as a shared component source for all development teams, fully aligned with Figma for seamless updates.
SCOPE
THE PROBLEM
The scope included a move to Figma, a new Design and component library and a Storybook setup that aligned all teams around shared components, rules and naming, creating one foundation for how we design and build.
The scope included a move to Figma, a new Design and component library and a Storybook setup that aligned all teams around shared components, rules and naming, creating one foundation for how we design and build.

BUSINESS IMPACT
Developers now work faster, make less UX/UI mistakes when coding and, and avoid rebuilding the same components across projects.
The new Design System and Storybook setup are now core tools in the organization, because they increase clarity, speed and delivery quality.
Developers now work faster, make less UX/UI mistakes when coding and, and avoid rebuilding the same components across projects.
The new Design System and Storybook setup are now core tools in the organization, because they increase clarity, speed and delivery quality.
MY ROLE
I initiated the change to Figma and the new scalable Design system. I led the planning and setup of the Figma Design System for web and app, working closely with designers.
I was also part of the set up of Storybook and Figma alignment including communication to departments.
Mid 2025 - the Design System is updated due to EAA.
I initiated the change to Figma and the new scalable Design system. I led the planning and setup of the Figma Design System for web and app, working closely with designers.
I was also part of the set up of Storybook and Figma alignment including communication to departments.
Mid 2025 - the Design System is updated due to EAA.

