baoyu-infographic

Files (50)

• SKILL.md
• analysis-framework.md · references/
• base-prompt.md · references/
• codex-imagegen.md · references/
• first-time-setup.md · references/config/
• preferences-schema.md · references/config/
• bento-grid.md · references/layouts/
• binary-comparison.md · references/layouts/
• bridge.md · references/layouts/
• circular-flow.md · references/layouts/
• comic-strip.md · references/layouts/
• comparison-matrix.md · references/layouts/
• dashboard.md · references/layouts/
• dense-modules.md · references/layouts/
• funnel.md · references/layouts/
• hierarchical-layers.md · references/layouts/
• hub-spoke.md · references/layouts/
• iceberg.md · references/layouts/
• isometric-map.md · references/layouts/
• jigsaw.md · references/layouts/
• linear-progression.md · references/layouts/
• periodic-table.md · references/layouts/
• story-mountain.md · references/layouts/
• structural-breakdown.md · references/layouts/
• tree-branching.md · references/layouts/
• venn-diagram.md · references/layouts/
• winding-roadmap.md · references/layouts/
• structured-content-template.md · references/
• aged-academia.md · references/styles/
• bold-graphic.md · references/styles/
• chalkboard.md · references/styles/
• claymation.md · references/styles/
• corporate-memphis.md · references/styles/
• craft-handmade.md · references/styles/
• cyberpunk-neon.md · references/styles/
• hand-drawn-edu.md · references/styles/
• ikea-manual.md · references/styles/
• kawaii.md · references/styles/
• knolling.md · references/styles/
• lego-brick.md · references/styles/
• morandi-journal.md · references/styles/
• origami.md · references/styles/
• pixel-art.md · references/styles/
• pop-laboratory.md · references/styles/
• retro-pop-grid.md · references/styles/
• retro-popup-pop.md · references/styles/
• storybook-watercolor.md · references/styles/
• subway-map.md · references/styles/
• technical-schematic.md · references/styles/
• ui-wireframe.md · references/styles/

SKILL.md (first lines)

# Infographic Generator

Two dimensions: **layout** (information structure) × **style** (visual aesthetics); any layout combines with any style.

## User Input Tools

When this skill prompts the user, follow this tool-selection rule (priority order):

1. **Prefer built-in user-input tools** exposed by the current agent runtime — e.g., `AskUserQuestion`, `request_user_input`, `clarify`, `ask_user`, or any equivalent.
2. **Fallback**: if no such tool exists, emit a numbered plain-text message and ask the user to reply with the chosen number/answer for each question.
3. **Batching**: if the tool supports multiple questions per call, combine all applicable questions into a single call; if only single-question, ask them one at a time in priority order.

Concrete `AskUserQuestion` references below are examples — substitute the local equivalent in other runtimes.

## Image Generation Tools

Resolve the image backend in this order:

1. **User names a backend** in the current message → use it.
2. **`preferred_image_backend`** in `EXTEND.md` names a backend available now → use it. `ask` means ask every run.
3. **Auto-select** (preference `auto`, unset, or the pinned backend is unavailable), first match wins:
   - **Codex `imagegen`** skill is in your available skills → you are in Codex and MUST use it: `Skill` with `skill: "imagegen"`, passing the prompt file's content plus output path and aspect ratio. It outranks non-native skills such as `baoyu-image-gen`.
   - **Codex via `codex exec` (`codex-imagegen`)**: no native `imagegen`, but the `codex` CLI is on `PATH` with an active `codex login` → `baoyu-image-gen --provider codex-cli` (preferred), or the bundled wrapper if baoyu-image-gen is unavailable. Load [references/codex-imagegen.md](references/codex-imagegen.md) only for this branch.
   - **Cursor `GenerateImage`** → use it (outranks non-native skills). It has no aspect-ratio parameter, so state the aspect ratio / dimensions in the `description` prompt; it saves to a tool-managed location, so copy the file to the expected output path (e.g., `outputs/.../NN-xxx.png`). Reference images go in `reference_image_paths`.
   - **Other runtime-native image tool** (e.g., Hermes `image_generate`) → use it the same way.
   - Exactly one non-native backend installed (e.g., `baoyu-image-gen`) → use it.
   - Several non-native backends → ask the user once, batched with other initial questions.
4. **None available** → tell the user and ask how to proceed.

**⛔ Raster only**: never substitute SVG, HTML/CSS, canvas, or other code-based rendering for a raster image, even for diagram-like content. If no raster backend resolves, go to step 4.

**⛔ No bitmap text patching**: never use ImageMagick, Pillow, Canvas, SVG, HTML/CSS, OCR scripts, or any other overlay to cover, rewrite, erase, stroke, or replace labels, headings, callouts, data values, or any other text inside an already generated infographic. Regenerate from a corrected prompt, switch to a layout with less on-image text, or ask the user which imperfect candidate to keep.

**Prompt file (hard)**: before invoking any backend, write each image's full, final prompt to its own file under `prompts/` (`NN-{type}-[slug].md`) and pass that file (or its content) to the backend. It is the reproducibility record and lets you switch backends without rewriting prompts.

Change the pinned backend via `## Changing Preferences` below. Tool names above are examples; use the local equivalent in other runtimes.

## Reference Images

Accept via `--ref <files...>`, file paths, or pasted images (guide style, palette, composition, or subject):
- File path(s) → copy to `refs/NN-ref-{slug}.{ext}` alongside the output
- Pasted image with no path → ask for the path (per User Input Tools), or extract style traits verbally as a text fallback

| Usage | Effect |
|-------|--------|
| `direct` | Pass the file to the backend as a reference image |
| `style` | Extract style traits (line treatment, texture, mood) and append to the prompt body |
| `palette` | Extract hex colors from the image and append to the prompt body |

Record refs in `prompts/infographic.md` frontmatter:

```yaml
references:
  - ref_id: 01
    filename: 01-ref-brand.png
    usage: direct
```

At generation: verify each referenced file exists; if `usage: direct` AND the backend accepts reference images (e.g., `baoyu-image-gen` via `--ref`), pass it via the backend's ref parameter; otherwise embed extracted `style`/`palette` traits in the prompt text.

## Confirmation Policy

Default: **confirm before generation**.

- Explicit skill invocation, a file path, a matched keyword shortcut, `EXTEND.md` defaults, and the documented default combination are recommendation inputs only — none authorizes skipping confirmation.
- Do not start Step 5 or Step 6 until the user confirms the combination/aspect/language/backend choices.
- Skip confirmation only when the current request explicitly says so: `--no-confirm`, "直接生成", "不用确认", "跳过确认", "按默认出图", or equivalent. Then state the assumed combination/aspect/language/backend in the next user-facing update before generating.

## Options

| Option | Values |
|--------|--------|
| `--layout` | 21 options (see Layout Gallery), default: bento-grid |
| `--style` | 22 options (see Style Gallery), default: craft-handmade |
| `--aspect` | Named: landscape (16:9), portrait (9:16), square (1:1). Custom: any W:H ratio (e.g., 3:4, 4:3, 2.35:1) |
| `--lang` | en, zh, ja, etc. |
| `--no-confirm` | Skip Step 4 only when the user explicitly requests direct generation without confirmation |
| `--ref <files...>` | Reference images (file paths) for style / palette / composition / subject guidance |

## Layout Gallery (21)

Definitions: `references/layouts/<layout>.md`.

| 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 |
| `dense-modules` | High-density modules, data-rich guides |

## Style Gallery (22)

Definitions: `references/styles/<style>.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 |

From guanyang/open-agent-hub, MIT.

More from guanyang/open-agent-hub