Enterprise

Design systems

B2B

Atlas

A design system and component library that unified a sprawling enterprise data platform across four product teams.

Role

Senior Product Designer

Timeline

8 months · 2022

Team

3 designers, platform eng

Platform

Web app

Atlas — Components
Light
Dark
Buttons
Save
Cancel
Filter chips
All
Active
Draft
Chips filter the table →
Data table
RegionValue
North$2.4M
EMEA$1.9M
APAC$1.2M
LATAM$0.8M
Color tokens · Light

Overview

Atlas is an enterprise analytics platform that grew through acquisitions and fast shipping. Four product teams had built four visual languages — 60+ screens with inconsistent buttons, tables, and spacing — which slowed every team and quietly confused customers.

I led the creation of the shared design system, from audit through adoption, alongside two designers and platform engineers.

The problem

Four teams, four design languages, one confused product.

The same action looked different on every screen. Engineers rebuilt the same components again and again, and customers felt the inconsistency as friction — even when they couldn't name it.

The audit

I inventoried every screen and interviewed engineers from all four teams. Three findings shaped the approach:

01

Twelve button styles

The inventory found a dozen button variants all doing the same job in slightly different ways.

02

Tables were the real pain

Dense data tables were rebuilt per team, each with different sorting, density, and behavior.

03

Tokens before components

Teams needed shared color, type, and spacing tokens before any component would actually stick.

The messy middle

I started with one screen, not the whole system.

Designing a system in the abstract fails. I rebuilt a single high-traffic screen using proposed tokens and components, then let that real example prove the model and pull other teams in.

A — Big-bang library

Rejected: no adoption

B — Token-first

Promising: foundation

C — Per-team kits

Rejected: re-fragments

D — Pilot screen

Shipped basis

What I rejected

A full library shipped at once would have sat unused. Starting from one real screen gave teams proof and momentum they could see.

Key decisions

Three decisions, each with a real tradeoff.

Ship tokens before components

Shared color, type, spacing, and elevation tokens landed first, giving every component a common foundation.

Tradeoff

Tokens alone don't look like progress. I paired the rollout with one visibly upgraded screen to show value.

Make the data table the flagship

We invested most in the table — the platform's hardest and most-used component.

Tradeoff

It delayed simpler components. But solving the hardest one built real trust in the system.

Measure adoption, not completeness

Success was screens migrated to the system, not the number of components designed.

Tradeoff

The library stayed smaller for longer. It also actually got used.

The solution

Atlas is now the shared foundation for the platform: tokens, a documented component library, and migration guides teams actually follow.

Atlas — Components
Light
Dark
Buttons
Save
Cancel
Filter chips
All
Active
Draft
Chips filter the table →
Data table
RegionValue
North$2.4M
EMEA$1.9M
APAC$1.2M
LATAM$0.8M
Color tokens · Light

Data table

Tokens & theming

Impact

60+

Screens migrated onto the system

2M

Users on Atlas-powered surfaces

−40%

UI build time for new features

1

Shared design language across four teams

What I'd do differently

I'd have invested in documentation earlier. Great components don't adopt themselves — the docs and migration guides turned out to be the real product.