Menü
设计变体模式，产出2-3个设计方案及 tradeoff 分析，供用户选择后确定最终方案
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Basierend auf der SOC-Berufsklassifikation
BMAD 全自动研发流水线编排器。编排 9 个专业 Agent（PM、架构师、UI Designer、Tech Lead、Scrum Master、Frontend、Backend、QA、DevOps）从需求到部署。 Triggers: 'boss mode', '/boss', '全自动开发', '从需求到部署', '帮我做一个', 'build this', 'ship it', '全流程', '自动化开发', '一键开发', 'start a project', 'new feature' Does NOT trigger: - 单文件修改或简单 bug 修复（直接编辑即可） - 纯代码阅读或解释（使用 read 工具） - 已有 pipeline 正在运行时的重复启动 - 极小事（预计 <30 分钟人工可完成、不需要 PRD/架构/门禁记录） Output: 完整项目代码 + PRD/架构/UI/测试/部署文档，写入 .boss/<feature>/ 目录
后端测试编写指南，包括单元测试、集成测试和E2E测试的编写方法和最佳实践
自动生成 CHANGELOG，基于 git 提交历史和 pipeline 产物信息，遵循 Conventional Commits 和 Keep a Changelog 规范
从CEO/战略视角进行商业价值评审，评估市场契合度、ROI、竞争优势、风险和战略对齐
前端测试编写指南，包括单元测试、集成测试和E2E测试的编写方法和最佳实践
Playwright E2E 测试完整方法论，涵盖项目初始化、Page Object Model、认证复用、API Mock、视觉回归、多浏览器测试、CI 集成和调试技巧
| name | ui-designer/design-variants |
| description | 设计变体模式，产出2-3个设计方案及 tradeoff 分析，供用户选择后确定最终方案 |
| version | 1.0.0 |
| agent | ui-designer |
| type | workflow |
| user-invocable | false |
| agent-invocable | true |
| dependencies | ["ui-designer/design-system"] |
| triggers | ["PRD 中明确要求提供多个设计方案对比时","用户显式要求\"给几个方案选\"或\"设计变体\"时","设计方向存在明显分歧需要决策时"] |
当设计方向不确定、存在多种合理方案、或用户希望看到不同风格的对比时，启用变体模式。 不建议在简单功能或设计方向明确时使用——避免决策疲劳。
分析 PRD 后确定变体差异维度。常见维度组合：
| 策略 | 维度 | 适用场景 |
|---|---|---|
| 风格变体 | 简约 vs 丰富 vs 极简 | 品牌/调性不确定 |
| 布局变体 | 单栏 vs 双栏 vs 卡片 | 内容组织方式不确定 |
| 交互变体 | 步骤式 vs 单页式 vs 对话式 | 用户流程不确定 |
| 复杂度变体 | MVP vs 标准 vs 豪华 | 功能范围不确定 |
原则：每个变体应该有清晰的设计理念差异，而非仅仅是颜色/字体的不同。
为每个变体（2-3个）产出：
生成结构化对比，帮助用户快速决策：
| 维度 | 方案 A | 方案 B | 方案 C |
|---|---|---|---|
| 视觉复杂度 | 高/中/低 | - | - |
| 开发成本 | X 天 | - | - |
| 用户学习曲线 | 陡/平/无 | - | - |
| 可扩展性 | 高/中/低 | - | - |
| 品牌一致性 | 高/中/低 | - | - |
| 移动端适配 | 优/良/差 | - | - |
.boss/<feature>/ui-design-variants.jsonNEEDS_CONTEXT，等待用户选择ui-design.json 和 ui-spec.md输出到 .boss/<feature>/ui-design-variants.json：
{
"schemaVersion": "1.0.0",
"artifact": "ui-design-variants",
"feature": "<feature-name>",
"updatedAt": "<ISO-8601>",
"strategy": "风格变体|布局变体|交互变体|复杂度变体",
"variants": [
{
"variantId": "A",
"name": "方案A: [名称]",
"concept": "[一句话设计理念]",
"tradeoffs": {
"pros": ["优势1", "优势2", "优势3"],
"cons": ["劣势1", "劣势2"]
},
"designData": {
"mode": "wireframe",
"pages": [],
"components": [],
"prototype": {},
"implementationHints": {}
}
}
],
"comparison": {
"dimensions": ["视觉复杂度", "开发成本", "用户学习曲线", "可扩展性", "品牌一致性", "移动端适配"],
"matrix": [
{"dimension": "视觉复杂度", "A": "中", "B": "低", "C": "高"}
]
},
"recommendation": {
"variantId": "A",
"reason": "[推荐理由]"
},
"selectedVariantId": null
}
[BOSS_STATUS]
status: NEEDS_CONTEXT
summary: 已产出 N 个设计变体，等待用户选择最终方案
missing: 用户尚未选择设计方案（方案A/B/C）
[/BOSS_STATUS]
收到用户选择后：
ui-design-variants.json 的 selectedVariantId 字段designData 写入正式 ui-design.jsonui-spec.mdDONE 状态