设计交付规范

先说清楚要解决的问题

交付断层往往不在设计稿本身，而在没人把规则落到工程可用的产物上：图层命名随意、组件缺少变体，间距、字号、颜色要么没导出全，要么被硬编码进页面；切图格式与倍率不统一，开发只能猜；按钮、输入框的状态和交互行为没有文档，最后又回到反复确认和返工。

这个技能如何工作

它把「设计师到开发者的规范交付」拆成可检查的工作流：

• Figma整理：图层命名、组件化、样式变体，先让结构可维护。
• 全量标注：间距、字号、颜色导出完整，而不是只截一张图。
• Design Tokens导出：输出 JSON 或 SCSS，让主题与变量可复用。
• 切图资源：优先 SVG，按需提供 WebP 和多倍率，明确用途与命名。
• 组件文档：记录状态、变体与交互行为，补齐实现依据。

输入是与设计交付规范相关的具体需求、问题描述和约束；输出是按工作流形成的结构化分析、方案或模板，并依据 references/template.md 组织为表格、清单和步骤。若资料中已有 template.md，也应沿用同一套交付格式，方便直接套用。

适用边界与注意点

适用于项目中涉及该领域的决策与实施，尤其是需要专业指导或把规范落成可执行方案时。它不替代 Figma、代码评审或具体业务实现，也不适用于超出本技能专业范围的场景；如果团队已有规范，应以现有规范为准，只取其中的交付结构与清单。