简诗 AI 极简设计规范

当设计系统在“能用”和“易用”之间失焦

团队常遇到两类典型问题：新功能模块的视觉风格与既有系统割裂；组件状态（如 hover、focus-visible）依赖开发者经验定义，导致交互一致性不足。更棘手的是，当设计师与工程师对“极简”的理解存在偏差时，最终产物往往在细节处偏离品牌基调。

从基础约束到组件落地的全流程指引

这个技能通过分层定义规范，确保设计系统从令牌到组件的连贯性。

• 基础约束先行：明确定义 typography scale（如 Open Sans 主字体、Inter 展示字体、Inconsolata 等宽字体的 9 级字重）、color tokens（primary=#0C0C09 至 danger=#DC2626 的语义化映射）和 spacing scale（4/8/12/16/24/32 的栅格节奏）。所有规则必须锚定具体令牌，而非模糊形容词。
• 组件规则工程化：要求每个组件需包含完整的交互状态定义（如 default/hover/focus-visible/active/disabled/loading/error）、键盘与指针操作规范（如 Tab 键顺序、触摸目标尺寸），以及响应式边界条件（如长文本截断、空状态展示）。例如，按钮组件需明确 min-height: 36px、padding: 8px 16px 等具体数值，而非“适当留白”。
• 可测试的无障碍标准：基于 WCAG 2.2 AA 要求，提供可量化的验收条件（如 color contrast ratio ≥ 4.5:1、focus-visible 样式必须存在且可见），并在代码审查阶段通过自动化工具验证。
• 反模式与迁移路径：针对既有不一致的 UI，提供具体的迁移建议（如将硬编码的 #FFFFFF 替换为 surface 令牌，或重构非语义化的间距值）。

适用边界与关键注意点

该技能不替代人工设计评审，而是通过结构化输出降低沟通成本。它要求使用者具备基础的设计系统知识（如理解令牌与组件的关系），且不自动修复代码问题。当视觉审美与无障碍要求冲突时，必须优先满足可访问性，并在输出中明确标注冲突点。对于新引入的设计模式，需提供完整的迁移指南，避免局部优化破坏全局一致性。