eola
Super Cluster design system
2022
Achievements
100% Team adoption
Technology
React | Next JS
Discipline
User Research · Product Design
Client
eola
Blend began as a 360-content library, but quickly realised they could grow faster by building a marketplace where clients and creators meet to bring bold ideas to life.
I brought engineers, product owners, and senior stakeholders together. Over a couple of workshops, we laid out the problems and designed the system to fix them.
--
Engineer
"Can feel too prescriptive (partly trained developer behaviour)."
--
Engineer
"Design and development working off two style guides."
--
Engineer
"Unhappy flows require more attention: errors, validation, unavailability."
--
Engineer
"We hardcode too many styles."
--
Engineer
"It’s hard to understand what exists and what doesn’t."
--
Engineer
"The Figma files are not up to date."
--
Engineer
"It’s hard to find the relevant location (has to go through Notion)."
We came up with one design system that covers both codebases, using shared global styles. To improve adoption, we gave each clear, memorable name.
Supercluster
The overall system that includes typography, colours, and spacing tokens.
Cosmos · B2c
The system that ties together all customer-facing experiences.
Nebula · B2B
The system that ties together all client-facing experiences.
I built Supercluster to work for people: friendly for the end user, of course, but also effortless for the teams building and scaling with it.
Design patterns
Both systems go beyond UI kits: they define common design patterns to keep every team member aligned.
Clear Styles
Separating styles keeps the system clean, easy to manage, and makes collaboration with developers and product marketers a breeze.
Documenting key design patterns kept design and engineering in sync, cut confusion, and sped up both design and development.
Documenting styles kept the wider team - designers, engineers, product marketers - aligned, avoided pointless redos, and vastly improved collaboration.
Supercluster, Cosmos, and Nebula brought together an entire product team and changed how Eola ships experiences.
Thanks for reading
More Work below