docs: 完善 UI 设计工作流,添加设计更新步骤

### 主要改进

**UI 设计完整工作流** - 从探索到实现的完整流程:
- **场景 2 更新**:ui-design → **update** → plan → execute(新增 update 步骤)
- 明确说明需要使用 `/workflow:ui-design:update` 更新头脑风暴工件
- 确保实现遵循批准的设计原型

**新增步骤说明**:
```bash
# 第 2 步:审查设计后更新概念设计
/workflow:ui-design:update --session <session-id> --selected-prototypes "login-v1,login-v2"
```

**工作流逻辑**:
1. **explore-auto**: 生成多个设计变体
2. **update**: 将选定的设计原型引用集成到头脑风暴工件
3. **plan**: 基于更新后的设计引用生成实现计划
4. **execute**: 执行实现

**为什么需要 update 步骤**:
- 将 UI 设计决策正式纳入项目规格
- 确保实现代码参考正确的设计原型
- 保持设计和实现的一致性
- 为后续的代码生成提供设计上下文

**双语文档同步**:
- 英文版:完整的 4 步工作流说明
- 中文版:相同流程的中文说明和提示

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
catlog22
2025-10-20 14:13:01 +08:00
parent 5123675fbf
commit 360a2b9edc
2 changed files with 42 additions and 24 deletions

View File

@@ -96,7 +96,27 @@ For simple, well-defined features, use the direct "plan → execute" pattern:
> **💡 Note**: `/workflow:plan` automatically creates a session. You can also manually start a session first with `/workflow:session:start "Feature Name"`.
### Scenario 2: Complex Feature with Multi-Agent Brainstorming
### Scenario 2: UI Design Exploration
For UI-focused projects, start with design exploration before implementation: **ui-design → update → plan → execute**
```bash
# Step 1: Generate UI design variations (auto-creates session)
/workflow:ui-design:explore-auto --prompt "A modern, clean admin dashboard login page"
# Step 2: Review designs in compare.html, then update brainstorming artifacts
/workflow:ui-design:update --session <session-id> --selected-prototypes "login-v1,login-v2"
# Step 3: Generate implementation plan with design references
/workflow:plan
# Step 4: Execute the implementation
/workflow:execute
```
> **💡 Tip**: The `update` command integrates selected design prototypes into brainstorming artifacts, ensuring implementation follows the approved designs.
### Scenario 3: Complex Feature with Multi-Agent Brainstorming
For complex features requiring thorough analysis, use the complete workflow: **brainstorm → plan → execute**
@@ -124,17 +144,6 @@ For complex features requiring thorough analysis, use the complete workflow: **b
- Architectural decisions with significant impact
- When you need thorough requirements before implementation
### Scenario 3: UI Design
CCW has powerful UI design capabilities for generating prototypes from text descriptions:
```bash
# Generate UI design variations (auto-creates session)
/workflow:ui-design:explore-auto --prompt "A modern, clean admin dashboard login page"
```
After completion, open the generated `compare.html` file in your browser to preview designs.
### Scenario 4: Bug Fixing
Quick bug analysis and fix workflow: