Design System
Use when
Creating or materially evolving a product-wide design system.
Procedure
- Inventory existing product surfaces, tokens, components, frameworks, themes, and accessibility requirements.
- Establish design principles tied to product/domain needs rather than aesthetic slogans.
- Define token architecture from primitives through semantic intent to component-level decisions.
- Define component anatomy, variants, states, composition rules, and accessibility contracts.
- Establish typography, spacing, layout/grid, iconography, motion, content, and responsive conventions.
- Map the system into each supported framework without erasing native framework conventions.
- Provide migration guidance for legacy values/components.
- Add deterministic validation where rules can be measured.
- Create representative rendered harnesses for system-level regression checks.
Failure conditions
A design system is not complete if it is only a palette or component gallery. It must encode reusable decisions, interaction/state contracts, accessibility requirements, and an implementation path.