Prompt pack4 steps6 prompts
Build an AI Native Design System
Use this when the product is paying for inconsistency. Audit, tokens, then the components you will actually maintain. This is months, not a Figma file rename.
01Audit
What already repeats, what conflicts, what to keep. Screenshots. Prioritize the mess.
02Tokens
Color, type, space with semantic names. Start from what you have.
03Components
Foundations first (button, input). Spec every state, including disabled and error. Build in design and code; that part is the team, not a prompt.
- Visual designUI Component SpecificationGenerate a detailed UI component specification with states, variants, and interaction patterns.
- Visual designComponent Prioritization MatrixIdentify, inventory, and prioritize which design system components to build first based on usage, impact, and dependencies.
04Docs and rollout
How to use it, when not to, and how old screens adopt it without a big-bang rewrite.
- Visual designDesign System DocumentationCreate comprehensive documentation for design system components including usage guidelines, code examples, and best practices.
- Visual designDesign System Rollout StrategyPlan how to roll out a design system to teams including migration, training, adoption, and support strategies.
Frequently asked questions
Where does accessibility fit?
In the component spec. Run an accessibility audit if the existing product is already a barrier. Do not wait for the new library to save you.
We only need a Figma library. Skip the rest?
Then you do not need this workflow. A rename of components without tokens, states, and a rollout is a file, not a system.
How long does this take?
Months. Ship foundations first: color, type, button, input. Do not announce a system the day you invent the first token.