bmad-ux-design

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

UX Blueprint Skill

UX蓝图技能

When to Invoke

触发时机

Automatically activate when user:
  • Says "What should the UI look like?", "Design the UX"
  • Asks "How should users interact?", "User flow?"
  • Mentions "wireframes", "user experience", "interface design"
  • Has PRD with UI-heavy features (Level 2-4)
  • Uses words like: UX, UI, design, wireframe, interface, usability
Specific trigger phrases:
  • "What should the UI look like?"
  • "Design the UX for [feature]"
  • "Create wireframes"
  • "User experience for [feature]"
  • "Interface design"
  • "User flow for [scenario]"
Do NOT invoke when:
  • No UI/interface in project (backend-only)
  • PRD not ready (use bmad-product-planning first)
  • Already have UX specs (skip to architecture or stories)
当用户出现以下情况时自动激活:
  • 询问"UI应该是什么样子?"、"设计UX"
  • 询问"用户应该如何交互?"、"用户流程是怎样的?"
  • 提及"wireframes(线框图)"、"user experience(用户体验)"、"interface design(界面设计)"
  • 拥有包含大量UI功能的PRD(产品需求文档)(级别2-4)
  • 使用以下词汇:UX、UI、design(设计)、wireframe(线框图)、interface(界面)、usability(可用性)
特定触发短语:
  • "UI应该是什么样子?"
  • "为[功能]设计UX"
  • "创建线框图"
  • "[功能]的用户体验"
  • "界面设计"
  • "[场景]的用户流程"
以下情况请勿触发:
  • 项目中无UI/界面(仅后端)
  • PRD未就绪(请先使用bmad-product-planning技能)
  • 已有UX规范(直接进入架构或用户故事环节)

Mission

任务目标

Design user experiences that align with BMAD requirements, documenting flows, interaction states, and validation plans that unblock architecture, delivery, and development.
设计符合BMAD要求的用户体验,记录流程、交互状态和验证计划,为架构、交付和开发工作扫清障碍。

Inputs Required

所需输入

  • prd_sections: user journeys, functional requirements, constraints
  • architecture_notes: technical or platform limits impacting UX
  • brand_guidelines: accessibility, tone, device targets, or visual standards
  • prd_sections:用户旅程、功能需求、约束条件
  • architecture_notes:影响UX的技术或平台限制
  • brand_guidelines:无障碍要求、风格基调、目标设备或视觉标准

Outputs

输出内容

  • User flows (from
    assets/user-flows-template.md.template
    )
  • Wireframes (from
    assets/wireframes-template.md.template
    )
  • Design system (from
    assets/design-system-template.md.template
    )
  • UX requirements checklist linked to PRD and stories
  • Validation plan (usability or experimentation) for quality-assurance alignment
Template locations:
.claude/skills/bmad-ux-design/assets/*.template
  • 用户流程(来自
    assets/user-flows-template.md.template
  • 线框图(来自
    assets/wireframes-template.md.template
  • 设计系统(来自
    assets/design-system-template.md.template
  • 关联PRD和用户故事的UX需求检查清单
  • 用于对齐质量保障的验证计划(可用性测试或实验)
模板位置:
.claude/skills/bmad-ux-design/assets/*.template

Process

执行流程

  1. Confirm prerequisites via
    CHECKLIST.md
    .
  2. Clarify personas, scenarios, and surfaces requiring design.
  3. Produce information architecture, flows, and state diagrams.
  4. Document component specifications and content rules tied to requirements.
  5. Define validation approach (tests, instrumentation, success signals) and share with delivery-planning and quality-assurance skills.
Note on automation: This skill currently operates through collaborative design conversation using templates. No automation scripts are required—wireframes and design artifacts are created manually using templates from
assets/
. See
scripts/README.md
for future automation roadmap.
  1. 通过
    CHECKLIST.md
    确认前置条件。
  2. 明确用户角色、场景和需要设计的界面载体。
  3. 生成信息架构、流程和状态图。
  4. 记录与需求关联的组件规范和内容规则。
  5. 定义验证方法(测试、埋点、成功指标),并与交付规划和质量保障技能共享。
**自动化说明:**该技能目前通过使用模板的协作式设计对话运行。无需自动化脚本——线框图和设计工件需使用
assets/
中的模板手动创建。未来自动化路线图请参阅
scripts/README.md

Quality Gates

质量关卡

Ensure every UX decision traces back to requirements or constraints. Run
CHECKLIST.md
prior to handoff.
确保每一项UX决策都能追溯到需求或约束条件。交付前需运行
CHECKLIST.md
进行检查。

Error Handling

错误处理

  • If requirements conflict or are missing, request clarification before designing.
  • Flag technical limitations that impact user experience and loop architecture-design.
  • Provide alternate recommendations when constraints prevent ideal UX outcomes.
  • 若需求存在冲突或缺失,设计前需请求澄清。
  • 标记影响用户体验的技术限制,并联动架构设计环节。
  • 当约束条件无法实现理想UX效果时,提供替代方案建议。