Infographic Generator

Two dimensions: layout (information structure) × style (visual aesthetics). Freely combine any layout with any style.

Usage /baoyu-infographic path/to/content.md /baoyu-infographic path/to/content.md --layout hierarchical-layers --style technical-schematic /baoyu-infographic path/to/content.md --aspect portrait --lang zh /baoyu-infographic # then paste content

Options Option Values --layout 20 options (see Layout Gallery), default: bento-grid --style 17 options (see Style Gallery), default: craft-handmade --aspect landscape (16:9), portrait (9:16), square (1:1) --lang en, zh, ja, etc. Layout Gallery Layout Best For linear-progression Timelines, processes, tutorials binary-comparison A vs B, before-after, pros-cons comparison-matrix Multi-factor comparisons hierarchical-layers Pyramids, priority levels tree-branching Categories, taxonomies hub-spoke Central concept with related items structural-breakdown Exploded views, cross-sections bento-grid Multiple topics, overview (default) iceberg Surface vs hidden aspects bridge Problem-solution funnel Conversion, filtering isometric-map Spatial relationships dashboard Metrics, KPIs periodic-table Categorized collections comic-strip Narratives, sequences story-mountain Plot structure, tension arcs jigsaw Interconnected parts venn-diagram Overlapping concepts winding-roadmap Journey, milestones circular-flow Cycles, recurring processes

Full definitions: references/layouts/.md

Style Gallery Style Description craft-handmade Hand-drawn, paper craft (default) claymation 3D clay figures, stop-motion kawaii Japanese cute, pastels storybook-watercolor Soft painted, whimsical chalkboard Chalk on black board cyberpunk-neon Neon glow, futuristic bold-graphic Comic style, halftone aged-academia Vintage science, sepia corporate-memphis Flat vector, vibrant technical-schematic Blueprint, engineering origami Folded paper, geometric pixel-art Retro 8-bit ui-wireframe Grayscale interface mockup subway-map Transit diagram ikea-manual Minimal line art knolling Organized flat-lay lego-brick Toy brick construction

Full definitions: references/styles/<style>.md

Recommended Combinations Content Type Layout + Style Timeline/History linear-progression + craft-handmade Step-by-step linear-progression + ikea-manual A vs B binary-comparison + corporate-memphis Hierarchy hierarchical-layers + craft-handmade Overlap venn-diagram + craft-handmade Conversion funnel + corporate-memphis Cycles circular-flow + craft-handmade Technical structural-breakdown + technical-schematic Metrics dashboard + corporate-memphis Educational bento-grid + chalkboard Journey winding-roadmap + storybook-watercolor Categories periodic-table + bold-graphic

Default: bento-grid + craft-handmade

Output Structure infographic/{topic-slug}/ ├── source-{slug}.{ext} ├── analysis.md ├── structured-content.md ├── prompts/infographic.md └── infographic.png

Slug: 2-4 words kebab-case from topic. Conflict: append -YYYYMMDD-HHMMSS.

Core Principles Preserve all source data verbatim—no summarization or rephrasing Define learning objectives before structuring content Structure for visual communication (headlines, labels, visual elements) Workflow Step 1: Setup & Analyze

1.1 Load Preferences (EXTEND.md)

Use Bash to check EXTEND.md existence (priority order):

Check project-level first

test -f .baoyu-skills/baoyu-infographic/EXTEND.md && echo "project"

Then user-level (cross-platform: $HOME works on macOS/Linux/WSL)

test -f "$HOME/.baoyu-skills/baoyu-infographic/EXTEND.md" && echo "user"

┌────────────────────────────────────────────────────┬───────────────────┐ │ Path │ Location │ ├────────────────────────────────────────────────────┼───────────────────┤ │ .baoyu-skills/baoyu-infographic/EXTEND.md │ Project directory │ ├────────────────────────────────────────────────────┼───────────────────┤ │ $HOME/.baoyu-skills/baoyu-infographic/EXTEND.md │ User home │ └────────────────────────────────────────────────────┴───────────────────┘

┌───────────┬───────────────────────────────────────────────────────────────────────────┐ │ Result │ Action │ ├───────────┼───────────────────────────────────────────────────────────────────────────┤ │ Found │ Read, parse, display summary │ ├───────────┼───────────────────────────────────────────────────────────────────────────┤ │ Not found │ Ask user with AskUserQuestion (see references/config/first-time-setup.md) │ └───────────┴───────────────────────────────────────────────────────────────────────────┘

EXTEND.md Supports: Preferred layout/style | Default aspect ratio | Custom style definitions | Language preference

Schema: references/config/preferences-schema.md

1.2 Analyze Content → analysis.md

Save source content (file path or paste → source.md) Analyze: topic, data type, complexity, tone, audience Detect source language and user language Extract design instructions from user input Save analysis

See references/analysis-framework.md for detailed format.

Step 2: Generate Structured Content → structured-content.md

Transform content into infographic structure:

Title and learning objectives Sections with: key concept, content (verbatim), visual element, text labels Data points (all statistics/quotes copied exactly) Design instructions from user

Rules: Markdown only. No new information. All data verbatim.

See references/structured-content-template.md for detailed format.

Step 3: Recommend Combinations

Recommend 3-5 layout×style combinations based on:

Data structure → matching layout Content tone → matching style Audience expectations User design instructions Step 4: Confirm Options

Present all options in single confirmation:

Combination (always): 3+ options with rationale Aspect (always): landscape/portrait/square Language (only if source ≠ user language): which language for text Step 5: Generate Prompt → prompts/infographic.md

Combine:

Layout definition from references/layouts/.md Style definition from references/styles/<style>.md Base template from references/base-prompt.md Structured content from Step 2 All text in confirmed language Step 6: Generate Image Select available image generation skill (ask user if multiple) Call with prompt file and output path On failure, auto-retry once Step 7: Output Summary

Report: topic, layout, style, aspect, language, output path, files created.

References references/analysis-framework.md - Analysis methodology references/structured-content-template.md - Content format references/base-prompt.md - Prompt template references/layouts/.md - 20 layout definitions references/styles/<style>.md - 17 style definitions Extension Support

Custom configurations via EXTEND.md. See Step 1.1 for paths and supported options.