UI Design Workflow

Follow this pipeline for any project involving UI. Steps 0, 1, 3, and everything under Best Practices need no external tooling. Step 2 is optional and depends on an MCP server you may not have installed.

Step 0: Structural Wireframing (ASCII First)

• Before any visual design, produce ASCII wireframes for each screen or layout.
• This forces structural thinking (hierarchy, sections, flow) before aesthetics.
• Present wireframes for approval before moving to the PRD.

Step 1: PRD Creation