/generate-visual-plan
Generate a visual implementation plan
> /plugin marketplace add nicobailon/visual-explainer > /plugin install visual-explainer@visual-explainer-marketplace
How it fires
How this command gets triggered: by you, by Claude, or both.
- Fires itselfClaude auto-loads it when your prompt matches the work.
- You can call itInvoke it directly when you want it.
- Slash command
/generate-visual-plan
Context preview
What this command does when you run it.
Generate a visual implementation plan
Command definition
generate-visual-plan.mdname: generate-visual-plan description: Generate a visual implementation plan
Load the visual-explainer skill and generate a self-contained HTML implementation plan for: $@
Research first
Read relevant repo files before planning. Identify entry points, existing patterns, affected modules, public APIs, tests, config/schema/data model, similar features, and constraints from README/CHANGELOG/docs.
Required page sections
1. Goal and scope: what will change and what is intentionally out. 2. Current state: short diagram/table of existing architecture. 3. Proposed design: architecture/data/control flow, preferably Mermaid or hybrid cards. 4. Implementation sequence: ordered phases with dependencies. 5. File map: files to create/edit/delete and why. 6. Interface/contracts: types, APIs, schemas, CLI flags, config, events. 7. Risk and decision matrix: correctness, tests, migration, release, UX, security/privacy, performance. 8. Test plan: unit/integration/e2e/edge cases mapped to files. 9. Acceptance checklist: observable done criteria.
Use hierarchy: overview and architecture dominate; detailed file/test/reference sections stay compact or collapsible. Follow the skill’s Mermaid, table, overflow, and delivery rules.
Write to `~/.agent/diagrams/` and open in browser.
An agent skill that turns complex terminal output into styled HTML pages you actually want to read. Ask your agent to explain a system architecture, review a diff, or compare requirements against a plan.
Repo: nicobailon/visual-explainer
Other commands on visual-explainer-marketplace.
- /diff-review
Generate a visual diff review for code changes
Open command - /fact-check
Verify a generated document against actual code and git history
Open command - /generate-slides
Generate a slide deck as a self-contained HTML page
Open command - /generate-web-diagram
Generate a standalone HTML diagram and open it in the browser
Open command - /plan-review
Compare an implementation plan against the current codebase
Open command - /project-recap
Generate a visual project recap for context switching
Open command