All work

One design system, four product teams

Client

Loop

Year

2023

Role

Design Systems Lead

Tools

FigmaStorybookRadix UI

The problem

Loop had grown from one product to four in two years, and each team's design and engineering group had evolved its own component library. Shipping a single visual change meant touching four codebases, and nothing looked quite consistent.

The process

01

Audit before building

I catalogued every button, input, and modal in production across all four products — 34 variants of 'primary button' alone — before proposing a single token set.

02

Build with engineering, not for it

Paired with one engineer from each team from week one so the component API reflected real constraints, not just Figma layer names.

03

Migrate incrementally

Shipped the system alongside legacy components, then converted screen by screen, prioritizing the highest-traffic flows first to build trust before asking teams to fully commit.

The result

All four teams were on the shared system within two quarters. New feature UI now ships in days instead of weeks because nobody's rebuilding a dropdown from scratch.

4 → 1

Component libraries

60%

Faster UI implementation

34 → 3

Button variants