Visual Prompt Coach — Design skill for Claude Code

visual-prompt-coach

A Claude Code skill that turns "I need a visual for this lesson" into a **tool-appropriate, instructionally-sound prompt** — with the framework rationale to back it up.

Built for authors of **technical / software course materials**.

What it does

Runs a short intake (four questions, max), classifies what the visual is actually supposed to teach, applies established visual-thinking and multimedia-learning frameworks, and returns three things:

1. Framework rationale — which frameworks shaped the output and the single decision each one drove.
2. Tool recommendation — Mermaid / PlantUML for structural diagrams, Gemini / Nano Banana for illustrations and infographics.
3. Ready-to-paste prompt — a fenced Mermaid block or a structured image-generation prompt.

In scope: diagrams, illustrations, infographic panels. Out of scope: data charts.

Install

Option 1 — skillsmith (recommended, user-level)

skillsmith import wrsmith108/visual-prompt-coach

Option 2 — manual, user-level

git clone https://github.com/wrsmith108/visual-prompt-coach \
  ~/.claude/skills/visual-prompt-coach

Option 3 — project-level

git clone https://github.com/wrsmith108/visual-prompt-coach \
  .claude/skills/visual-prompt-coach

Trigger phrases

The skill auto-loads when you say any of:

• "design a visual / diagram / illustration"
• "course diagram", "diagram for a lesson"
• "illustration prompt", "infographic for a lesson"
• "visualize this concept", "what diagram should I use"
• "help me prompt an image for..."

Example

**You:** Help me design a diagram for a lesson on OAuth 2.0 authorization code flow.

The skill will ask up to four questions — learning objective, what's being shown, audience prior knowledge, and any hard constraints — then return something like:

**Framework rationale:** Dan Roam's 6×6 picked a sequence diagram over a flowchart because the question is "how" across multiple acto