Bloomreach
Creating design system to scale development
CLIENT
Bloomreach
TIMEFRAME
1 year, 2024
ROLE
Design Systems
Design Docs
UI Design
IMPACT
Unified brand experience across platforms & faster development turnover of new features
I spent a year with the Bloomreach design team on building and implementing a design system from the ground up. We called it Banana - I promise we did more than just making everything yellow 🍌: From crafting individual components and patterns to documenting them and working closely with frontend developers on implementation, I made sure everything was designed for both usability and scalability. I also defined accessibility guidelines and design principles, ensuring a seamless experience across the platform. The result is a unified ecosystem that empowers designers and developers alike. We love bananas! Do you?
The making of a checkbox.
Or well, of any component in the 🍌 system..
01 Component design
First step happens in Figma - this is where we created the checkbox component with all it's variables and states keeping in mind all of its current use cases in our platforms.
02 Documentation
In the second step I wrote a detailed documentation for the component. Our documentation bridged design and development, providing clear guidelines, visual specifications, and implementation details. This became the single source of truth for designers and developers.
03 { Code implementation }
The implementation phase was a collaborative journey between the design and frontend dev team. While the starting point for devs was the documentation I wrote, the process also involved a continuous dialogue to clarify any implementation details and design decisions. With limited resources, we also had to make tradeoffs. We established a pragmatic approach, prioritising core functionality and agreeing to defer more complex variants to future design system iterations. This iterative process allowed us to maintain high-quality standards while remaining flexible and responsive to evolving product needs.
Cool, we have a checkbox.
Now just all the other componets
and we have a design system
© vh.studio · 2025