skills.rest
coco-de
coco-deOFFICIAL
Explore all skills by this author →
GitHub

UX Designer

Translate requirements into wireframes, user flows, and accessibility annotations.

1|Updated Feb 6, 2026
Search Tags:#design#accessibility#wcag#handoff#user-flows#wireframes#ux
One-click install
npx skills add https://github.com/coco-de/bmad --skill ux-designer-coco-de
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: UX Designer
Source: https://github.com/coco-de/bmad/tree/main/skills/bmad/bmm/ux-designer
Command: npx skills add https://github.com/coco-de/bmad --skill ux-designer-coco-de

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designers often struggle to translate complex requirements into clear, usable interfaces. This skill provides a structured UX workflow, wireframe guidance, and accessibility considerations to align teams and accelerate design delivery.

Core Features & Use Cases

  • Create user flows and wireframes based on requirements and acceptance criteria.
  • Define accessibility considerations (WCAG) and document design systems for developers.
  • Collaborate with Product Manager and Developers to hand off design specs.

Quick Start

Load PRD/tech-spec requirements and initiate the UX design workflow to produce wireframes, flows, and accessibility annotations.

Frequently Asked Questions about UX Designer

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I translate requirements into wireframes and user flows?▼

To translate requirements into wireframes and user flows, load PRD or tech-spec requirements to initiate a structured UX workflow that delivers intuitive user experiences and aligns teams.

What is the best way to document accessibility design for developers?▼

Documenting accessibility design involves defining WCAG considerations and capturing them as annotations within developer handoff artifacts to ensure seamless, accessible user experiences.

Can I use this UX workflow for solutioning during early planning phases?▼

Yes, you can use this UX workflow for solutioning during Phase 2-3 planning to assess design patterns, evaluate accessibility constraints, and produce user flows based on acceptance criteria.

How do I prepare design-system documentation for developer handoff?▼

Preparing design-system documentation requires assessing project config and requirements to generate structured handoff artifacts that define design specs and accessibility considerations for developers.

What limitations exist when creating wireframes based on acceptance criteria?▼

Creating wireframes based on acceptance criteria requires loading project config and requirements first; limitations arise if input requirements lack sufficient detail to assess design patterns and accessibility constraints effectively.

Related Skills

Explore More Design & Creative Skills→
ilandahanilandahan
9

role-product-manager

Guide product discovery, PRD creation, and phase-specific deliverables.

Community
Basic
aj-geddesaj-geddes
472

UX Designer

Design user flows and ASCII wireframes with WCAG 2.1 AA accessibility specifications.

Community
Basic
nilecuinilecui
27

ux-designer

Design user experiences with wireframes, user flows, and WCAG 2.1 AA accessibility.

Community
Advanced
projectedanxprojectedanx
1

claude-design

Generate high-fidelity HTML design artifacts like prototypes and UI components.

Community
Advanced