How I took a consultant-built design system in-house and saved $228K annually
When I joined CCHMC, the design system had been created by consultants. On paper it looked complete. In practice it slowed teams down. Components behaved differently across apps, accessibility was weak, and there was no single source of truth. Designers and engineers recreated the same elements, and users had to relearn patterns.
I co-created the system into a unified, accessible foundation that improved consistency, reduced cost, and sped up delivery.
My role
UX Designer
Team
4 Fullstack Engineers, 1 UX Designer, 1 Product Manager, 1 Product Owner
Timeline
6 months
Outcomes
What was broken?
A system that created more work
The consultant-built system looked solid on paper but failed in practice. Components behaved differently across products, accessibility was lacking, and there was no single source of truth.
The impact was real: slower launches, rising costs, and frustrated users.
The problem became clear: fragmented, inconsistent libraries blocked fast and trustworthy delivery. We needed a true design foundation—not another library of mismatched parts.
We were faced with three primary challenges:
Challenge 01
Unify foundations without breaking
live products
How might we standardize tokens, naming, and states while keeping current releases stable?
Challenge 02
Turn scattered libraries into
one trusted source
How might we replace duplicates and conflicting variants with a single library and clear usage rules?
Challenge 03
Keep design and code in sync
How might we maintain Figma and Storybook parity and accessibility at scale without adding overhead?
solution 01
Establish a single source of truth
I led the component audit across three flagship products, cataloging 150+ components and prioritizing the top 78 for immediate rebuild.
Defined and built color, type, and spacing tokens
Centralized tokens for a single source of truth
Fixed duplicates and accessibility issues
This eliminated inherited design discrepancies, directly supporting the goal of unified brand identity and +90% design consistency.
solution 02
Rebuild & standardize components
I audited every legacy component, merged duplicates, and standardized components with clear anatomy and states.
Each component included usage, do/don’t, and accessibility notes
Responsive tokens kept visuals consistent
Centralized documentation became the single source of truth
Designers could now work confidently from one file, and engineers reused the same components across apps.
solution 03
Bridge design and development
I developed the documentation and governance strategy to bridge the design-dev gap and speed up delivery.
Components live in Storybook with usage, props, and states
Tokens and variables sync directly with code
Accessibility audits run on both ends before release
This cut dev time by 25% and saved $228K by removing handoff friction and preventing rebuilds.
Retrospective
Design systems are about more than speed. They build confidence and shared ownership. By rebuilding the foundations, standardizing components, and aligning design and code, this system now helps teams deliver faster and more consistently.
My next focus is to:
Help expand the system with feedback loops so teams can request, pilot, and evolve components safely
Add simple health checks for contrast and accessible states before release
