用途：为每个设计意图（Web 应用、移动应用、站点或其中一部分）生成一个自包含的设计文件夹，把设计规范与可运行预览放在一起。构建与修改走同一套步骤，产物一致。
主要能力：design.md 采用 DESIGN.md 格式，并扩展 motion、voice、implementation、decisions 等章节；UI 区块与功能界面是可运行的 React 预览，每个都配有与其代码通过标记关联的 .design.ts 规范；功能把多个界面组织成流程；复制的 Vite 查看器以 Board 和 Play 两种方式展示全部流程与 UI 区块。动效系统在 system/motion.css 与 system/motion.ts 中声明每个 --motion-* 令牌并实现各原语，含减少动效行为。
依赖：查看器、类型检查与令牌导出需要 Node.js 20.19+ 与 npm。
用法：先读 design-contract.md 与 preview-contract.md，再执行步骤——解析设计根（不存在则初始化）；填写输入（为空必填项询问一次）；划定范围（列出涉及的 feature、UI 区块、动效原语）；编写或编辑 design.md 后运行 npm run tokens；实现动效系统、UI 区块与 feature；最后同步确认，回复根路径、design.md 路径、如何查看（在根目录运行 npm run dev）、构建或变更内容、已记录决策与缺口。修改时只处理变更所及的范围。
适用场景：需要在可读写仓库文件并可运行 npm 的环境中，按设计技能构建或修改设计时。
限制：部分细节（如具体令牌默认值、预览查看器的完整行为）资料未完整展开；输出上限等未提供。