How ericblue/visual-explainer-skill works
Visual Explainer is a Claude Code skill for turning supplied content into generated visual explanations. The documented workflow is content intake, structured analysis, style-specific prompt construction, and image generation. The README also describes Mermaid conversion, multi-frame output, mockup controls, and OpenAI/Gemini backends. No source excerpts were provided, so implementation-level wiring is limited to documented relationships; skill behavior is attributed to the existing skill document.
Main entry points: visual-explainer.md Claude Code Skill
Components 13
Content Workflow
- Claude Code Skill
skill/visual-explainer.md - Source Content
- Content Analysis
skill/visual-explainer.md - Prompt Templates
skill/visual-explainer.md - Mermaid Conversion
skill/visual-explainer.md
Visual Formats
- Style Families
skill/visual-explainer.md - Draw-Level Control
skill/visual-explainer.md - Multi-Frame Mode
skill/visual-explainer.md - Mockup Controls
skill/visual-explainer.md
Image Generation
- OpenAI Image API
- Gemini Image API
- Generated Visual
Other components
- User
Connections 13
- User → Claude Code Skill: invokes
- User → Source Content: supplies
- Claude Code Skill → Content Analysis: analyzes
- Content Analysis → Prompt Templates: informs
- Prompt Templates → Style Families: uses templates
- Claude Code Skill → Mermaid Conversion: converts Mermaid
- Style Families → Draw-Level Control: supports control
- Style Families → Multi-Frame Mode: supports mode
- Style Families → Mockup Controls: supports controls
- Claude Code Skill → OpenAI Image API: generates image
- Claude Code Skill → Gemini Image API: generates image
- OpenAI Image API → Generated Visual: returns image
- Gemini Image API → Generated Visual: returns image