01The problem inverted
Design systems used to solve a human problem: keeping fifty designers consistent. The 2026 problem is inverted — the prolific contributor isn't a designer, it's a generator. Models produce plausible UI at zero marginal cost, and plausible is precisely the danger: close enough to pass a glance, wrong enough to erode a brand one shipped screen at a time.
Ungoverned generation doesn't scale output. It scales drift. The question Forge answers: what's the minimum contract that makes machine-generated UI trustworthy — and how do you enforce it in the pipeline rather than in review meetings?
02The approach — the system as a contract
During the Dollar General engagement I built the design systems for both DG and pOpshelf — two brands under one company, two projects, one team — to full tokenization, with Figma Code Connect wiring design to code. What we never reached was the governance layer, or what AI generation would demand of it. After the contract ended, I went back and rebuilt pOpshelf on my own time to answer that question.
Starting point: pOpshelf.com, a live production site with no governed system behind it. I reverse-engineered it into a tokenized architecture — 15 token groupsspanning color, type, space, radius, elevation — then defined 5 governance statesthat classify every element's relationship to the system: from governed (token-bound, machine-safe) through tolerated exception (documented, expiring) to violation(blocked in the pipeline).
The governance states are the innovation that matters for the AI era. A binary system/not-system distinction collapses on contact with a real codebase. Five states let generation run fast in governed space and stop hard at the boundary — the same graduated-autonomy thinking as my agent work, applied to pixels.
FIGMA (source of truth) → snapshot → mechanical diff → tokens.json
tokens.json → governance gate: 5-state check → code application
generated UI → token audit → PASS: ships / FAIL: flagged w/ violation report
// The generator is free inside the contract. The contract is not negotiable.
03Design decisions
Five governance states, not two
ShippedBinary system compliance vs. graduated states
Real products carry legacy debt and legitimate exceptions. Binary governance gets ignored the first time it blocks a launch. Five states — governed, migrating, tolerated-with-expiry, unclassified, violation — give the pipeline teeth without making it brittle.
Impact: governance that survives contact with production reality
Tokens as the machine interface
ShippedComponent library as docs vs. tokens as executable vocabulary
Documentation asks the generator to read; tokens force it to comply. When the AI can only reach brand decisions through the token layer, brand consistency stops being a review problem and becomes an architecture property.
Impact: two brands tokenized in-role; one rebuilt solo under full governance
Reverse-engineer, don't greenfield
ShippedIdeal-state system vs. extraction from live production
Building the system from the shipped site — not from a Figma ideal — meant day-one governance coverage of real surfaces, real debt, real exceptions. Proves the skill that matters at any established company: nobody gets a greenfield.
Impact: architecture validated against production, 3 full canvas↔code round trips
04Results
05Key learning
"A design system used to be how designers stayed consistent. Now it's how machines earn the right to ship."
Related reading: Design systems are AI guardrails — the expanded argument, inField Notes.