v0.4.0

New Prompt Template

• /generate-visual-plan — generate visual implementation plans for features and extensions. Produces editorial/blueprint-style HTML pages with problem comparison panels, state machine diagrams, code snippets, edge case tables, and implementation notes.

Prose Accent Patterns

• Lead paragraphs, pull quotes, callout boxes, section dividers
• Article hero patterns (centered, editorial)
• Theme toggle with random initial mode
• Typography by content voice guidance

Code Block Patterns

• Whitespace preservation with white-space: pre-wrap
• File header pattern for displaying code with filename
• Implementation plan guidance: show structure, not full files

Mermaid Fixes

• Centering for narrow vertical flowcharts
• Scaling guidance for complex diagrams (fontSize 18-20px)
• Special character escaping in node labels (/, \, (, {)

Bug Fixes

• List marker overflow in bordered containers
• Code block whitespace preservation

v0.3.0 - Anti-Slop Guardrails

Anti-Slop Guardrails

• Added explicit "Anti-Patterns (AI Slop)" section to SKILL.md with forbidden patterns
• Removed "Neon dashboard" and "Gradient mesh" from allowed aesthetics — they always produce generic output
• Categorized aesthetics as "Constrained" (safer) vs "Flexible" (use with caution)
• Explicit forbidden fonts: Inter, Roboto, Arial, Helvetica, system-ui as primary
• Explicit forbidden colors: indigo/violet range (#8b5cf6, #7c3aed, #a78bfa), cyan-magenta-pink combination
• Explicit forbidden effects: gradient text on headings, animated glowing box-shadows, emoji section headers
• Added "The Slop Test" — 7-point checklist to catch AI-generated patterns before delivery
• Strengthened typography guidance with 5 explicit good pairings to use
• Strengthened color guidance with 5 explicit good palettes to use
• Referenced websocket-implementation-plan.html as positive example of Blueprint aesthetic

Template Fixes

• Replaced violet secondary colors in mermaid-flowchart.html with sky blue to match anti-slop guidelines
• Updated Mermaid themeVariables example in libraries.md to use teal/slate palette instead of violet

v0.2.0 — Slide Deck Mode

Slide Deck Mode

• Magazine-quality slide deck presentations as self-contained HTML files
• 10 slide types: Title, Section Divider, Content, Split, Diagram, Dashboard, Table, Code, Quote, Full-Bleed
• SlideEngine JS: keyboard/touch/wheel nav, progress bar, nav dots, slide counter
• Cinematic transitions: fade + translateY + scale, staggered child reveals
• 4 curated presets: Midnight Editorial, Warm Signal, Terminal Mono, Swiss Clean
• Unified autoFit() post-render function for Mermaid, KPI, and quote overflow
• New /generate-slides prompt; existing prompts support --slides flag
• Responsive height breakpoints for projection and small viewports

Install: pi install visual-explainer

v0.1.4

• Removed Mermaid handDrawn mode — Rough.js hachure fills are hardcoded and render unreadable diagonal scribbles inside nodes with no user-facing override. All diagrams now use look: 'classic' with custom themeVariables for visual distinction.
• Added package.json for pi install support — installs the skill and all slash commands in one step instead of git clone + manual cp

v0.1.1

• Prompts no longer require the pi-prompt-template-model extension — each prompt now explicitly loads the skill itself
• Added "Writing Valid Mermaid" section to libraries.md (quoting special chars, simple IDs, max node count, arrow styles, pipe escaping)
• Fixed mobile scroll offset in responsive-nav.md — section headings now clear the sticky nav bar via scroll-margin-top
• Added video preview to README