Generates professional infographics with 20 layout types and 17 visual styles. Analyzes content, recommends layout×style combinations, and generates publication-ready infographics. Use when user asks to create "infographic", "信息图", "visual summary", or "可视化".
Install with Tessl CLI
npx tessl i github:jimliu/baoyu-skills --skill baoyu-infographicOverall
score
99%
Does it follow best practices?
Validation for skill structure
Two dimensions: layout (information structure) × style (visual aesthetics). Freely combine any layout with any style.
/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| 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 | 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/<layout>.md
| 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
| 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
infographic/{topic-slug}/
├── source-{slug}.{ext}
├── analysis.md
├── structured-content.md
├── prompts/infographic.md
└── infographic.pngSlug: 2-4 words kebab-case from topic. Conflict: append -YYYYMMDD-HHMMSS.
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
source.md)See references/analysis-framework.md for detailed format.
structured-content.mdTransform content into infographic structure:
Rules: Markdown only. No new information. All data verbatim.
See references/structured-content-template.md for detailed format.
Recommend 3-5 layout×style combinations based on:
Present all options in single confirmation:
prompts/infographic.mdCombine:
references/layouts/<layout>.mdreferences/styles/<style>.mdreferences/base-prompt.mdReport: topic, layout, style, aspect, language, output path, files created.
references/analysis-framework.md - Analysis methodologyreferences/structured-content-template.md - Content formatreferences/base-prompt.md - Prompt templatereferences/layouts/<layout>.md - 20 layout definitionsreferences/styles/<style>.md - 17 style definitionsCustom configurations via EXTEND.md. See Step 1.1 for paths and supported options.
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.