Files
baoyu-skills/skills/baoyu-cover-image/SKILL.md
T
Jim Liu 宝玉 61960961ba feat(baoyu-cover-image): add font dimension with 4 styles
Add 6th dimension for typography control:
- clean: modern geometric sans-serif
- handwritten: warm hand-lettered style
- serif: classic elegant typography
- display: bold decorative headlines

Includes auto-selection rules, compatibility matrix, and warm-flat preset.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-02-06 14:55:11 -06:00

511 lines
21 KiB
Markdown
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
---
name: baoyu-cover-image
description: Generates article cover images with 5 dimensions (type, palette, rendering, text, mood) combining 9 color palettes and 6 rendering styles. Supports cinematic (2.35:1), widescreen (16:9), and square (1:1) aspects. Use when user asks to "generate cover image", "create article cover", or "make cover".
---
# Cover Image Generator
Generate elegant cover images for articles with 5-dimensional customization.
## Usage
```bash
# Auto-select all dimensions based on content
/baoyu-cover-image path/to/article.md
# Quick mode: skip confirmation, use auto-selection
/baoyu-cover-image article.md --quick
# Specify dimensions (new 5D system)
/baoyu-cover-image article.md --type conceptual --palette warm --rendering flat-vector
/baoyu-cover-image article.md --text title-subtitle --mood bold
# Style presets (backward-compatible shorthand for palette + rendering)
/baoyu-cover-image article.md --style blueprint
/baoyu-cover-image article.md --style blueprint --rendering hand-drawn # override rendering
# Visual only (no title text)
/baoyu-cover-image article.md --no-title
# Direct content input
/baoyu-cover-image
[paste content]
# Direct input with options
/baoyu-cover-image --palette mono --rendering digital --aspect 1:1 --quick
[paste content]
# With reference images
/baoyu-cover-image article.md --ref style-ref.png
/baoyu-cover-image article.md --ref ref1.png ref2.png --quick
```
## Options
| Option | Description |
|--------|-------------|
| `--type <name>` | Cover type: hero, conceptual, typography, metaphor, scene, minimal |
| `--palette <name>` | Color palette: warm, elegant, cool, dark, earth, vivid, pastel, mono, retro |
| `--rendering <name>` | Rendering style: flat-vector, hand-drawn, painterly, digital, pixel, chalk |
| `--style <name>` | Preset shorthand (expands to palette + rendering, see [Style Presets](references/style-presets.md)) |
| `--text <level>` | Text density: none, title-only, title-subtitle, text-rich |
| `--mood <level>` | Emotional intensity: subtle, balanced, bold |
| `--font <name>` | Font style: clean, handwritten, serif, display |
| `--aspect <ratio>` | 16:9 (default), 2.35:1, 4:3, 3:2, 1:1, 3:4 |
| `--lang <code>` | Title language (en, zh, ja, etc.) |
| `--no-title` | Alias for `--text none` |
| `--quick` | Skip confirmation, use auto-selection for missing dimensions |
| `--ref <files...>` | Reference images for style/composition guidance |
## Five Dimensions
| Dimension | Controls | Values | Default |
|-----------|----------|--------|---------|
| **Type** | Visual composition, information structure | hero, conceptual, typography, metaphor, scene, minimal | auto |
| **Palette** | Colors, color scheme, decorative hints | warm, elegant, cool, dark, earth, vivid, pastel, mono, retro | auto |
| **Rendering** | Line quality, texture, depth, element style | flat-vector, hand-drawn, painterly, digital, pixel, chalk | auto |
| **Text** | Text density, information hierarchy | none, title-only, title-subtitle, text-rich | title-only |
| **Mood** | Emotional intensity, visual weight | subtle, balanced, bold | balanced |
| **Font** | Typography style, character feel | clean, handwritten, serif, display | clean |
Dimensions can be freely combined. Auto-selection rules: [references/auto-selection.md](references/auto-selection.md)
## Type Gallery
| Type | Description | Best For |
|------|-------------|----------|
| `hero` | Large visual impact, title overlay | Product launch, brand promotion, major announcements |
| `conceptual` | Concept visualization, abstract core ideas | Technical articles, methodology, architecture design |
| `typography` | Text-focused layout, prominent title | Opinion pieces, quotes, insights |
| `metaphor` | Visual metaphor, concrete expressing abstract | Philosophy, growth, personal development |
| `scene` | Atmospheric scene, narrative feel | Stories, travel, lifestyle |
| `minimal` | Minimalist composition, generous whitespace | Zen, focus, core concepts |
Type composition details: [references/types.md](references/types.md)
## Palette Gallery
| Palette | Vibe | Primary Colors |
|---------|------|----------------|
| `warm` | Friendly, approachable | Orange, golden yellow, terracotta |
| `elegant` | Sophisticated, refined | Soft coral, muted teal, dusty rose |
| `cool` | Technical, professional | Engineering blue, navy, cyan |
| `dark` | Cinematic, premium | Electric purple, cyan, magenta |
| `earth` | Natural, organic | Forest green, sage, earth brown |
| `vivid` | Energetic, bold | Bright red, neon green, electric blue |
| `pastel` | Gentle, whimsical | Soft pink, mint, lavender |
| `mono` | Clean, focused | Black, near-black, white |
| `retro` | Nostalgic, vintage | Muted orange, dusty pink, maroon |
Palette definitions: [references/palettes/](references/palettes/)
## Rendering Gallery
| Rendering | Description | Key Characteristics |
|-----------|-------------|---------------------|
| `flat-vector` | Clean modern vector | Uniform outlines, flat fills, geometric icons |
| `hand-drawn` | Sketchy organic illustration | Imperfect strokes, paper texture, doodles |
| `painterly` | Soft watercolor/paint | Brush strokes, color bleeds, soft edges |
| `digital` | Polished modern digital | Precise edges, subtle gradients, UI components |
| `pixel` | Retro 8-bit pixel art | Pixel grid, dithering, chunky shapes |
| `chalk` | Chalk on blackboard | Chalk strokes, dust effects, board texture |
Rendering definitions: [references/renderings/](references/renderings/)
## Text & Mood
| Text Level | Title | Subtitle | Tags | Use Case |
|------------|:-----:|:--------:|:----:|----------|
| `none` | - | - | - | Pure visual, no text |
| `title-only` | ✓ | - | - | Simple headline (default) |
| `title-subtitle` | ✓ | ✓ | - | Title + supporting context |
| `text-rich` | ✓ | ✓ | ✓ (2-4) | Information-dense |
| Mood | Contrast | Saturation | Weight | Use Case |
|------|:--------:|:----------:|:------:|----------|
| `subtle` | Low | Muted | Light | Corporate, thought leadership |
| `balanced` | Medium | Normal | Medium | General articles (default) |
| `bold` | High | Vivid | Heavy | Announcements, promotions |
Full guides: [references/dimensions/text.md](references/dimensions/text.md) | [references/dimensions/mood.md](references/dimensions/mood.md)
## Font Gallery
| Font | Description | Best For |
|------|-------------|----------|
| `clean` | Modern geometric sans-serif | Tech, professional, minimal |
| `handwritten` | Warm hand-lettered style | Personal, friendly, lifestyle |
| `serif` | Classic elegant typography | Editorial, academic, luxury |
| `display` | Bold decorative headlines | Announcements, entertainment |
Full guide: [references/dimensions/font.md](references/dimensions/font.md)
## Style Presets & Compatibility
- **Style Presets**: `--style X` expands to palette + rendering. See [references/style-presets.md](references/style-presets.md)
- **Compatibility Matrices**: Palette×Rendering, Type×Rendering, Type×Text, Type×Mood. See [references/compatibility.md](references/compatibility.md)
- ✓✓ = highly recommended | ✓ = compatible | ✗ = not recommended
## File Structure
Output directory depends on `default_output_dir` preference:
| Preference | Output Path |
|------------|-------------|
| `same-dir` | `{article-dir}/` |
| `imgs-subdir` | `{article-dir}/imgs/` |
| `independent` (default) | `cover-image/{topic-slug}/` |
| Pasted content | `cover-image/{topic-slug}/` (always) |
```
<output-dir>/
├── source-{slug}.{ext} # Source files (text, images, etc.)
├── refs/ # Reference images (if provided)
│ ├── ref-01-{slug}.{ext}
│ ├── ref-01-{slug}.md # Description file (optional)
│ ├── ref-02-{slug}.{ext}
│ ├── ref-02-{slug}.md # Description file (optional)
│ └── extracted-style.md # Verbally extracted style (if no file path)
├── prompts/cover.md # Generation prompt
└── cover.png # Output image
```
**Slug**: Extract main topic (2-4 words, kebab-case). Example: "The Future of AI" → `future-of-ai`
**Conflict**: If directory exists, append timestamp: `{topic-slug}-YYYYMMDD-HHMMSS`
**Source Files**: Copy all sources with naming `source-{slug}.{ext}` (multiple supported)
## Workflow
### Progress Checklist
```
Cover Image Progress:
- [ ] Step 0: Check preferences (EXTEND.md) ⛔ BLOCKING
- [ ] Found → load preferences → continue
- [ ] Not found → run first-time setup → MUST complete before Step 1
- [ ] Step 1: Analyze content + determine output directory
- [ ] 1.1 Reference images ⚠️ (if provided)
- [ ] File path given → saved to refs/ ✓
- [ ] No path → asked user OR extracted verbally
- [ ] 1.2 Output directory determined
- [ ] Step 2: Confirm options (6 dimensions) ⚠️ REQUIRED unless --quick or all specified
- [ ] Step 3: Create prompt
- [ ] References in prompt ONLY if files exist in refs/
- [ ] Extracted style/palette appended to prompt body (if no file)
- [ ] Step 4: Generate image
- [ ] 4.1 References verified before generation
- [ ] 4.2 Pass refs via --ref if skill supports AND files exist
- [ ] Step 5: Completion report
```
### Flow
```
Input → [Step 0: Preferences] ─┬─ Found → Continue
└─ Not found → First-Time Setup ⛔ BLOCKING
└─ Complete setup → Save EXTEND.md → Continue
┌───────────────────────────────────────────────────────────────────────────┘
Analyze + Save Refs → [Output Dir ⚠️] → [Confirm: 6 Dimensions] → Prompt → Generate → Complete
(skip if --quick or all specified)
```
### Step 0: Load Preferences (EXTEND.md) ⛔ BLOCKING
**Purpose**: Load user preferences or run first-time setup.
**CRITICAL**: If EXTEND.md not found, MUST complete first-time setup before ANY other questions or steps. Do NOT proceed to content analysis, do NOT ask about reference images, do NOT ask about dimensions — ONLY complete the preferences setup first.
Use Bash to check EXTEND.md existence (priority order):
```bash
# Check project-level first
test -f .baoyu-skills/baoyu-cover-image/EXTEND.md && echo "project"
# Then user-level (cross-platform: $HOME works on macOS/Linux/WSL)
test -f "$HOME/.baoyu-skills/baoyu-cover-image/EXTEND.md" && echo "user"
```
| Result | Action |
|--------|--------|
| Found | Read, parse, display preferences summary → Continue to Step 1 |
| Not found | ⛔ **BLOCKING**: Run first-time setup ONLY ([references/config/first-time-setup.md](references/config/first-time-setup.md)) → Complete and save EXTEND.md → Then continue to Step 1 |
**Preferences Summary** (when found):
```
Preferences loaded from [project/user]:
• Watermark: [enabled/disabled] [content if enabled]
• Type/Palette/Rendering: [value or "auto"]
• Text: [value or "title-only"] | Mood: [value or "balanced"]
• Aspect: [default_aspect] | Output: [dir or "not set — will ask in Step 1.5"]
• Quick mode: [enabled/disabled] | Language: [value or "auto"]
```
**EXTEND.md Supports**: Watermark | Preferred type | Preferred palette | Preferred rendering | Preferred text | Preferred mood | Preferred font | Default aspect ratio | Default output directory | Quick mode | Custom palette definitions | Language preference
Schema: [references/config/preferences-schema.md](references/config/preferences-schema.md)
### Step 1: Analyze Content
**1.0 Detect & Save Reference Images** ⚠️ REQUIRED if images provided
Check if user provided reference images. Handle based on input type:
| Input Type | Action |
|------------|--------|
| Image file path provided | Copy to `refs/` subdirectory → can use `--ref` |
| Image in conversation (no path) | **ASK user for file path** with AskUserQuestion |
| User can't provide path | Extract style/palette verbally → append to prompt (NO frontmatter references) |
**CRITICAL**: Only add `references` to prompt frontmatter if files are ACTUALLY SAVED to `refs/` directory.
**If user provides file path**:
1. Copy to `refs/ref-NN-{slug}.{ext}` (NN = 01, 02, ...)
2. Create description: `refs/ref-NN-{slug}.md`
3. Verify files exist before proceeding
**If user can't provide path** (extracted verbally):
1. Analyze image visually, extract: colors, style, composition
2. Create `refs/extracted-style.md` with extracted info
3. DO NOT add `references` to prompt frontmatter
4. Instead, append extracted style/colors directly to prompt text
**Description File Format** (only when file saved):
```yaml
---
ref_id: NN
filename: ref-NN-{slug}.{ext}
usage: direct | style | palette
---
[User's description or auto-generated description]
```
| Usage | When to Use |
|-------|-------------|
| `direct` | Reference matches desired output closely |
| `style` | Extract visual style characteristics only |
| `palette` | Extract color scheme only |
**Verification** (only for saved files):
```
Reference Images Saved:
- ref-01-{slug}.png ✓ (can use --ref)
- ref-02-{slug}.png ✓ (can use --ref)
```
**Or for extracted style**:
```
Reference Style Extracted (no file):
- Colors: #E8756D coral, #7ECFC0 mint...
- Style: minimal flat vector, clean lines...
→ Will append to prompt text (not --ref)
```
---
**1.1 Save Source Content**
- If pasted, save to `source.md` in target directory; if file path, use as-is
- **Backup rule**: If `source.md` exists, rename to `source-backup-YYYYMMDD-HHMMSS.md`
**1.2 Content Analysis**
- Extract topic, core message, tone, keywords
- Identify visual metaphors
- Detect content type
**1.3 Reference Image Analysis** (if provided in Step 1.0)
For each reference image:
| Analysis | Description |
|----------|-------------|
| Visual characteristics | Style, colors, composition |
| Content/subject | What the reference depicts |
| Style match | Which type/palette/rendering align |
| Usage recommendation | `direct` / `style` / `palette` |
**1.4 Language Detection**
- Detect source language
- Note user's input language
- Compare with EXTEND.md preference
**1.5 Determine Output Directory**
- Per File Structure rules
- If no `default_output_dir` preference + file path input, include in Step 2 Q4
### Step 2: Confirm Options ⚠️
Validate all 6 dimensions + aspect ratio. Full confirmation flow: [references/workflow/confirm-options.md](references/workflow/confirm-options.md)
**Skip Conditions**:
| Condition | Skipped | Still Asked |
|-----------|---------|-------------|
| `--quick` or `quick_mode: true` | 6 dimensions | Aspect ratio (unless `--aspect`) |
| All 6 + `--aspect` specified | All | None |
### Step 3: Create Prompt
**Backup rule**: If `prompts/cover.md` exists, rename to `prompts/cover-backup-YYYYMMDD-HHMMSS.md`
Save to `prompts/cover.md`. Full template: [references/workflow/prompt-template.md](references/workflow/prompt-template.md)
**CRITICAL - References in YAML Frontmatter**:
When reference files are saved to `refs/`, **MUST add `references` field in frontmatter**:
```yaml
---
type: cover
palette: warm
rendering: flat-vector
references:
- ref_id: 01
filename: refs/ref-01-podcast-thumbnail.jpg
usage: style
---
```
| Rule | Action |
|------|--------|
| Files saved to `refs/` | Add to frontmatter `references` list |
| Style extracted verbally (no file) | Omit `references` field, describe in body |
| Before writing | Verify: `test -f refs/ref-NN-{slug}.{ext}` |
**Reference Embedding**:
| Situation | Frontmatter | Body |
|-----------|-------------|------|
| Reference file saved to `refs/` | Add to `references` ✓ | Brief style note |
| Style extracted verbally (no file) | Omit `references` | Full style description |
| File in frontmatter but doesn't exist | ERROR - fix or remove | — |
### Step 4: Generate Image
**4.1 Backup existing** `cover.png``cover-backup-YYYYMMDD-HHMMSS.png` (if regenerating)
**4.2 Check available image generation skills**; if multiple, ask user preference
**4.3 Process References** ⚠️ REQUIRED if references in frontmatter
**Read `references` from prompt frontmatter** and process each entry:
1. **Parse frontmatter** to get references list:
```yaml
references:
- ref_id: 01
filename: refs/ref-01-podcast-thumbnail.jpg
usage: style
```
2. **VERIFY each file exists**:
```bash
test -f refs/ref-NN-{slug}.{ext} && echo "exists" || echo "MISSING"
```
- If file MISSING → ERROR, fix prompt or remove from references
- If file exists → proceed with processing
3. Process based on `usage` type:
| Usage | Action | Example |
|-------|--------|---------|
| `direct` | Add reference path to `--ref` parameter | `--ref refs/ref-01-brand.png` |
| `style` | Analyze reference, append style traits to prompt | "Style: clean lines, gradient backgrounds..." |
| `palette` | Extract colors from reference, append to prompt | "Colors: #E8756D coral, #7ECFC0 mint..." |
3. Check image generation skill capability:
| Skill Supports `--ref` | Action |
|------------------------|--------|
| Yes (e.g., baoyu-image-gen with Google) | Pass reference images via `--ref` |
| No | Convert to text description, append to prompt |
**Verification**: Before generating, confirm reference processing:
```
Reference Processing:
- ref-01-brand.png: using as direct reference ✓
- ref-02-style.png: extracted palette ✓
```
**4.4 Generate**
1. Call selected skill with prompt file path, output path (`cover.png`), aspect ratio
2. If references with `direct` usage AND skill supports `--ref`: include `--ref` parameter
3. On failure: auto-retry once before reporting error
### Step 5: Completion Report
```
Cover Generated!
Topic: [topic]
Type: [type] | Palette: [palette] | Rendering: [rendering]
Text: [text] | Mood: [mood] | Font: [font] | Aspect: [ratio]
Title: [title text or "visual only"]
Language: [lang] | Watermark: [enabled/disabled]
References: [N images (direct/style/palette) or "extracted style" or "none"]
Location: [directory path]
Files:
✓ source-{slug}.{ext}
[✓ refs/ref-01-{slug}.{ext} ... (if references saved)]
[✓ refs/ref-01-{slug}.md ... (description files)]
[✓ refs/extracted-style.md (if style extracted verbally)]
✓ prompts/cover.md
✓ cover.png
[✓ cover-backup-{timestamp}.png (if regenerated)]
```
## Image Modification
| Action | Steps |
|--------|-------|
| **Regenerate** | Backup existing → **Update prompt file FIRST** → Regenerate with same settings |
| **Change dimension** | Backup existing → Confirm new value → **Update prompt file FIRST** → Regenerate |
**IMPORTANT**: When regenerating, ALWAYS update the prompt file (`prompts/cover.md`) FIRST before regenerating. This ensures changes are documented and reproducible.
All modifications automatically backup existing `cover.png` before regenerating.
## Notes
- Cover must be readable at small preview sizes
- Visual metaphors > literal representations
- Title: readable, impactful
- Two confirmation points: Step 0 (first-time setup) + Step 2 (6 dimensions) - skip Step 2 with `--quick`
- Use confirmed language for title text
- Maintain watermark consistency if enabled
- Check compatibility matrices when selecting combinations
- `--no-title` is alias for `--text none`
- `--style` presets are backward-compatible; explicit `--palette`/`--rendering` override preset values
### Composition Principles
- **Generous whitespace**: 40-60% breathing room; avoid cluttered layouts
- **Visual anchor**: Main element centered or offset left (reserve right for title)
- **Character handling**: Simplified silhouettes or icon-style figures; NO realistic humans
- **Icon vocabulary**: Use simple, recognizable symbols (see [references/visual-elements.md](references/visual-elements.md))
### Title Handling
- **Source**: Use the exact title provided by user, or extract from source content
- **Do NOT invent titles**: Stay faithful to the original
- If no title in source and user doesn't provide one, ask user to specify
## References
**Dimensions**: [text.md](references/dimensions/text.md) | [mood.md](references/dimensions/mood.md) | [font.md](references/dimensions/font.md)
**Palettes**: [references/palettes/](references/palettes/)
**Renderings**: [references/renderings/](references/renderings/)
**Auto-Selection**: [references/auto-selection.md](references/auto-selection.md)
**Style Presets**: [references/style-presets.md](references/style-presets.md)
**Compatibility**: [references/compatibility.md](references/compatibility.md)
**Types**: [references/types.md](references/types.md)
**Visual Elements**: [references/visual-elements.md](references/visual-elements.md)
**Workflow**: [confirm-options.md](references/workflow/confirm-options.md) | [prompt-template.md](references/workflow/prompt-template.md)
**Config**: [preferences-schema.md](references/config/preferences-schema.md) | [first-time-setup.md](references/config/first-time-setup.md) | [watermark-guide.md](references/config/watermark-guide.md)