Why It Was Needed
Four product teams. Four different button styles. Three typeface scales. No shared language. The company had scaled fast and design debt had compounded silently for two years.
Every new feature required renegotiating solved problems. Engineers built the same component multiple times. QA found inconsistencies weekly.
Approach
Design systems fail when they're built in isolation and handed over. I made a deliberate choice to treat this as an infrastructure project, not a design deliverable — which meant engineers were co-owners from day one.
"The goal wasn't consistency for its own sake — it was to reclaim the time we were wasting solving the same problems over and over."
We started with an audit: cataloguing every UI component across all four products. The results were humbling. 23 variations of input fields. 11 button styles. No single source of truth for spacing.
What We Built
- Figma component library with 80+ components, variants, and documented usage guidelines
- Storybook as the live code reference, keeping design and implementation in sync
- Contribution model so teams could propose additions without breaking the system
- Adoption roadmap that migrated each product team gradually, not all at once
Impact
Within six months, all four product teams had migrated their active workflows to the system. New feature design time dropped by an estimated 30%. Design-to-dev handoff issues fell significantly in quarterly retros.