More on the topic...
Generating detailed summary...
Failed to generate summary. Please try again.
AI-driven prototypes stumble when a design system hides undocumented choices, hard-coded values or vague mock-ups. Hardik Pandya from Atlassian argues that every design decision—colors, spacing, component priorities—needs to live in a machine-readable spec. Store those rules in Markdown “spec files” so AI pulls exact guidelines instead of guessing from visuals.
He recommends three layers of defense. First, the spec files lay out design principles, from accessibility rules to do’s and don’ts, in text. Second, a token layer locks in named variables for colors, typography and spacing so AI never invents ad-hoc values. Third, an audit script (or FigmaLint plugin) scans prototypes for stray hard-coded values, missing states or detached instances, then feeds results back to the AI. When your design system updates, a sync routine marks which spec files need refreshes, keeping guidance current.
For hands-on examples, check Atlassian’s AI-Ready Design System, IBM’s Carbon AI extension, CMS’s AI-Ready library and Nordhealth’s approach. Each shows how spec files, tokens and audits work together to cut drifts and technical debt. With these steps, AI can generate coherent, accessible prototypes instead of random mock-up mash-ups.
Questions about this article
No questions yet.