Predictable AI output.
Modernized assets let AI tools generate UI that's on-brand, accessible, and meets quality standards — not beautiful and wrong, but boring and right.
Making the design system the context layer for AI-generated UX — and teaching the design org a new way to work.
Generative AI can produce UI. It cannot, on its own, produce UI that's on-brand, accessible, structurally correct, and consistent with everything else the company has ever shipped. That work has to be done somewhere.
Our bet: the design system is where. Tokens, components, and guidelines become the source of truth for both humans and AI tools. The system doesn't just describe the product for people — it describes the product for machines, in a form they can actually consume.
This case study is the sibling to Case Study 01. That one is about installing the system. This one is about turning that system into the substrate for how design and engineering actually work with AI in the loop.
Modernized assets let AI tools generate UI that's on-brand, accessible, and meets quality standards — not beautiful and wrong, but boring and right.
Tokens, components, and guidelines are the source of truth for both humans and AI tools. Everything downstream reads from the same score.
UI generation moves from visual to code-based while maintaining the system as context. The output is production-shaped from the start, not a screenshot that needs a rebuild.
AI integrated into design and prototyping efficiently scales a quality user experience — while reducing time-to-market. Not "AI everywhere." AI in the places it actually helps.
The four phases in the diagram above trace how work flows when the system is the context layer:
Define. The system provides the foundational context — tokens, components, patterns, guidelines. Everything downstream reads from here.
Explore. AI tools generate possible solutions as prototypes, drawing on the system to stay within brand, accessibility, and structural bounds. This is where velocity comes from.
Design. Human designers take the prototypes and turn them into actionable, opinionated designs. AI proposes, humans decide.
Build. The output is ready to code — by a human, by an AI, or (increasingly) some collaboration between the two.
The important thing is what's between the phases: human-led quality control touchpoints. AI is fast; taste, judgment, and accountability aren't. The workflow deliberately keeps humans in the loop at the moments that matter most.
"Design systems and generative AI are two sides of the same function."
— The insight that reframed the work"Design system assets" used to mean components, tokens, and documentation. In an AI-context world, the catalog is bigger:
Layerable skills — modular capabilities that AI tools can compose, keyed to the system's language.
Figma Make kits — starting points that produce system-shaped output from the first click, not the tenth revision.
Prompt guidelines — treated with the same rigor as component documentation. If the prompts drift, so does the output.
The through-line: every one of these is a design system asset. Not "AI stuff we also do." The system owns the interface between humans and the tools that produce UI, whichever side of the loop they're on.