visual-planlisted

Use when the user wants to plan a change, record an architecture decision (ADR), or recap what a diff changed — especially when the result benefits from visuals (wireframes, diagrams, before/after, annotated split-diffs). Produces a durable, committed Markdown ADR/plan as the source-of-truth record, and only when warranted ALSO emits a self-contained rich plan.html to /tmp. Markdown canonical, HTML disposable. Triggers: "plan this", "write an ADR", "visual plan", "recap this change", "visual recap", "/visual-plan". For decide-and-build ADR work, use adr.
jasonm4130/claude-skills · ★ 2 · Code & Development · score 68

Install: claude install-skill jasonm4130/claude-skills

# Visual Plan Two artifacts, markdown canonical: 1. **The committed Markdown ADR/plan** — the record. Everything markdown can render: prose, `mermaid` diagrams, GFM tables, file-trees. This is the deliverable; it is what gets committed and read in Obsidian/GitHub. 2. **A rich `plan.html` to `/tmp`** — emitted **only** when the work needs a block markdown can't express (wireframe, annotated split-diff, before/after columns, tabbed walkthrough). Disposable, regenerable, never committed. No backend, no build pipeline, no server. You author both directly. When in doubt, **markdown only**. ## Modes | Mode | From | Default output | Add rich HTML when | |---|---|---|---| | **Plan** (forward) | a spec / requirements | markdown plan | a proposed UI (wireframe) or side-by-side option (columns) clarifies the decision | | **Recap** (backward) | the real diff | markdown summary | the change is UI (wireframe) or large enough to warrant tabbed annotated split-diffs | Detect the mode from the request: "plan / ADR / decide" → Plan; "recap / what changed / summarize this diff/PR" → Recap. If unclear, ask one question. ## Markdown structure (the committed `.md`) Pick the template by intent: - **Forward + ratifying a decision** (keywords: ADR, decision record, "why did we choose X") → **ADR** template. - **Forward + work to do** → **Plan** template. - **Backward, from a diff** → **Recap** template. **ADR** (Nygard-style — a decision worth recording): ```markdown # <Title