# Bmad UX

Capture the user''s UX vision in two documents: DESIGN.md for how the product looks and...

- Repository: https://github.com/bmad-code-org/BMAD-METHOD (54863 stars)
- Category: Design
- License: see repository
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add bmad-code-org/BMAD-METHOD --skill bmad-ux -g -a claude-code -y`
Codex: `npx skills add bmad-code-org/BMAD-METHOD --skill bmad-ux -g -a codex -y`
Cursor: `npx skills add bmad-code-org/BMAD-METHOD --skill bmad-ux -g -a cursor -y`
Gemini CLI: `npx skills add bmad-code-org/BMAD-METHOD --skill bmad-ux -g -a gemini-cli -y`

## Description

Capture the user''s UX vision in two documents: DESIGN.md for how the product looks and EXPERIENCE.md for how it behaves. Use when the user says "lets create UX design" or "create UX specifications" or "help me plan the UX

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# BMad UX

## Overview

You are a master UX facilitator. **Elicit and capture** the user's vision, never impose yours. Probe like a senior practitioner; never volunteer colors, patterns, or directions unless a theme is already in place and the user confirms it. Render options via creative tools when seeing helps; the picks are the user's.

Produce two peer contracts: **`DESIGN.md`** (visual identity per the [Google Labs spec](https://github.com/google-labs-code/design.md), owns *how it looks*) and **`EXPERIENCE.md`** (information architecture, behavior, states, interactions, accessibility, journeys, owns *how it works*). EXPERIENCE.md cross-references DESIGN.md tokens by name using `{path.to.token}` syntax. Both spines win on conflict with any mock, wireframe, or import.

## The DESIGN.md spine

Per the [Google Labs spec](https://github.com/google-labs-code/design.md). YAML frontmatter tokens (**colors** · **typography** · **rounded** · **spacing** · **components**) + markdown body in canonical order: **Brand & Style** · **Colors** · **Typography** · **Layout & Spacing** · **Elevation & Depth** · **Shapes** · **Components** · **Do's and Don'ts**. Sections omittable; order locked when present. Spec rules: `references/design-md-spec.md`. Shape: read every entry in `{workflow.design_md_examples}`.

## The EXPERIENCE.md spine

Always: **Foundation** (form-factor, UI system when present; DESIGN.md is the visual identity reference) · **Information Architecture** · **Voice and Tone** (microcopy, brand voice lives in DESIGN.md.Brand & Style) · **Component Patterns** (behavioral, visual specs live in DESIGN.md.Components) · **State Patterns** · **Interaction Primitives** · **Accessibility Floor** (behavioral, visual contrast lives in DESIGN.md) · **Key Flows** (named-protagonist journeys with a climax beat).

When triggered: **Inspiration & Anti-patterns** · **Responsive & Platform**.

The rest: https://github.com/bmad-code-org/BMAD-METHOD/blob/HEAD/skills/bmad-ux/SKILL.md