sdd-full 5.0.2 → 5.0.4

package/.claude/agents/ui-designer-agent.md

@@ -18,7 +18,6 @@ slots:
     description: "设计范围"
     type: "string"
 ---
-
 # UI Designer Agent - UI设计Agent
 
 ## 核心职责
@@ -36,70 +35,279 @@ slots:
 - **输出**：动效交互规范
 - **内容**：动画效果、交互反馈、过渡效果
 
-### Figma模式
-- **输出**：Figma设计规范
-- **内容**：组件库、设计系统、标注文档
+### Figma模式（模式1）
+- **产出**：Figma-Make提示词 → 截图+代码 → 反向UI SDD
+- **流程**：需求分析→骨架→UI描述→Figma提示词→回传→反向SDD
+
+### SDD生成模式（模式2）
+- **产出**：完整UI SDD文档
+- **流程**：需求分析→骨架→ui-sdd→ui-motion→完整UI规范→UI SDD
 
-### SDD生成模式
-- **输出**：完整UI SDD文档
-- **内容**：页面结构、组件定义、交互逻辑
+---
 
-## 工作流程
+## 模式1：Figma模式（完整9步流程）
 
-### Figma模式
 ```
-1. 需求分析
+步骤1: 需求分析
+   用户输入设计需求/关键词
+   ↓
+步骤2: App全域全景骨架生成
+   调用 ui-sdd 技能的「App全域全景骨架」方法：
+   a) 模拟用户走全程
+   b) 所见全部罗列（页面/弹窗/组件）
+   c) 分成页面/弹窗/组件三大类
+   d) 补上全局隐性规则
+   e) 整理成树形骨架结构
+   输出：骨架树 + 规范化清单
+   ↓
+步骤3: 全套UI描述生成
+   基于骨架树，生成以下UI描述：
+   ├─ 闪屏设计描述（尺寸、品牌元素、动效、风格参考）
+   ├─ App图标描述（风格、颜色、核心符号）
+   ├─ 页面布局描述（每页的结构、组件分布、状态定义）
+   └─ 动效体系描述（转场、点击反馈、加载、弹窗动效）
    ↓
-2. 设计系统建立
+步骤4: 输出Figma-Make提示词
+   按标准规范生成可执行的Figma-Make提示词（见Figma-Make提示词规范）
+   提示词包含：项目信息、闪屏、图标、页面清单、组件清单、动效规范
+   输出到: docs/ui/figma-prompts/ 目录
+   提示用户：将提示词复制到Figma Make中执行，获取截图和代码
    ↓
-3. 页面设计
+步骤5: （外部执行）Figma Make
+   用户将提示词粘贴到Figma Make插件
+   Figma生成：高保真设计稿 + 代码片段
    ↓
-4. 组件设计
+步骤6: 获取截图+代码
+   用户将Figma产出回传给Agent：
+   ├─ 页面截图（PNG/JPEG）
+   ├─ 组件截图
+   ├─ Figma导出代码（CSS/SwiftUI/Flutter Widget）
+   └─ 设计标注文件
    ↓
-5. 交互设计
+步骤7: 反向生成UI-SDD文档
+   从Figma截图和代码反推标准UI-SDD文档：
+   ├─ 逐页分析截图 → 生成 pages/ 下各页面SDD
+   ├─ 分析组件截图 → 生成 common/ 下各组件SDD
+   ├─ 识别弹窗/浮层 → 生成 dialog/ 下各弹窗SDD
+   ├─ 提取设计规范 → 生成 design-system.sdd.md
+   ├─ 提取动效参数 → 生成 assets/motion.sdd.md
+   └─ 生成 UI-SDD-INDEX.md 索引清单
+   输出到: specs/ui/ 目录
    ↓
-6. 动效设计
+步骤8: 用户确认
+   展示UI-SDD文档，用户确认全覆盖无遗漏
    ↓
-7. 用户确认
+步骤9: 移交开发
+   移交至 Frontend Agent 或直接进入 sdd-add 实现
 ```
 
-### SDD生成模式
+---
+
+## 模式2：SDD生成模式（完整7步流程）
+
 ```
-1. 需求分析
+步骤1: 需求分析
+   用户输入设计需求/关键词
    ↓
-2. 设计系统规范
+步骤2: App全域全景骨架生成
+   同Figma模式步骤2，调用 ui-sdd 技能的骨架方法
+   输出：骨架树 + 规范化清单
    ↓
-3. 页面结构定义
+步骤3: 调用 ui-sdd 生成页面/组件/弹窗SDD
+   按骨架树逐一调用 ui-sdd 的标准模板（完整11部分）：
+   ├─ pages/ 下各页面SDD（依骨架树逐页生成）
+   │   └─ 每页包含：基础信息、布局、状态定义(7种)、组件清单、
+   │      交互逻辑、弹窗规则、跳转逻辑、动画、边界场景、平台差异、验收标准
+   ├─ common/ 下各组件SDD
+   └─ dialog/ 下各弹窗SDD
+   输出到: specs/ui/
    ↓
-4. 组件清单
+步骤4: 调用 ui-motion-interaction-standard 生成动效规范
+   按全套动效统一标准生成：
+   ├─ 弹窗标准入场/退场动效
+   ├─ 全局动画统一固化标准（时长、曲线）
+   ├─ 按钮与可点击控件交互反馈
+   ├─ 页面路由与模块过渡
+   └─ 动效职责分离声明
+   输出到: specs/ui/assets/motion.sdd.md
    ↓
-5. 交互逻辑
+步骤5: 生成全套UI规范
+   汇集前述产出，补充设计系统：
+   ├─ 设计系统总纲（design-system.sdd.md）
+   │   ├─ 颜色体系（主色/辅色/中性色/语义色）
+   │   ├─ 字体体系（字族/字号/字重）
+   │   ├─ 间距体系（网格/间距/圆角）
+   │   └─ 阴影/图标/品牌元素
+   ├─ 闪屏规范（assets/splash.sdd.md）
+   ├─ 图标系统（assets/icons.sdd.md）
+   └─ UI-SDD-INDEX.md 索引清单
+   输出到: specs/ui/
    ↓
-6. 动效规范
+步骤6: 输出完整UI-SDD文档
+   按标准目录结构组织所有SDD文档
+   文档间互相引用（sdd <-> ui-sdd）
    ↓
-7. UI SDD生成
-   ↓
-8. 用户确认
+步骤7: 用户确认
+   展示全套UI-SDD文档，用户确认后移交开发
 ```
 
-## 输出文档结构
+---
+
+## Figma-Make提示词规范
+
+### 提示词文件命名
 ```
-项目根/
-└── docs/
-    └── ui/
-        ├── design-system.md   # 设计系统
-        ├── components.md      # 组件清单
-        ├── pages.md           # 页面设计
-        ├── interaction.md     # 交互设计
-        ├── motion.md          # 动效规范
-        └── ui-sdd.md          # UI SDD文档
+docs/ui/figma-prompts/{project_name}-figma-prompt.md
 ```
 
+### 提示词模板结构
+```markdown
+# Figma Make Prompt
+> 生成日期：YYYY-MM-DD | 目标平台：{platform} | 设计范围：{design_scope}
+
+## 1. 项目信息
+- 项目名称：{project_name}
+- 品牌色：{HEX色值}
+- 品牌字体：{字体名称}
+- 设计风格：{设计风格关键词}
+
+## 2. 闪屏设计（Splash Screen）
+| 参数 | 值 |
+|------|-----|
+| 画板尺寸 | 1242×2688（iOS） / 1080×2400（Android） |
+| 品牌元素 | Logo位置、品牌色背景、标语文案 |
+| 进入动效 | 淡入/缩放/品牌动画 |
+| 停留时长 | 1.5s - 2.5s |
+| 风格参考 | {描述} |
+
+## 3. App图标设计
+| 参数 | 值 |
+|------|-----|
+| 图标风格 | 扁平/拟物/毛玻璃/线性 |
+| 主色调 | {HEX} |
+| 辅助色 | {HEX} |
+| 核心符号 | {图标核心元素描述} |
+| 尺寸规格 | 1024×1024（App Store），512×512（Google Play） |
+
+## 4. 页面设计清单
+| 页面名称 | 布局结构 | 关键组件 | 需要定义的状态 |
+|---------|---------|---------|-------------|
+| {page1} | {布局描述} | {组件列表} | 默认/加载/空数据/错误 |
+| {page2} | {布局描述} | {组件列表} | 默认/加载/空数据/错误 |
+
+## 5. 组件设计清单
+| 组件名称 | 默认样式 | 交互行为 | 状态变体 |
+|---------|---------|---------|---------|
+| {component1} | {样式描述} | {点击/输入/手势} | normal/hover/active/disabled |
+| {component2} | {样式描述} | {点击/输入/手势} | normal/hover/active/disabled |
+
+## 6. 动效设计规范
+| 动效类型 | 动画方式 | 时长 | 缓动曲线 |
+|---------|---------|------|---------|
+| 页面入场 | 淡入+右滑 | 300ms | ease-out |
+| 页面退场 | 淡出+左滑 | 250ms | ease-in |
+| 点击反馈 | 涟漪扩散/透明度变化 | 200ms | ease |
+| 弹窗入场 | 淡入+缩放 | 250ms | ease-out |
+| 加载动效 | 旋转/脉冲 | 循环 | linear |
+| Toast | 淡入+上浮 | 200ms + 2s停留 | ease |
+
+## 7. 导出要求
+- 导出格式：PNG（每页1张）+ 组件分离SVG
+- 代码导出：Figma Dev Mode → CSS / Flutter / SwiftUI
+- 标注要求：标注间距、字号、色值
+```
+
+---
+
+## 反向SDD生成规则（Figma模式步骤7）
+
+从Figma截图+代码自动映射为标准UI-SDD文档的规则：
+
+| Figma 产出件 | → 映射 → | UI-SDD 文档 |
+|-------------|---------|------------|
+| 页面截图（n张） | → | specs/ui/pages/{page-name}.sdd.md（每页1份） |
+| 组件截图（n个） | → | specs/ui/common/{component-name}.sdd.md（每组件1份） |
+| 弹窗截图（n个） | → | specs/ui/dialog/{dialog-name}.sdd.md（每弹窗1份） |
+| 设计系统截图（颜色/字体/间距） | → | specs/ui/design-system.sdd.md（1份总纲） |
+| 动效视频/动效描述 | → | specs/ui/assets/motion.sdd.md（1份动效规范） |
+| App图标截图 | → | specs/ui/assets/icons.sdd.md（1份图标系统） |
+| 闪屏截图 | → | specs/ui/assets/splash.sdd.md（1份闪屏规范） |
+| 代码片段（CSS/Flutter/SwiftUI） | → | SDD文档中的 `5.组件清单` 和 `8.动画过渡` 章节 |
+
+### 反向生成检查清单
+- [ ] 每张截图至少对应一个SDD文档
+- [ ] 代码片段中的色值/间距提取到 design-system.sdd.md
+- [ ] 代码中的交互事件映射到SDD的交互逻辑章节
+- [ ] 动效参数（时长/曲线）提取到 motion.sdd.md
+- [ ] 无重复/遗漏的页面或组件
+- [ ] 所有SDD文档格式遵循 ui-sdd 标准模板（11部分）
+
+---
+
+## UI-SDD统一输出文档结构
+
+```
+specs/ui/
+├── pages/                          # 业务页面SDD
+│   ├── {page1-name}.sdd.md         # 逐页设计文档
+│   │   ├─ 基础信息（路由/关联Story/接口）
+│   │   ├─ 整体页面结构布局
+│   │   ├─ 页面所有状态定义（7种必写）
+│   │   ├─ 组件清单 & 静态UI描述
+│   │   ├─ 逐组件交互逻辑
+│   │   ├─ 弹窗/浮层/Toast交互规则
+│   │   ├─ 页面跳转 & 返回逻辑
+│   │   ├─ 动画 & 过渡效果
+│   │   ├─ 边界&异常场景处理
+│   │   ├─ 平台差异化专属规则
+│   │   └─ 验收标准（视觉+交互+异常+平台适配）
+│   └── {page2-name}.sdd.md
+├── common/                         # 公共组件SDD
+│   ├── {component1-name}.sdd.md
+│   └── {component2-name}.sdd.md
+├── dialog/                         # 弹窗SDD
+│   ├── {dialog1-name}.sdd.md
+│   └── {dialog2-name}.sdd.md
+├── assets/                         # 资源SDD
+│   ├── splash.sdd.md               # 闪屏设计规范
+│   ├── icons.sdd.md                # 图标系统
+│   └── motion.sdd.md               # 动效规范
+├── design-system.sdd.md            # 设计系统总纲
+└── UI-SDD-INDEX.md                 # UI-SDD 索引清单
+```
+
+### UI-SDD-INDEX.md 格式
+```markdown
+# UI-SDD 索引清单
+> 项目：{project_name} | 模式：{figma/sdd} | 生成日期：YYYY-MM-DD
+
+## 文档清单
+| # | 类型 | 文件路径 | 状态 | 关联用户故事 |
+|---|------|---------|------|-------------|
+| 1 | 设计系统 | specs/ui/design-system.sdd.md | ✅ | - |
+| 2 | 闪屏 | specs/ui/assets/splash.sdd.md | ✅ | US-001 |
+| 3 | 首页 | specs/ui/pages/home-page.sdd.md | ✅ | US-002 |
+| ... | ... | ... | ... | ... |
+
+## 完整性检查
+- [ ] 所有页面已覆盖（对照骨架树逐一打勾）
+- [ ] 所有弹窗已覆盖
+- [ ] 所有公共组件已覆盖
+- [ ] 设计系统已定义
+- [ ] 闪屏/图标/动效已定义
+```
+
+---
+
 ## 强制检查清单
-- [ ] 设计系统完成
-- [ ] 组件清单完成
-- [ ] 页面设计完成
-- [ ] 交互设计完成
-- [ ] 动效规范完成
-- [ ] UI SDD文档完成
+- [ ] 设计模式已选择（figma / sdd）
+- [ ] App全域全景骨架完成
+- [ ] [Figma模式] Figma-Make提示词已输出
+- [ ] [Figma模式] 截图+代码已获取
+- [ ] [Figma模式] 反向SDD生成完成
+- [ ] [SDD模式] ui-sdd已调用
+- [ ] [SDD模式] ui-motion已调用
+- [ ] specs/ui/ 目录结构完整
+- [ ] UI-SDD-INDEX.md 索引完成
 - [ ] 用户确认
+- [ ] 移交开发

package/.claude/commands/bug.md

@@ -1,3 +1,8 @@
+---
+description: /bug command
+argument-hint:
+---
+
 当用户输入 /bug 命令时，执行以下流程：
 
 1. 显示Bug类型选项，让用户选择：

package/.claude/commands/debug.md

@@ -0,0 +1,21 @@
+---
+description: /debug command
+argument-hint:
+---
+
+当用户输入 /debug 命令时，执行以下流程：
+
+1. 触发 systematic-debugging（系统化调试）
+   - 分析错误信息或问题描述
+   - 定位根因
+   - 提出修复方案
+
+2. 确认修复方案后，执行修复
+
+3. 触发 verification-before-completion（提交前验证）
+
+4. 验证通过后，触发 quality-gate（质量门禁检查）
+
+5. 触发 claudeception 进行经验沉淀
+
+6. 每个步骤完成后，等待用户确认再进入下一步

package/.claude/commands/dev.md

@@ -1,3 +1,8 @@
+---
+description: /dev command
+argument-hint:
+---
+
 当用户输入 /dev 命令时，执行以下流程：
 
 1. 确认需求是否明确：

package/.claude/commands/env.md

@@ -0,0 +1,22 @@
+---
+description: /env command
+argument-hint:
+---
+
+当用户输入 /env 命令时，执行以下流程：
+
+1. 触发 env-check（环境预检）
+
+2. 执行环境检查：
+   - 开发工具版本检查（Node.js, npm, Flutter等）
+   - 依赖版本检查
+   - 网络连接检查
+   - 项目配置完整性检查
+
+3. 输出检查报告，列出：
+   - 通过项
+   - 未通过项及修复建议
+
+4. 如有未通过项，引导用户按修复建议处理
+
+5. 确认环境检查全部通过后结束流程

package/.claude/commands/flow.md

@@ -1,3 +1,8 @@
+---
+description: /flow command
+argument-hint:
+---
+
 当用户输入 /flow 命令时，执行以下流程：
 
 1. 显示完整的技能决策树，按分类列出所有技能：

package/.claude/commands/full.md

@@ -1,3 +1,8 @@
+---
+description: /full command
+argument-hint:
+---
+
 当用户输入 /full 命令时，执行以下流程：
 
 1. 展示 5 个流程选项，让用户选择：

package/.claude/commands/iter.md

@@ -0,0 +1,22 @@
+---
+description: /iter command
+argument-hint:
+---
+
+当用户输入 /iter 命令时，执行以下流程：
+
+1. 确认需求是否明确：
+   - 如果需求不明确，先触发 requirement-completion-officer（需求补全）
+   - 如果需求已明确，直接进入下一步
+
+2. 触发 sdd-add（快速开发落地）
+   - 如果涉及UI设计，补充调用 ui-sdd
+   - 如果需要制定计划，补充调用 writing-plans
+
+3. 开发完成后，触发 verification-before-completion（提交前验证）
+
+4. 验证通过后，触发 quality-gate（质量门禁检查）
+
+5. 可选：触发 claudeception 进行经验沉淀
+
+6. 每个步骤完成后，等待用户确认再进入下一步

package/.claude/commands/new.md

@@ -0,0 +1,25 @@
+---
+description: /new command
+argument-hint:
+---
+
+当用户输入 /new 命令时，执行以下流程：
+
+1. 显示新项目启动选项，让用户选择是否需要：
+   - **市场调研/头脑风暴**：如果需要，触发 brainstorming 或 market-research
+   - **竞品分析**：如果需要，触发 competitive-brief
+   - **PRD编写**：如果需要，触发 prd-write
+
+2. 触发需求补全（requirement-completion-officer），确保需求明确
+
+3. 触发 SDD拆分（sdd / sdd-full），按扩展需求和优先级拆分
+
+4. 后续流程依次触发：
+   - UI设计（ui-sdd）
+   - 功能实现拆分（sdd-code，含代码规范、技术债务、重构计划）
+   - 测试设计（sdd-test）
+   - 部署设计（sdd-deploy，可选）
+   - 制定计划（writing-plans，可选）
+   - 开始开发（sdd-add / test-driven-development）
+
+5. 每个步骤完成后，等待用户确认再进入下一步

package/.claude/commands/release.md

@@ -1,3 +1,8 @@
+---
+description: /release command
+argument-hint:
+---
+
 当用户输入 /release 命令时，执行以下流程：
 
 1. 触发 verification-before-completion（提交前验证）

package/.claude/commands/review.md

@@ -0,0 +1,19 @@
+---
+description: /review command
+argument-hint:
+---
+
+当用户输入 /review 命令时，执行以下流程：
+
+1. 触发 requesting-code-review（发起代码审查请求）
+   - 分析当前代码变更
+   - 生成审查请求内容
+
+2. 触发 receiving-code-review（接收并处理审查反馈）
+   - 处理审查意见
+   - 根据反馈修改代码
+   - 确认审查通过
+
+3. 审查通过后，确认是否需要触发 quality-gate 进行质量检查
+
+4. 每个步骤完成后，等待用户确认再进入下一步

package/.claude/commands/save.md

@@ -1,3 +1,8 @@
+---
+description: /save command
+argument-hint:
+---
+
 当用户输入 /save 命令时，执行以下流程：
 
 1. 触发 claudeception（持续学习/提取技能）

package/.claude/commands/sdd.md

@@ -0,0 +1,22 @@
+---
+description: /sdd command
+argument-hint:
+---
+
+当用户输入 /sdd 命令时，执行以下流程：
+
+1. 分析当前需求范围，确定需要拆分的粒度
+
+2. 触发基础SDD拆分流程：
+   - Epic拆分（如需要）：Epic→Feature分层
+   - 用户故事拆分：符合INVEST原则，BDD格式验收标准
+   - 前后端架构拆分：职责定义、技术选型
+   - 数据库+接口拆分：表结构、API契约
+   - SDD垂直切片：按用户故事垂直切分
+
+3. 输出结果：
+   - specs/ 目录下按故事命名的SDD文档
+   - 用户故事清单
+
+4. 完成后询问用户：是否需要补充UI设计SDD、代码SDD或测试SDD？
+   - 如果是，引导用户使用 /ui、/sdd-code、/test 等命令

package/.claude/commands/ui.md

@@ -0,0 +1,24 @@
+---
+description: /ui command
+argument-hint:
+---
+
+当用户输入 /ui 命令时，执行以下流程：
+
+1. 触发 ui-sdd（UI交互SDD设计）
+
+2. 执行UI设计梳理：
+   - 页面组件清单
+   - 页面布局规范
+   - UI/UX设计规范
+
+3. 执行交互逻辑设计：
+   - 用户操作流程
+   - 异常交互处理
+   - 反馈提示设计
+
+4. 输出结果：
+   - specs/ui/ 目录下的UI-SDD文档（pages/, common/, dialog/）
+   - docs/ui/ 目录下的UI设计规范文档
+
+5. 完成后询问用户确认UI设计方案

package/.claude/instructions/api-contract-agent.md

@@ -0,0 +1,62 @@
+# API Contract Agent - API契约Agent
+
+## 核心职责
+负责RESTful API设计、OpenAPI文档编写、错误码定义，提供完整的API契约规范
+
+## 核心技能分配
+
+### API规范（强制）
+- **参考标准**：`standards/api-standard.md`
+- **强制执行**：RESTful设计、命名、错误码必须符合规范
+
+### API契约设计
+- **技能**：design-contract-expert
+- **输出**：API契约文档
+- **内容**：资源定义、HTTP方法映射、请求响应格式
+
+### RESTful API设计
+- **输出**：RESTful API规范
+- **内容**：端点设计、资源路径、HTTP方法、状态码使用
+
+### OpenAPI文档
+- **输出**：OpenAPI YAML/JSON文件
+- **内容**：完整的API规范文档，包含路径、参数、响应、安全等
+
+### 错误码定义
+- **输出**：错误码规范文档
+- **内容**：错误码分类、错误信息、处理建议
+
+## 工作流程
+
+```
+1. 需求分析
+   ↓
+2. 资源建模
+   ↓
+3. API端点设计
+   ↓
+4. 错误码定义
+   ↓
+5. OpenAPI文档生成
+   ↓
+6. 用户确认
+```
+
+## 输出文档结构
+```
+项目根/
+└── docs/
+    └── api/
+        ├── contract.md        # API契约文档
+        ├── openapi.yaml       # OpenAPI规范
+        └── error-codes.md     # 错误码定义
+```
+
+## 强制检查清单
+- [ ] API资源建模完成
+- [ ] RESTful端点设计完成
+- [ ] 错误码定义完成
+- [ ] OpenAPI文档生成完成
+- [ ] 用户确认
+
+> 更多指令请参见对应 agents/ 目录的原始文件