Design Systems & AI · Apple

One system.
Every feature aligned.

When I joined Apple Pay, Terran had been built screen by screen, with no shared system. I turned one model screen into a design system in code, then built skills that redesigned the rest of Terran from it, and keep it evolving, with me at every gate.

Role
Design lead. System architecture, the model screen, the AI skills, the human-in-the-loop workflow, shipped in code.
Built
A code-native design system, seeded from one model screen, and the skills that redesign and extend Terran from it
Context
Apple, Apple Pay engineering (the Terran platform)

NDA note. This is internal Apple work, so I cannot show the real system. Everything here is a faithful recreation with representative data, and I am happy to walk through it in more depth privately.

The problem

I joined a tool built screen by screen.

When I arrived at Apple Pay engineering, Terran had grown the way internal tools do: one screen at a time, each shipped under its own deadline. There was no shared source of truth, so every screen carried its own spacing, its own patterns, its own idea of the product.

New work reinterpreted the last screen from memory. Consistency was technically everyone's job, which made it no one's, and design review turned into policing drift after it was already built. The tool worked. It just did not feel like one tool.

Every screen remembered the product a little differently.

The real problem

A library no one has time to open.

The reflex was a component library and a doc site. But a library is opt-in. It still asks every person to remember it, correctly, every time, under a deadline, and it only catches drift after the work is already built.

The real problem was that alignment was never the fastest path. So I flipped it. Make the aligned path the path of least resistance, by encoding the system as code an AI operates, so the default output is already aligned, and a genuinely new pattern gets captured instead of improvised.

Do not document the system. Operate it.

The seed

It started with one screen.

Before any system, I designed a single model screen: the CICD view at the core of Terran, done right. Every state, spacing, and component decided once, on purpose. Then came the unglamorous part, pulling that one screen apart into a system, its tokens, its archetype, and its components written as code the whole tool could share.

One screen became the source of truth. From there, the rest of Terran could be rebuilt to match it, not by hand, but by skills that read the system and compose from it.

Get one screen exactly right. Then make it the rule.

BeforeBuilt screen by screen — the same CICD data, a different tool each time.
Recreated with mock data to protect sensitive information.
terran / vertical-overview
Vertical Overview
Northwind PayVERTICALS▾ All ServicesSERVICES▾
14 Total Services
Latest ResultsResult History
Viewing Latest Results across All ServicesExpand AllCollapse AllSearch
Ledger Service (v.3.0.1-12)History ↻
⎇ TCKT-4821 (Add session token refresh) (#318) Passed
Opened by R. Almeida · merged 08:30 AM on Mar 12 · Commit SHA a1b2c3d
Integration Tests (QA-3) Passed
512/512 Test Passed (100%)
Started On: 03-14 02:10 PM
Test Image: v902
Gateway Service (v.1.4.2-08)History ↻
⎇ TCKT-4820 (Rotate service auth keys) (#301) Passed
Opened by T. Vance · merged 08:28 AM on Mar 11 · Commit SHA e4f5a6b
Integration Tests (QA-3) Passed
48/48 Test Passed (100%)
Started On: 03-14 11:20 AM
Test Image: v902
AfterComposed from the system — the CICD view, rebuilt as the model screen.
Recreated with mock data to protect sensitive information.
terran / cicd
TERRANTEAMNorthwind Pay ▾Resources
CICDFeature FlagsAd-hoc
Switch ↗
Northwind Pay — CICD
Ledger ServiceVersion: v4.2.0-7c1a2bLast activity: 8 minutes agoMay 8 – May 15, 2026 ▾
Trend7-day30-dayPassedFailedSkipped
150100500
Test RunsAll (3)Passed (2)Failed (1)Custom FiltersMy Runs
✓
Add support for split tender
v4.2.0-7c1a2b · May 15, 8:15 AM · PIPELINE · R. Almeida
Coverage
91% overall · 88% new
✓Unit 118/118✓Comp. 54/54✓Contract✓Integ. 72/72
✓
Add retry logic for failed captures
v4.2.1-9e3d4c · May 12, 4:20 AM · PIPELINE · T. Vance
Coverage
94% overall · 90% new
✓Unit 126/126✓Comp. 60/60✓Contract✓Integ. 80/80
✕
Add currency rounding rules
v4.2.2-2b5f8a · May 10, 1:05 AM · PIPELINE · D. Cole · 1 Ticket
Coverage
58% overall · 74% new
✕Unit 112/118✕Comp. 51/54✓Contract✕Integ. 66/72
The principle

The system builds. The human decides.

The skills do the assembly, always from the system. But nothing new enters the system on its own. A gap stops the work and asks for a decision, so the library grows on purpose, one approved pattern at a time. The AI proposes. I decide.

Aligned by default
Every page starts from the system's tokens and components.
Consistency, without the reminding.
New patterns, on purpose
A gap halts the work and waits for a yes.
Nothing new ships unreviewed.
Captured, not lost
Approved once, written back as a reusable spec.
The system compounds.
Proof you can run

Watch it work.

This is the redesign skill, recreated here. Run it and watch it read the page, compose from the system, hit a gap it cannot fill, and stop for a human decision before anything is stored. The interesting moment is the one where it asks you.

design-system skill: redesign · reports.html
The module

One source of truth, in code.

Tokens, archetypes, and components live as markdown specs, one module, readable by a person and by the model in the same breath. The skills read the existing page, extract its structure, and infer the right API hooks from the patterns already there. Need a demo before the backend exists? It generates mock data that matches the shape.

And when a redesign captures a new component, this is where it lands, a real file, reviewed and reusable, so the next feature inherits it for free.

design-system/
├─ tokens.md
├─ archetypes/
│   ├─ dashboard.md
│   ├─ detail.md
│   └─ form.md
├─ components/ · 24 specs
│   ├─ button.md
│   ├─ data-table.md
│   └─ …
└─ skills/
    ├─ new-page.md
    └─ redesign.md
The design-system module, recreated. Run the skill above and approve the new component, and it is written here, from 24 specs to 25.
The payoff

From one screen to all of Terran.

The skills did not just hold the line. They redesigned the whole of Terran from the system, screen by screen, until the tool finally looked like one product. Then the same skills went further: new workflows and screens that never existed before, composed from the system, aligned from the first draft.

A screen that used to take days of reinterpreting patterns by hand now starts aligned in minutes, wired to the right hooks or running on mock data for a demo. And every approved pattern makes the next build faster than the last. The system does not just keep Terran consistent. It is how Terran gets built.

Speed and consistency stopped being a trade.

Outcome

Days, to minutes.

A design system that ships features instead of documenting them, and grows itself under review. I built it in code, so what everyone ships is exactly what I designed.

Back to work What's the real problem?
Next case Terran·AI-triaging for Apple Pay