AI-generated prototypes fail because design systems are not built for machine consumption. Hardik Pandya, a designer at Atlassian, published a practical guide outlining a three-layer architecture to fix this: structured Markdown spec files, a locked token layer, and an automated audit script. The spec files encode spacing rules, color choices, component usage guidelines, and decision-making priorities in plain text. AI reads those files on every generation pass instead of inferring intent from mock-ups, which is both cheaper and more accurate.

The audit layer is where this gets interesting. A script scans every generated prototype and flags hard-coded values before they calcify into debt. A sync routine then checks which spec files are stale whenever the design system ships an update. The free Figma plugin FigmaLint handles the Figma side of that audit, catching detached instances, missing interactive states, and unbound tokens. Atlassian, IBM Carbon, the CMS Design System, and Nordhealth have all published llms.txt files as live examples of this approach in production.

The core argument Pandya makes is worth reading in full: design decisions are infrastructure, not documentation. Every priority call, every component choice, every accessibility rule must be written into a spec file or it does not exist for the AI. The guide details exactly how that pipeline connects from Figma to token layer to generated code, and the reasoning behind treating context engineering as the real design system maintenance problem going forward.

[READ ORIGINAL →]