| name | decisions-visual-plan |
| description | Route technical planning and review between Decisions Mermaid viewer, BuilderIO visual-plan/recap skills, and Open Design when the work needs richer artifacts. |
Decisions Visual Planning
I am picking the right visual surface so the user can review structure before code ships — not dumping prose in chat.
Choose the surface
| User job | Use | How |
|---|
| Quick architecture / ER / sequence / state diagram | Mermaid | show_mermaid_diagram or open_page page=diagram viewer — see decisions-mermaid-diagrams |
| Approve a multi-step implementation plan with inline diagrams | visual-plan | /visual-plan skill (BuilderIO) — MDX plan with diagram blocks |
| Review a branch/PR shape before line-by-line diff | visual-recap | /visual-recap skill (BuilderIO) |
| UI mockup, deck, branded prototype, hand-drawn whiteboard | Open Design | decisions-open-design — desktop app + od mcp |
| End agent turn with clear done/blocked signal | quick-recap | Green/yellow/red status block |
Mermaid + visual-plan together
- Architecture / data-flow / API sequence in a plan → render with
show_mermaid_diagram (Decisions freestanding viewer at /diagram/).
- UI wireframes, artboards, prototype tabs → use visual-plan top canvas (see vendored
visual-plan/references/canvas.md).
- Do not duplicate: one Mermaid block for backend structure; canvas wireframes for screens — not both for the same fact.
Reference clones
Sibling to DecisionsAI (same parent as reference/ecc):
../reference/builderio-skills — BuilderIO/skills
- Vendored skills:
plugins/visual-plan-pack/skills/ (sync: python3 scripts/sync_visual_plan_pack.py)
Agent-Native Plans app (optional)
Hosted or self-hosted Plan app for sharing visual-plan MDX outside the IDE. See BuilderIO agent-native if you need shareable review links — Decisions Mermaid viewer covers the lightweight diagram case without that dependency.