generate-wireframes

What problem does it solve?

It solves the gap between high-level screen definitions and buildable UI layout by producing low-fidelity, state-by-state wireframes and a detailed Layout Spec directly inside each screen Markdown file.

Core Features & Use Cases

• Structured visual wireframes per state: Appends a non-visual, ASCII box-drawing ## Wireframe section that shows component placement and per-state layout structure.
• Downstream-ready layout documentation: Generates an appended ## Layout Spec with concrete grid/region definitions, component inventory, per-state placement rules, and interaction patterns.
• Decision tracking for orchestrated determinism: Writes a decision-manifest.yaml capturing inferred decisions (tiered by grounding) so the orchestrator can surface them after completion.

Quick Start

Use generate-wireframes in the design Stage 4 by providing the screens_dir, product_research_path, and decision_manifest_path from the calling agent’s JSON contract.