When should I activate this skill?

Invoke this skill when you are asking 'What should the UI look like?', need to map out a user journey, or are ready to define the visual components of a feature.

Does this skill require a PRD?

Yes, it is designed to work as a secondary step once product requirements are defined, ensuring that the interface design matches the project's functional goals.

What does the BMad UX Design skill do?

It helps designers and developers create comprehensive UX blueprints, including wireframes, user flows, and design systems, using standardized templates within Claude Code.

Can it automate the creation of graphic files?

Currently, this skill operates through collaborative text-based design conversations and structured Markdown templates to define visual logic and layout.

BMad UX Design & Wireframing

Name: BMad UX Design & Wireframing
Author: bacoco

bybacoco

•

设计工具

Designs comprehensive user experiences, wireframes, and interface flows aligned with product requirements.

The BMad UX Design skill streamlines the interface design process within Claude Code by generating structured user flows, wireframes, and design system specifications. It transforms abstract product requirements into actionable visual blueprints, ensuring every interaction state and validation plan is documented to unblock architecture and development teams. Ideal for moving from a PRD to a concrete interface strategy, it helps teams visualize the user journey before writing code.

主要功能

01Creates wireframe blueprints for UI-heavy features

02Generates detailed user flow diagrams and state transitions

03Produces UX requirements checklists linked to PRDs

04Develops consistent design system templates and component rules

0538 GitHub stars

06Defines usability validation plans for quality assurance alignment

使用场景

01Mapping complex user journeys and state diagrams for new app features

02Translating a Product Requirements Document (PRD) into a visual interface strategy

03Standardizing design components and accessibility standards across a project

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add bacoco/bmad-skills bmad-ux-design

For use in Claude.ai and ChatGPT