Private · Enter password

Incorrect password

← All work
Design Systems · 2019–Present

Building Aero from zero

How I built SpotOn's design system from nothing — across Figma, React, Android, and iOS — and led it through a rebrand, three major versions, and a governance model the org actually uses.

Role Design System Lead
Company SpotOn
Timeline 2019–Present
Status Active
01 · Context

The problem we were racing against

SpotOn was acquiring companies faster than anyone could make them consistent. Every product had its own visual language, its own component patterns, its own definition of a button. Engineering was rebuilding the same UI in parallel across teams. Design was making it up as it went.

There was no design system. Not even a partial one. I was brought in to build the shared foundation that would let every product team move faster without drifting apart.

[ Fill in: What the state of tooling was when you joined. What the biggest inconsistencies were. What leadership's expectations were. ]

58
Components
24
Platforms
30+
Micro frontends
02 · Foundation

Starting from scratch

[ Fill in: How you approached the foundational work. Token structure, naming conventions, primitive components. The decisions that turned out to matter most and why. ]

[ Fill in: How you handled Figma → code parity early on. The friction points and how you resolved them. ]

Image · Early token structure and primitive component set
First Figma library → React foundations
03 · Cross-platform

Making it work everywhere

Figma

[ Fill in: How you structured the Figma library. Auto-layout, component variants, naming. What changed from v1 to v2 and why. ]

React

[ Fill in: How the component library was organized. How you worked with engineering. How tokens were consumed in code. ]

Android & iOS

[ Fill in: How you approached mobile. What was shared vs. platform-specific. How you maintained parity without a dedicated mobile engineer. ]

Image · Figma library structure
Image · React Storybook / component docs
04 · The rebrand

When the system had to move

[ Fill in: SpotOn rebranded mid-system. What that meant for everything you'd already built. How the token architecture absorbed the change — or didn't at first. ]

[ Fill in: The specific decisions that made the rebrand manageable vs. catastrophic. What you'd do differently. What the token pipeline looked like after. ]

Image · Before/after rebrand · Adobe XD kit → Aero v2.0
Token pipeline comparison
05 · Governance

Making the system stick

[ Fill in: The federated governance model. How contribution, review, and adoption worked across teams. What you had to build — documentation, processes, tooling — for the system to live beyond one person owning it. ]

Contribution

[ Fill in: How teams proposed and added to the system. What the review bar was. ]

Documentation

[ Fill in: What you documented and where. What "good docs" meant for your context. ]

Adoption

[ Fill in: How you tracked adoption. What drove adoption vs. what didn't. ]

06 · Outcome

Where it landed

[ Fill in: The impact in concrete terms — velocity, reduction in design debt, engineering time saved, adoption rate. The qualitative wins too: what changed about how design and engineering worked together. ]

[ Fill in: What you'd do differently knowing what you know now. ]

Image · Aero today · component coverage, adoption dashboard, or Figma library

Let's talk

Email paucoro14@gmail.com
Elsewhere LinkedIn →