mb-ux-designer

What problem does it solve?

It closes the gap between product requirements and front-end implementation by producing evidence-backed UX discovery artifacts and developer-ready UI specifications that include wireframes, user flows, accessibility checks, and component annotations.

Core Features & Use Cases

• Discovery mode: audit existing screens, map user flows, produce Excalidraw wireframes, and generate a structured UI spec that feeds acceptance criteria and architecture decisions.
• Delivery mode: validate or adjust wireframes against technical constraints, finalize UI specs for fe-dev with component names, props, and interaction details.
• Accessibility & design system enforcement: run WCAG 2.1 AA checks, require design system updates as prerequisites, and insist on evidence (file paths/excerpts) for claims.
• Use case: a PM requests UX discovery for a new feature; the agent produces flow diagrams, .excalidraw wireframes, an annotated UI spec, and accessibility checklist before the feature is broken down for implementation.

Quick Start

Ask the UX Designer to perform discovery for "Add pagination" in mobile mode, audit existing screens, produce Excalidraw wireframes, and deliver a developer-ready UI spec with component names and props.