Heaps · Design system
Fix the system, not the designers
Every new project had its own local components page. Designers weren’t breaking the system; the system was breaking them. I rebuilt it and changed how it’s run.
Role
Head of Design
Team
My design team, PM, engineering
Scope
Figma library and an icon font
Status
Live and governed
Areas of influence
Component variants
Usage documentation
Ownership and change process
Icon font
Highlights
An owner for every area
Changes need evidence first
Icon font is the engineering standard
Scroll to move through the story
What we found
Detached copies everywhere.
In an audit, every new project had its own local components page. Designers detached global components and reused their own copies.
Why it happened
The system didn’t cover real use cases.
Button had a single variant. Anyone who needed warning, error, success, small or large had to break it and make their own.
BEFORE
One variant, plus detached copies
AFTER
type × size × state
The rebuild
Complete variant sets, documented.
I rebuilt the components with full variant sets, type by size by state, and wrote documentation on when and how to use each one.
Governance
So it doesn’t drift again.
Each area has an owner; one designer owns the icon library, so every new icon is requested, made and published through them. Any change needs evidence: a designer shows why, the team discusses, then we decide.
Beyond Figma
Icons as a font.
I proposed moving the portal’s icons from PNG and SVG to an icon font, took it through the PM to engineering, and it’s now the standard. I still maintain it.