用途:该技能要求在任何新 AI 功能 UI 组件实现之前,必须先写出书面规格(shape/spec),涵盖布局、状态、文案与交互四部分,然后再写一行代码。核心观点是:没有规格就写的代码永远只是原型。
适用时机:实现新的 AI 功能 UI 组件前;重构会改变交互模式的组件前;为 AI 产品新增页面或主要区块前;实现智能体或多步 AI 工作流的输出前。不适用:对已有设计组件做热修复(改文案、调颜色)、纯后端无 UI 改动、明确标注为一次性丢弃的原型。
规格四要素:1)布局——用文字或 ASCII 描述视觉结构,注明列宽、对齐、响应式行为、最大宽度限制;2)状态——列出组件各状态及对应视觉差异(如 Loading、Error、Success);3)文案——写出每个文本元素的最终文字,不能用占位;4)交互——每个用户操作映射到后果(如发送→POST /api/chat→显示加载→流式返回,停止→中止流→显示部分内容+继续按钮,重试、复制、点踩等)。
使用流程:第一步写规格,创建 design/specs/<component-name>.md;第二步检查完整性(各状态是否有视觉处理、文案是否齐全、响应式是否定义、每个操作是否有后果、边界情况是否记录);第三步按规格实现,若发现规格缺口应先更新规格再继续;第四步实现后逐节对照规格复核,差异要么是规格更新,要么是回归。
完成格式:满足后声明“Spec written.”并列出组件名、文件路径、布局/状态/文案/交互/边界情况均已覆盖,最后写“Ready to implement.”。
限制:资料未提供该技能的具体安装方式、命令行用法、收费或平台支持信息;其内容以方法论和示例为主。