让设计系统为AI就绪：三招提升原型质量

AI 生成原型已经成为设计师和开发者的日常工具，但结果往往差强人意——不是组件选错，就是样式硬编码，或者可访问性一塌糊涂。问题通常不在 AI 本身，而在于喂给它的设计系统数据不够干净。Atlassian 的 Hardik Pandya 在近期分享了一套实用方法，帮助团队减少偏差、保持上下文、提升 AI 原型质量。这套方法的核心，是把设计决策当成基础设施来经营。

为什么 AI 原型总是"差一点"

AI 生成原型质量不稳定的根源，往往是一系列微小的不一致：做了决策但没记录、硬编码值从未清理、或者过度依赖 AI 自己从线框图中"悟"出设计逻辑。AI 不是万能的，它需要明确指引来减少假设和歧义。我们不应该指望 AI 自己知道该选哪个组件、如何考虑无障碍设计——它需要优先级、决策路径、设计原则、正反例。

三层架构：让 AI 有据可依

Pandya 提出的方案可以概括为三层结构，每层各司其职：

1. 规范文件（Spec Files）：设计决策的"说明书"

规范文件是结构化的 Markdown 文档，包含间距规则、色彩选择、组件使用指南、优先级等内容。AI 每次生成原型时都会读取并复用这些文件。关键优势在于：文本文件比从线框图中猜测模式更准确、成本更低。实际上，扩展代码往往比从线框生成代码更高效。

2. 令牌层（Token Layer）：封闭的变量集合

令牌层列出并持续更新整个设计系统中使用的所有令牌。AI 只能从这组封闭的命名变量中选择，而不是临时编造看似合理的值。这就像给 AI 一个固定调色板，而不是让它自由发挥。

3. 审计脚本：AI 的"质检员"

审计脚本扫描 AI 生成的原型，标记每个硬编码值。它可以是一个常规软件，AI 等待其反馈后再调整。当设计系统发布更新时，同步例程会标记哪些规范文件需要更新，确保 AI 始终使用最新版本。

实用工具：FigmaLint 审计插件

如果你经常与第三方供应商合作，接收他们提供的设计系统和组件库，FigmaLint 值得一试。这是一款免费的 Figma 插件，可以审计令牌、状态、无障碍性、令牌绑定、图层重命名、检测分离实例、缺失交互状态和硬编码值，还能帮助准备设计文档。它特别适合需要提升 AI 生成代码和文档质量的团队。

对开发者和 AI 使用者的启示

这套方法的本质是上下文工程——通过精心设计的输入，引导 AI 产生更可靠的输出。对开发者而言，这意味着：

• 把设计决策文档化，作为基础设施持续维护
• 用工具自动化审计流程，减少人工检查负担
• 建立"规范文件+令牌层+审计"的闭环，让 AI 在受控环境中工作

对 AI 使用者来说，这提醒我们：AI 的输出质量上限，取决于输入信息的质量。与其抱怨 AI 不够聪明，不如花时间把设计系统整理得井井有条。当 AI 有了清晰的规范和约束，它生成的原型自然会更加稳定可靠。

这套方法尤其适合设计系统复杂、协作团队庞大、或频繁使用 AI 生成原型的组织。虽然初期需要投入时间建立规范，但长期来看，能显著减少返工和沟通成本。