All skills
jimliu avatar

/baoyu-infographic

@b0ac523 official
by Jim Liu 宝玉jimliu/baoyu-skills26k stars
2,896

Generate professional infographics with 21 layout types and 22 visual styles. Analyzes content, recommends layout×style combinations, and generates publication-ready infographics. Use when user asks to create "infographic", "信息图", "visual summary", "可视化", or "高密度信息大图".

Use this Skill: https://skilld.dev/gh/jimliu/baoyu-skills/baoyu-infographic

This session only. Nothing lands on disk.

referencesanalysis-framework.md

≈1.9k tokens on demand. Your agent reads this file only when SKILL.md points to it.

Infographic Content Analysis Framework

Deep analysis framework applying instructional design principles to infographic creation.

Purpose

Before creating an infographic, thoroughly analyze the source material to:

  • Understand the content at a deep level
  • Identify clear learning objectives for the viewer
  • Structure information for maximum clarity and retention
  • Match content to optimal layout×style combinations
  • Preserve all source data verbatim

Instructional Design Mindset

Approach content analysis as a world-class instructional designer:

Principle Application
Deep Understanding Read the entire document before analyzing any part
Learner-Centered Focus on what the viewer needs to understand
Visual Storytelling Use visuals to communicate, not just decorate
Cognitive Load Simplify complex ideas without losing accuracy
Data Integrity Never alter, summarize, or paraphrase source facts

Analysis Dimensions

1. Content Type Classification

Type Characteristics Best Layout Best Style
Timeline/History Sequential events, dates, progression linear-progression craft-handmade, aged-academia
Process/Tutorial Step-by-step instructions, how-to linear-progression, winding-roadmap ikea-manual, technical-schematic
Comparison A vs B, pros/cons, before-after binary-comparison, comparison-matrix corporate-memphis, bold-graphic
Hierarchy Levels, priorities, pyramids hierarchical-layers, tree-branching craft-handmade, corporate-memphis
Relationships Connections, overlaps, influences venn-diagram, hub-spoke, jigsaw craft-handmade, subway-map
Data/Metrics Statistics, KPIs, measurements dashboard, periodic-table corporate-memphis, technical-schematic
Cycle/Loop Recurring processes, feedback loops circular-flow craft-handmade, technical-schematic
System/Structure Components, architecture, anatomy structural-breakdown, bento-grid technical-schematic, ikea-manual
Journey/Narrative Stories, user flows, milestones winding-roadmap, story-mountain storybook-watercolor, comic-strip
Overview/Summary Multiple topics, feature highlights bento-grid, periodic-table, dense-modules chalkboard, bold-graphic
Product/Buying Guide Multi-dimension comparisons, specs, pitfalls dense-modules morandi-journal, pop-laboratory, retro-pop-grid, retro-popup-pop

2. Learning Objective Identification

Every infographic should have 1-3 clear learning objectives.

Good Learning Objectives:

  • Specific and measurable
  • Focus on what the viewer will understand, not just see
  • Written from the viewer's perspective

Format: "After viewing this infographic, the viewer will understand..."

Content Aspect Objective Type
Core concept "...what [topic] is and why it matters"
Process "...how to [accomplish something]"
Comparison "...the key differences between [A] and [B]"
Relationships "...how [elements] connect to each other"
Data "...the significance of [key statistics]"

3. Audience Analysis

Factor Questions Impact
Knowledge Level What do they already know? Determines complexity depth
Context Why are they viewing this? Determines emphasis points
Expectations What do they hope to learn? Determines success criteria
Visual Preferences Professional, playful, technical? Influences style choice

4. Complexity Assessment

Level Indicators Layout Recommendation
Simple (3-5 points) Few main concepts, clear relationships sparse layouts, single focus
Moderate (6-8 points) Multiple concepts, some relationships balanced layouts, clear sections
Complex (9+ points) Many concepts, intricate relationships dense layouts, multiple sections

5. Visual Opportunity Mapping

Identify what can be shown rather than told:

Content Element Visual Treatment
Numbers/Statistics Large, highlighted numerals
Comparisons Side-by-side, split screen
Processes Arrows, numbered steps, flow
Hierarchies Pyramids, layers, size differences
Relationships Lines, connections, overlapping shapes
Categories Color coding, grouping, sections
Timelines Horizontal/vertical progression
Quotes Callout boxes, quotation marks

6. Data Verbatim Extraction

Critical: All factual information must be preserved exactly as written in the source.

Data Type Handling Rule
Statistics Copy exactly: "73%" not "about 70%"
Quotes Copy word-for-word with attribution
Names Preserve exact spelling
Dates Keep original format
Technical Terms Do not simplify or substitute
Lists Preserve order and wording

Never:

  • Round numbers
  • Paraphrase quotes
  • Substitute simpler words
  • Add implied information
  • Remove context that affects meaning

Output Format

Save analysis results to analysis.md:

---
title: "[Main topic title]"
topic: "[educational/technical/business/creative/etc.]"
data_type: "[timeline/hierarchy/comparison/process/etc.]"
complexity: "[simple/moderate/complex]"
point_count: [number of main points]
source_language: "[detected language]"
user_language: "[user's language]"
---

## Main Topic
[1-2 sentence summary of what this content is about]

## Learning Objectives
After viewing this infographic, the viewer should understand:
1. [Primary objective]
2. [Secondary objective]
3. [Tertiary objective if applicable]

## Target Audience
- **Knowledge Level**: [Beginner/Intermediate/Expert]
- **Context**: [Why they're viewing this]
- **Expectations**: [What they hope to learn]

## Content Type Analysis
- **Data Structure**: [How information relates to itself]
- **Key Relationships**: [What connects to what]
- **Visual Opportunities**: [What can be shown rather than told]

## Key Data Points (Verbatim)
[All statistics, quotes, and critical facts exactly as they appear in source]
- "[Exact data point 1]"
- "[Exact data point 2]"
- "[Exact quote with attribution]"

## Layout × Style Signals
- Content type: [type] → suggests [layout]
- Tone: [tone] → suggests [style]
- Audience: [audience] → suggests [style]
- Complexity: [level] → suggests [layout density]

## Design Instructions (from user input)
[Any style, color, layout, or visual preferences extracted from user's steering prompt]

## Recommended Combinations
1. **[Layout] + [Style]** (Recommended): [Brief rationale]
2. **[Layout] + [Style]**: [Brief rationale]
3. **[Layout] + [Style]**: [Brief rationale]

Analysis Checklist

Before proceeding to structured content generation:

  • Have I read the entire source document?
  • Can I summarize the main topic in 1-2 sentences?
  • Have I identified 1-3 clear learning objectives?
  • Do I understand the target audience?
  • Have I classified the content type correctly?
  • Have I extracted all data points verbatim?
  • Have I identified visual opportunities?
  • Have I extracted design instructions from user input?
  • Have I recommended 3 layout×style combinations?

Source: SKILL.md on GitHub

1 warning16d5 checks · Risk MEDIUM
  • Gen Agent Trust Hub16d

    The skill dynamically discovers and executes scripts to handle image generation and processes untrusted user content for prompt generation. It uses the bun runtime and well-known command-line tools to interact with image generation backends.

  • Socket16d

    No alerts

  • Snyk16d

    Risk: LOW · No issues

  • Runlayer6mo

    1/45 files flagged

  • ZeroLeaks5mo

    Score: 93/100 · 2 sections analyzed

Signed by skilld at b0ac523. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub 2 days ago.

Activeupdated 4 months ago
version
1.117.4
Other metadata
metadata
{
  "openclaw": {
    "homepage": "https://github.com/JimLiu/baoyu-skills#baoyu-infographic"
  }
}
  • infographic
  • image-generation
  • layout
  • visual-design
  • data-visualization
  • content-analysis
  • style-guide
  • prompt-engineering

README badge

README badge for jimliu/baoyu-skills/baoyu-infographic

Generates publication-ready infographics by combining one of 21 layout types with one of 22 visual styles, analyzing content to recommend optimal pairings. Targets use cases like timelines, comparisons, hierarchies, and data-rich guides across multiple languages and aspect ratios.

Generated from the current SKILL.md.

How many layout and style combinations are available?
21 layout types and 22 visual styles that can be freely combined. Common pairings are pre-recommended (e.g., linear-progression + craft-handmade for timelines), but any layout works with any style.
Does this skill generate raster images or code?
Raster images only. The skill resolves to an available image backend (Codex imagegen, Cursor GenerateImage, or baoyu-image-gen) and never substitutes SVG, HTML, or canvas rendering.
Can I provide reference images to guide the style?
Yes. You can pass reference images via --ref and specify usage mode (direct, style, or palette) to guide visual aesthetics, color, or composition.
What happens if I don't confirm the layout and style choices?
By default the skill requires confirmation before generation. Only --no-confirm or explicit skip-confirmation wording (like '直接生成') bypasses this step.
What languages does this skill support?
Multiple languages via the --lang option (en, zh, ja, etc.), with zh and en as primary targets based on the keyword detection and recommended combinations listed in the skill.

Generated from the current SKILL.md. These answers refresh after source changes.