chore: release v1.17.1

.claude-plugin/marketplace.json

@@ -6,7 +6,7 @@
   },
   "metadata": {
     "description": "Skills shared by Baoyu for improving daily work efficiency",
-    "version": "1.16.0"
+    "version": "1.17.1"
   },
   "plugins": [
     {

CHANGELOG.md

@@ -2,6 +2,27 @@
 
 English | [中文](./CHANGELOG.zh.md)
 
+## 1.17.1 - 2026-01-23
+
+### Refactor
+- `baoyu-infographic`: simplifies SKILL.md documentation—removes redundant content, streamlines workflow description, and improves readability.
+- `baoyu-xhs-images`: improves Step 0 (Load Preferences) documentation—adds clearer first-time setup flow with visual tables and explicit path checking instructions.
+
+### Improvements
+- `baoyu-infographic`: enhances `craft-handmade` style with strict hand-drawn enforcement—requires all imagery to maintain cartoon/illustrated aesthetic, no realistic or photographic elements.
+
+## 1.17.0 - 2026-01-23
+
+### Features
+- `baoyu-cover-image`: adds user preferences support via EXTEND.md—configure watermark (content, position, opacity), preferred type/style, default aspect ratio, and custom styles. New Step 0 checks for preferences at project (`.baoyu-skills/`) or user (`~/.baoyu-skills/`) level with first-time setup flow.
+
+### Refactor
+- `baoyu-cover-image`: restructures to Type × Style two-dimension system—adds 6 types (`hero`, `conceptual`, `typography`, `metaphor`, `scene`, `minimal`) that control visual composition, while 20 styles control aesthetics. New `--type` and `--aspect` options, Type × Style compatibility matrix, and structured workflow with progress checklist.
+
+### Documentation
+- `baoyu-cover-image`: adds three reference documents—`references/config/preferences-schema.md` (EXTEND.md YAML schema), `references/config/first-time-setup.md` (setup flow), `references/config/watermark-guide.md` (watermark configuration).
+- `README.md`, `README.zh.md`: updates baoyu-cover-image documentation to reflect new Type × Style system with `--type` and `--aspect` options.
+
 ## 1.16.0 - 2026-01-23
 
 ### Features

CHANGELOG.zh.md

@@ -2,6 +2,27 @@
 
 [English](./CHANGELOG.md) | 中文
 
+## 1.17.1 - 2026-01-23
+
+### 重构
+- `baoyu-infographic`：精简 SKILL.md 文档——移除冗余内容，优化工作流描述，提升可读性。
+- `baoyu-xhs-images`：优化 Step 0（加载偏好设置）文档——新增更清晰的首次设置流程，使用可视化表格和明确的路径检查指令。
+
+### 改进
+- `baoyu-infographic`：增强 `craft-handmade` 风格的手绘规则——要求所有图像必须保持卡通/插画风格，禁止写实或照片元素。
+
+## 1.17.0 - 2026-01-23
+
+### 新功能
+- `baoyu-cover-image`：新增用户偏好设置支持（通过 EXTEND.md 配置）——可设置水印（内容、位置、透明度）、首选类型/风格、默认宽高比和自定义风格。新增 Step 0 检查项目级（`.baoyu-skills/`）或用户级（`~/.baoyu-skills/`）偏好设置，首次使用时引导设置。
+
+### 重构
+- `baoyu-cover-image`：重构为类型 × 风格二维系统——新增 6 种类型（`hero` 主视觉、`conceptual` 概念、`typography` 文字、`metaphor` 隐喻、`scene` 场景、`minimal` 极简）控制视觉构图，20 种风格控制美学表现。新增 `--type` 和 `--aspect` 选项、类型 × 风格兼容性矩阵，以及带进度清单的结构化工作流。
+
+### 文档
+- `baoyu-cover-image`：新增三个参考文档——`references/config/preferences-schema.md`（EXTEND.md YAML 配置模式）、`references/config/first-time-setup.md`（首次设置流程）、`references/config/watermark-guide.md`（水印配置指南）。
+- `README.md`、`README.zh.md`：更新 baoyu-cover-image 文档，反映新的类型 × 风格系统及 `--type` 和 `--aspect` 选项。
+
 ## 1.16.0 - 2026-01-23
 
 ### 新功能

README.md

@@ -245,20 +245,25 @@ Generate professional infographics with 20 layout types and 17 visual styles. An
 
 #### baoyu-cover-image
 
-Generate hand-drawn style cover images for articles with multiple style options.
+Generate cover images for articles with Type × Style two-dimension system.
 
 ```bash
-# From markdown file (auto-select style)
+# Auto-select type and style based on content
 /baoyu-cover-image path/to/article.md
 
-# Specify a style
+# Specify type and/or style
-/baoyu-cover-image path/to/article.md --style tech
+/baoyu-cover-image path/to/article.md --type conceptual --style blueprint
 /baoyu-cover-image path/to/article.md --style warm
 
+# Specify aspect ratio (default: 2.35:1)
+/baoyu-cover-image path/to/article.md --aspect 16:9
+
 # Without title text
 /baoyu-cover-image path/to/article.md --no-title
 ```
 
+Available types: `hero`, `conceptual`, `typography`, `metaphor`, `scene`, `minimal`
+
 Available styles: `elegant` (default), `blueprint`, `bold-editorial`, `chalkboard`, `dark-atmospheric`, `editorial-infographic`, `fantasy-animation`, `flat-doodle`, `intuition-machine`, `minimal`, `nature`, `notion`, `pixel-art`, `playful`, `retro`, `sketch-notes`, `vector-illustration`, `vintage`, `warm`, `watercolor`
 
 **Style Previews**:

README.zh.md

@@ -245,20 +245,25 @@ npx skills add jimliu/baoyu-skills
 
 #### baoyu-cover-image
 
-为文章生成手绘风格封面图，支持多种风格选项。
+为文章生成封面图，支持类型 × 风格二维系统。
 
 ```bash
-# 从 markdown 文件生成（自动选择风格）
+# 根据内容自动选择类型和风格
 /baoyu-cover-image path/to/article.md
 
-# 指定风格
+# 指定类型和/或风格
-/baoyu-cover-image path/to/article.md --style tech
+/baoyu-cover-image path/to/article.md --type conceptual --style blueprint
 /baoyu-cover-image path/to/article.md --style warm
 
+# 指定宽高比（默认：2.35:1）
+/baoyu-cover-image path/to/article.md --aspect 16:9
+
 # 不包含标题文字
 /baoyu-cover-image path/to/article.md --no-title
 ```
 
+可用类型：`hero`、`conceptual`、`typography`、`metaphor`、`scene`、`minimal`
+
 可用风格：`elegant`（默认）、`blueprint`、`bold-editorial`、`chalkboard`、`dark-atmospheric`、`editorial-infographic`、`fantasy-animation`、`flat-doodle`、`intuition-machine`、`minimal`、`nature`、`notion`、`pixel-art`、`playful`、`retro`、`sketch-notes`、`vector-illustration`、`vintage`、`warm`、`watercolor`
 
 **风格预览**：

skills/baoyu-cover-image/SKILL.md

@@ -1,35 +1,33 @@
 ---
 name: baoyu-cover-image
-description: Generate elegant cover images for articles. Analyzes content and creates eye-catching hand-drawn style cover images with multiple style options. Use when user asks to "generate cover image", "create article cover", or "make a cover for article".
+description: Generates article cover images with 20 hand-drawn styles and auto-style selection. Supports cinematic (2.35:1), widescreen (16:9), and square (1:1) aspects. Use when user asks to "generate cover image", "create article cover", "make cover", or mentions "封面图".
 ---
 
 # Cover Image Generator
 
-Generate hand-drawn style cover images for articles with multiple style options.
+Generate elegant cover images for articles with multiple style options.
 
 ## Usage
 
 ```bash
-# From markdown file (auto-select style based on content)
+# Auto-select style and aspect based on content
 /baoyu-cover-image path/to/article.md
 
-# Specify a style
+# Specify style
-/baoyu-cover-image path/to/article.md --style blueprint
+/baoyu-cover-image article.md --style blueprint
-/baoyu-cover-image path/to/article.md --style warm
-/baoyu-cover-image path/to/article.md --style dark-atmospheric
 
-# Without title text
+# Specify aspect ratio
-/baoyu-cover-image path/to/article.md --no-title
+/baoyu-cover-image article.md --aspect 16:9
 
-# Combine options
+# Visual only (no title text)
-/baoyu-cover-image path/to/article.md --style minimal --no-title
+/baoyu-cover-image article.md --no-title
 
-# From direct text input
+# Direct content input
 /baoyu-cover-image
-[paste content or describe the topic]
+[paste content]
 
-# Direct input with style
+# Direct input with options
-/baoyu-cover-image --style playful
+/baoyu-cover-image --style notion --aspect 1:1
 [paste content]
 ```
 
@@ -37,249 +35,464 @@ Generate hand-drawn style cover images for articles with multiple style options.
 
 | Option | Description |
 |--------|-------------|
-| `--style <name>` | Specify cover style (see Style Gallery below) |
+| `--type <name>` | Cover type (see Type Gallery) |
-| `--aspect <ratio>` | Aspect ratio: 2.35:1 (cinematic, default), 16:9 (widescreen), 1:1 (social) |
+| `--style <name>` | Cover style (see Style Gallery) |
-| `--lang <code>` | Output language for title text (en, zh, ja, etc.) |
+| `--aspect <ratio>` | 2.35:1 (default), 16:9, 1:1 |
-| `--no-title` | Generate cover without title text (visual only) |
+| `--lang <code>` | Title language (en, zh, ja, etc.) |
+| `--no-title` | Visual only, no title text |
+
+## Two Dimensions
+
+| Dimension | Controls | Examples |
+|-----------|----------|----------|
+| **Type** | Visual composition, information structure | hero, conceptual, typography, metaphor, scene, minimal |
+| **Style** | Visual aesthetics, colors, mood | elegant, blueprint, notion, warm, minimal, watercolor |
+
+Type × Style can be freely combined. Example: `--type conceptual --style blueprint` creates technical concept visualization with schematic aesthetics.
+
+## 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 |
+
+## Auto Type Selection
+
+When `--type` is omitted, select based on content signals:
+
+| Signals | Type |
+|---------|------|
+| Product, launch, announcement, release, reveal | `hero` |
+| Architecture, framework, system, API, technical, model | `conceptual` |
+| Quote, opinion, insight, thought, headline, statement | `typography` |
+| Philosophy, growth, abstract, meaning, reflection | `metaphor` |
+| Story, journey, travel, lifestyle, experience, narrative | `scene` |
+| Zen, focus, essential, core, simple, pure | `minimal` |
 
 ## Style Gallery
 
 | Style | Description |
 |-------|-------------|
-| `elegant` (Default) | Refined, sophisticated, understated |
+| `elegant` (default) | Refined, sophisticated |
-| `flat-doodle` | Bold outlines, pastel colors, cute rounded shapes |
+| `blueprint` | Technical schematics |
-| `blueprint` | Technical schematics, engineering precision |
+| `bold-editorial` | Magazine impact |
-| `bold-editorial` | Magazine cover impact, dramatic typography |
+| `chalkboard` | Chalk on blackboard |
-| `chalkboard` | Black chalkboard, colorful chalk drawings |
+| `dark-atmospheric` | Cinematic dark mode |
-| `dark-atmospheric` | Cinematic dark mode, glowing accents |
+| `editorial-infographic` | Visual storytelling |
-| `editorial-infographic` | Magazine explainer, visual storytelling |
+| `fantasy-animation` | Ghibli/Disney inspired |
-| `fantasy-animation` | Ghibli/Disney inspired, whimsical charm |
+| `flat-doodle` | Pastel, cute shapes |
-| `intuition-machine` | Technical briefing, bilingual labels |
+| `intuition-machine` | Technical, bilingual |
-| `minimal` | Ultra-clean, zen-like, focused |
+| `minimal` | Ultra-clean, zen |
-| `nature` | Organic, calm, earthy |
+| `nature` | Organic, earthy |
-| `notion` | Clean SaaS dashboard, productivity styling |
+| `notion` | SaaS dashboard |
-| `pixel-art` | Retro 8-bit, nostalgic gaming aesthetic |
+| `pixel-art` | Retro 8-bit |
-| `playful` | Fun, creative, whimsical |
+| `playful` | Fun, whimsical |
-| `retro` | Halftone dots, vintage badges, classic |
+| `retro` | Halftone, vintage |
-| `sketch-notes` | Hand-drawn, educational, warm |
+| `sketch-notes` | Hand-drawn, warm |
-| `vector-illustration` | Flat vector, black outlines, retro colors |
+| `vector-illustration` | Flat vector |
-| `vintage` | Aged paper, historical, expedition style |
+| `vintage` | Aged, expedition |
-| `warm` | Friendly, approachable, human-centered |
+| `warm` | Friendly, human |
-| `watercolor` | Soft hand-painted, natural warmth |
+| `watercolor` | Soft hand-painted |
 
-Detailed style definitions: `references/styles/<style>.md`
+Style definitions: [references/styles/](references/styles/)
+
+## Type × Style Compatibility
+
+| | elegant | blueprint | notion | warm | minimal | watercolor | bold-editorial | dark-atmospheric |
+|---|:---:|:---:|:---:|:---:|:---:|:---:|:---:|:---:|
+| hero | ✓✓ | ✓ | ✓ | ✓✓ | ✓ | ✓✓ | ✓✓ | ✓✓ |
+| conceptual | ✓✓ | ✓✓ | ✓✓ | ✓ | ✓✓ | ✗ | ✓ | ✓ |
+| typography | ✓✓ | ✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✓✓ | ✓✓ |
+| metaphor | ✓✓ | ✗ | ✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✓ |
+| scene | ✓ | ✗ | ✗ | ✓✓ | ✓ | ✓✓ | ✓ | ✓✓ |
+| minimal | ✓✓ | ✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✗ | ✓ |
+
+✓✓ = highly recommended | ✓ = compatible | ✗ = not recommended
 
 ## Auto Style Selection
 
-When no `--style` is specified, the system analyzes content to select the best style:
+When `--style` is omitted, select based on content signals:
 
-| Content Signals | Selected Style |
+| Signals | Style |
-|----------------|----------------|
+|---------|-------|
-| Architecture, system design, engineering | `blueprint` |
+| Architecture, system design | `blueprint` |
-| Product launch, keynote, marketing, brand | `bold-editorial` |
+| Product launch, marketing | `bold-editorial` |
-| Education, classroom, tutorial, teaching | `chalkboard` |
+| Education, tutorial | `chalkboard` |
-| Entertainment, creative, premium, cinematic | `dark-atmospheric` |
+| Entertainment, premium | `dark-atmospheric` |
-| Technology explainer, science, research | `editorial-infographic` |
+| Tech explainer, research | `editorial-infographic` |
-| Storytelling, children, fantasy, magical | `fantasy-animation` |
+| Fantasy, children | `fantasy-animation` |
-| Technical docs, academic, bilingual | `intuition-machine` |
+| Technical docs, bilingual | `intuition-machine` |
-| Personal story, emotion, growth, life | `warm` |
+| Personal story, emotion | `warm` |
-| Simple, zen, focus, essential | `minimal` |
+| Zen, focus, essential | `minimal` |
-| Fun, easy, beginner, casual | `playful` |
+| Fun, beginner, casual | `playful` |
-| Nature, eco, wellness, health, organic | `nature` |
+| Nature, wellness, eco | `nature` |
-| Pop culture, 80s/90s nostalgia, badges | `retro` |
+| SaaS, dashboard | `notion` |
-| Product, SaaS, dashboard, productivity | `notion` |
+| Workflow, productivity | `flat-doodle` |
-| Productivity, workflow, app, tools, cute | `flat-doodle` |
+| Gaming, retro tech | `pixel-art` |
-| Gaming, retro tech, developer, 8-bit | `pixel-art` |
+| Knowledge sharing | `sketch-notes` |
-| Educational, tutorial, knowledge sharing | `sketch-notes` |
+| Creative proposals | `vector-illustration` |
-| Creative proposals, brand, toy-like | `vector-illustration` |
+| History, exploration | `vintage` |
-| History, exploration, heritage, biography | `vintage` |
+| Lifestyle, travel | `watercolor` |
-| Lifestyle, travel, food, personal | `watercolor` |
+| Business, professional | `elegant` |
-| Business, professional, strategy, analysis | `elegant` |
 
-## File Management
+## File Structure
-
-### Output Directory
 
 Each session creates an independent directory named by content slug:
 
 ```
 cover-image/{topic-slug}/
 ├── source-{slug}.{ext}    # Source files (text, images, etc.)
-├── prompts/
+├── prompts/cover.md       # Generation prompt
-│   └── cover.md
+└── cover.png              # Output image
-└── cover.png
 ```
 
 **Slug Generation**:
 1. Extract main topic from content (2-4 words, kebab-case)
 2. Example: "The Future of AI" → `future-of-ai`
 
-### Conflict Resolution
+**Conflict Resolution**:
-
 If `cover-image/{topic-slug}/` already exists:
 - Append timestamp: `{topic-slug}-YYYYMMDD-HHMMSS`
 - Example: `ai-future` exists → `ai-future-20260118-143052`
 
-### Source Files
+**Source Files**:
-
 Copy all sources with naming `source-{slug}.{ext}`:
-- `source-article.md` (main text content)
+- `source-article.md`, `source-reference.png`, etc.
-- `source-logo.png` (image from conversation)
+- Multiple sources supported: text, images, files from conversation
-
-Multiple sources supported: text, images, files from conversation.
 
 ## Workflow
 
+### Progress Checklist
+
+Copy and track progress:
+
+```
+Cover Image Progress:
+- [ ] Step 0: Check preferences (EXTEND.md) ⚠️ REQUIRED if not found
+- [ ] Step 1: Analyze content
+- [ ] Step 2: Confirm options (type + style + aspect) ⚠️ REQUIRED
+- [ ] Step 3: Create prompt
+- [ ] Step 4: Generate image
+- [ ] Step 5: Completion report
+```
+
+### Flow
+
+```
+Input → [Step 0: Preferences/Setup] → Analyze → [Confirm: Type + Style + Aspect] → Prompt → Generate → Complete
+```
+
+### Step 0: Load Preferences (EXTEND.md) ⚠️
+
+**Purpose**: Load user preferences or run first-time setup. **Do NOT skip setup if EXTEND.md not found.**
+
+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"
+```
+
+┌──────────────────────────────────────────────────┬───────────────────┐
+│                       Path                       │     Location      │
+├──────────────────────────────────────────────────┼───────────────────┤
+│ .baoyu-skills/baoyu-cover-image/EXTEND.md        │ Project directory │
+├──────────────────────────────────────────────────┼───────────────────┤
+│ $HOME/.baoyu-skills/baoyu-cover-image/EXTEND.md  │ User home         │
+└──────────────────────────────────────────────────┴───────────────────┘
+
+┌───────────┬───────────────────────────────────────────────────────────────────────────┐
+│  Result   │                                  Action                                   │
+├───────────┼───────────────────────────────────────────────────────────────────────────┤
+│ Found     │ Read, parse, display preferences summary (see below) → Continue to Step 1 │
+├───────────┼───────────────────────────────────────────────────────────────────────────┤
+│ Not found │ ⚠️ MUST run first-time setup (see below) → Then continue to Step 1        │
+└───────────┴───────────────────────────────────────────────────────────────────────────┘
+
+**Preferences Summary** (when EXTEND.md found):
+
+Display loaded preferences:
+
+```
+Preferences loaded from [project/user]:
+• Watermark: [enabled/disabled] [content if enabled]
+• Type: [preferred_type or "auto"]
+• Style: [preferred_style or "auto"]
+• Aspect: [default_aspect]
+• Language: [language or "auto"]
+```
+
+**First-Time Setup** (when EXTEND.md not found):
+
+**Language**: Use user's input language or saved language preference.
+
+Use AskUserQuestion with ALL questions in ONE call:
+
+**Q1: Watermark**
+```yaml
+header: "Watermark"
+question: "Watermark text for generated cover images?"
+options:
+  - label: "No watermark (Recommended)"
+    description: "Clean covers, can enable later in EXTEND.md"
+```
+
+**Q2: Preferred Type**
+```yaml
+header: "Type"
+question: "Default cover type preference?"
+options:
+  - label: "Auto-select (Recommended)"
+    description: "Choose based on content analysis each time"
+  - label: "hero"
+    description: "Large visual impact - product launch, announcements"
+  - label: "conceptual"
+    description: "Concept visualization - technical, architecture"
+```
+
+**Q3: Preferred Style**
+```yaml
+header: "Style"
+question: "Default cover style preference?"
+options:
+  - label: "Auto-select (Recommended)"
+    description: "Choose based on content analysis each time"
+  - label: "elegant"
+    description: "Refined, sophisticated - professional business"
+  - label: "notion"
+    description: "SaaS dashboard - productivity/tech content"
+```
+
+**Q4: Default Aspect Ratio**
+```yaml
+header: "Aspect"
+question: "Default aspect ratio for cover images?"
+options:
+  - label: "2.35:1 (Recommended)"
+    description: "Cinematic widescreen, best for article headers"
+  - label: "16:9"
+    description: "Standard widescreen, versatile"
+  - label: "1:1"
+    description: "Square, social media friendly"
+```
+
+**Q5: Save Location**
+```yaml
+header: "Save"
+question: "Where to save preferences?"
+options:
+  - label: "Project (Recommended)"
+    description: ".baoyu-skills/ (this project only)"
+  - label: "User"
+    description: "~/.baoyu-skills/ (all projects)"
+```
+
+**After setup**: Create EXTEND.md with user choices, then continue to Step 1.
+
+Full setup details: `references/config/first-time-setup.md`
+
+**EXTEND.md Supports**: Watermark | Preferred type | Preferred style | Default aspect ratio | Custom style definitions | Language preference
+
+Schema: `references/config/preferences-schema.md`
+
 ### Step 1: Analyze Content
 
+Read source content, save it if needed, and perform analysis.
+
+**Actions**:
 1. **Save source content** (if not already a file):
    - If user provides a file path: use as-is
    - If user pastes content: save to `source.md` in target directory
+2. Read source content
+3. **Content analysis**:
+   - Extract: topic, core message, tone, keywords
+   - Identify visual metaphor opportunities
+   - Detect content type (technical/personal/business/creative)
+4. **Language detection**:
+   - Detect source content language
+   - Note user's input language (from conversation)
+   - Compare with language preference in EXTEND.md
 
-2. **Extract key information**:
+### Step 2: Confirm Options ⚠️
-   - **Main topic**: What is the article about?
-   - **Core message**: What's the key takeaway?
-   - **Tone**: Serious, playful, inspiring, educational?
-   - **Keywords**: Identify style-signaling words
 
-3. **Language detection**:
+**Purpose**: Validate type, style and aspect ratio. **Do NOT skip.**
-   - Detect **source language** from content
-   - Detect **user language** from conversation context
-   - Note if source_language ≠ user_language (will ask in Step 3)
 
-### Step 2: Determine Options
+**Language**: Auto-determined (user's input language > saved preference > source language). No need to ask.
 
-1. **Style selection**:
+Present options using AskUserQuestion:
-   - If `--style` specified, use that style
-   - Otherwise, scan content for style signals and auto-select 3 candidates
-   - Default to `elegant` if no clear signals
 
-2. **Aspect ratio**:
+**Question 1: Type** (if not specified via `--type`)
-   - If `--aspect` specified, use that ratio
+- Show recommended type based on content analysis + preferred type from EXTEND.md
-   - Otherwise, prepare options: 2.35:1 (cinematic), 16:9 (widescreen), 1:1 (social)
 
-### Step 3: Confirm Options
+```yaml
-
+header: "Type"
-**Purpose**: Let user confirm all options in a single step before generation.
+question: "Which cover type?"
-
+multiSelect: false
-**IMPORTANT**: Present ALL options in a single confirmation step using AskUserQuestion. Do NOT interrupt workflow with multiple separate confirmations.
+options:
-
+  - label: "[auto-recommended type] (Recommended)"
-**Determine which questions to ask**:
+    description: "[reason based on content signals]"
-
+  - label: "hero"
-| Question | When to Ask |
+    description: "Large visual impact, title overlay - product launch, announcements"
-|----------|-------------|
+  - label: "conceptual"
-| Style | Always (required) |
+    description: "Concept visualization - technical, architecture"
-| Aspect ratio | Always (offer common options) |
+  - label: "typography"
-| Language | Only if `source_language ≠ user_language` |
+    description: "Text-focused layout - opinions, quotes"
-
-**Present options** (use AskUserQuestion with all applicable questions):
-
-**Question 1 (Style)** - always:
-- Style A (recommended): [style name] - [brief description]
-- Style B: [style name] - [brief description]
-- Style C: [style name] - [brief description]
-- Custom: Provide custom style reference
-
-**Question 2 (Aspect)** - always:
-- 2.35:1 Cinematic (Recommended) - ultra-wide, dramatic
-- 16:9 Widescreen - standard video/presentation
-- 1:1 Square - social media optimized
-
-**Question 3 (Language)** - only if source ≠ user language:
-- [Source language] (matches content)
-- [User language] (your preference)
-
-**Language handling**:
-- If source language = user language: Just inform user (e.g., "Title will be in Chinese")
-- If different: Ask which language to use for title text
-
-### Step 4: Generate Cover Concept
-
-Create a cover image concept based on selected style:
-
-**Title** (if included, max 8 characters):
-- Distill the core message into a punchy headline
-- Use hooks: numbers, questions, contrasts, pain points
-- Skip if `--no-title` flag is used
-
-**Visual Elements**:
-- Style-appropriate imagery and icons
-- 1-2 symbolic elements representing the topic
-- Metaphors or analogies that fit the style
-
-### Step 5: Create Prompt File
-
-Save prompt to `prompts/cover.md` with confirmed options.
-
-**All prompts are written in the user's confirmed language preference.**
-
-**Prompt Format**:
-
-```markdown
-Cover theme: [topic in 2-3 words]
-Style: [selected style name]
-Aspect ratio: [confirmed aspect ratio]
-
-[If title included:]
-Title text: [8 characters or less, in confirmed language]
-Subtitle: [optional, in confirmed language]
-
-Visual composition:
-- Main visual: [description matching style]
-- Layout: [positioning based on title inclusion and aspect ratio]
-- Decorative elements: [style-appropriate elements]
-
-Color scheme:
-- Primary: [style primary color]
-- Background: [style background color]
-- Accent: [style accent color]
-
-Style notes: [specific style characteristics to emphasize]
-
-[If no title:]
-Note: No title text, pure visual illustration only.
 ```
 
-### Step 6: Generate Image
+**Question 2: Style** (if not specified via `--style`)
+- Based on selected Type, show compatible styles (✓✓ first from compatibility matrix)
+- Format: `[style name] - [why it fits this content]`
+
+```yaml
+header: "Style"
+question: "Which cover style?"
+multiSelect: false
+options:
+  - label: "[best compatible style] (Recommended)"
+    description: "[reason based on type + content]"
+  - label: "[style2]"
+    description: "[reason]"
+  - label: "[style3]"
+    description: "[reason]"
+```
+
+**Question 3: Aspect Ratio** (if not specified via `--aspect`)
+
+```yaml
+header: "Aspect"
+question: "Cover aspect ratio?"
+multiSelect: false
+options:
+  - label: "2.35:1 (Recommended)"
+    description: "Cinematic widescreen, best for article headers"
+  - label: "16:9"
+    description: "Standard widescreen, versatile"
+  - label: "1:1"
+    description: "Square, social media friendly"
+```
+
+**After response**: Proceed to Step 3 with confirmed type + style + aspect ratio.
+
+### Step 3: Create Prompt
+
+Save to `prompts/cover.md`:
+
+```markdown
+Cover theme: [2-3 words]
+Type: [confirmed type]
+Style: [confirmed style]
+Aspect ratio: [confirmed ratio]
+Title text: [max 8 chars, or "none" if --no-title]
+Language: [confirmed language]
+
+Type composition:
+- [Type-specific layout and structure]
+
+Visual composition:
+- Main visual: [type + style appropriate metaphor]
+- Layout: [positioning based on type and aspect ratio]
+- Decorative: [style elements]
+
+Color scheme: [primary, background, accent from style]
+Type notes: [key characteristics from type definition]
+Style notes: [key characteristics from style definition]
+
+[Watermark section if enabled]
+```
+
+**Type-Specific Composition**:
+
+| Type | Composition Guidelines |
+|------|------------------------|
+| `hero` | Large focal visual (60-70% area), title overlay on visual, dramatic composition |
+| `conceptual` | Abstract shapes representing core concepts, information hierarchy, clean zones |
+| `typography` | Title as primary element (40%+ area), minimal supporting visuals, strong hierarchy |
+| `metaphor` | Concrete object/scene representing abstract idea, symbolic elements, emotional resonance |
+| `scene` | Atmospheric environment, narrative elements, mood-setting lighting and colors |
+| `minimal` | Single focal element, generous whitespace (60%+), essential shapes only |
+
+**Title guidelines** (if included):
+- Max 8 characters, punchy headline
+- Use hooks: numbers, questions, contrasts
+- Match confirmed language
+
+**Watermark Application** (if enabled in preferences):
+Add to prompt:
+```
+Include a subtle watermark "[content]" positioned at [position]
+with approximately [opacity*100]% visibility. The watermark should
+be legible but not distracting from the main content.
+```
+Reference: `references/config/watermark-guide.md`
+
+### Step 4: Generate Image
 
 **Image Generation Skill Selection**:
 1. Check available image generation skills
-2. If multiple skills available, ask user to choose
+2. If multiple skills available, ask user preference
+3. Call selected skill with:
+   - Prompt file path
+   - Output image path: `cover.png`
+   - Aspect ratio parameter
 
-**Generation**:
+**On failure**: Auto-retry once before reporting error.
-Call selected image generation skill with prompt file, output path, and confirmed aspect ratio.
 
-### Step 7: Output Summary
+### Step 5: Completion Report
 
 ```
-Cover Image Generated!
+Cover Generated!
 
 Topic: [topic]
+Type: [type name]
 Style: [style name]
-Aspect: [aspect ratio]
+Aspect: [ratio]
-Title: [cover title] (or "No title - visual only")
+Title: [title or "visual only"]
-Language: [confirmed language]
+Language: [lang]
-Location: [output path]
+Watermark: [enabled/disabled]
+Location: [directory path]
 
-Preview the image to verify it matches your expectations.
+Files:
+✓ source-{slug}.{ext}
+✓ prompts/cover.md
+✓ cover.png
 ```
 
+## Image Modification
+
+| Action | Steps |
+|--------|-------|
+| **Regenerate** | Update prompt → Regenerate with same settings |
+| **Change type** | Confirm new type → Update prompt → Regenerate |
+| **Change style** | Confirm new style → Update prompt → Regenerate |
+| **Change aspect** | Confirm new aspect → Update prompt → Regenerate |
+
 ## Notes
 
-- Cover should be instantly understandable at small preview sizes
+- Cover must be readable at small preview sizes
-- Title (if included) must be readable and impactful
+- Visual metaphors > literal representations
-- Visual metaphors work better than literal representations
+- Title: max 8 chars, readable, impactful
-- Maintain style consistency throughout the cover
+- **Two confirmation points**: Step 0 (first-time setup if no EXTEND.md) + Step 2 (options) - do NOT skip
-- Image generation typically takes 10-30 seconds
+- Use confirmed language for title text
-- Title text uses user's confirmed language preference
+- Maintain watermark consistency if enabled
-- Aspect ratio: 2.35:1 for cinematic/dramatic, 16:9 for widescreen, 1:1 for social media
+- Check Type × Style compatibility matrix when selecting combinations
+
+## References
+
+**Styles**: `references/styles/<name>.md` - Style definitions
+
+**Config**:
+- `references/config/preferences-schema.md` - EXTEND.md schema
+- `references/config/first-time-setup.md` - First-time setup flow
+- `references/config/watermark-guide.md` - Watermark configuration
 
 ## Extension Support
 
-Custom styles and configurations via EXTEND.md.
+Custom configurations via EXTEND.md. See **Step 0** for paths and supported options.
-
-**Check paths** (priority order):
-1. `.baoyu-skills/baoyu-cover-image/EXTEND.md` (project)
-2. `~/.baoyu-skills/baoyu-cover-image/EXTEND.md` (user)
-
-If found, load before Step 1. Extension content overrides defaults.

skills/baoyu-cover-image/references/config/first-time-setup.md

@@ -0,0 +1,145 @@
+---
+name: first-time-setup
+description: First-time setup flow for baoyu-cover-image preferences
+---
+
+# First-Time Setup
+
+## Overview
+
+When no EXTEND.md is found, guide user through preference setup.
+
+## Setup Flow
+
+```
+No EXTEND.md found
+        │
+        ▼
+┌─────────────────────┐
+│ AskUserQuestion     │
+│ (all questions)     │
+└─────────────────────┘
+        │
+        ▼
+┌─────────────────────┐
+│ Create EXTEND.md    │
+└─────────────────────┘
+        │
+        ▼
+    Continue to Step 1
+```
+
+## Questions
+
+**Language**: Use user's input language or saved language preference.
+
+Use single AskUserQuestion with multiple questions (AskUserQuestion auto-adds "Other" option):
+
+### Question 1: Watermark
+
+```
+header: "Watermark"
+question: "Watermark text for generated cover images? Type your watermark content (e.g., name, @handle)"
+options:
+  - label: "No watermark (Recommended)"
+    description: "No watermark, can enable later in EXTEND.md"
+```
+
+Position defaults to bottom-right.
+
+### Question 2: Preferred Type
+
+```
+header: "Type"
+question: "Default cover type preference?"
+options:
+  - label: "None (Recommended)"
+    description: "Auto-select based on content analysis"
+  - label: "hero"
+    description: "Large visual impact - product launch, announcements"
+  - label: "conceptual"
+    description: "Concept visualization - technical, architecture"
+  - label: "typography"
+    description: "Text-focused layout - opinions, quotes"
+```
+
+### Question 3: Preferred Style
+
+```
+header: "Style"
+question: "Default cover style preference? Or type another style name"
+options:
+  - label: "None (Recommended)"
+    description: "Auto-select based on content analysis"
+  - label: "elegant"
+    description: "Refined, sophisticated - professional business"
+  - label: "blueprint"
+    description: "Technical schematics - architecture/system design"
+  - label: "notion"
+    description: "SaaS dashboard - productivity/tech content"
+```
+
+### Question 4: Default Aspect Ratio
+
+```
+header: "Aspect"
+question: "Default aspect ratio for cover images?"
+options:
+  - label: "2.35:1 (Recommended)"
+    description: "Cinematic widescreen, best for article headers"
+  - label: "16:9"
+    description: "Standard widescreen, versatile"
+  - label: "1:1"
+    description: "Square, social media friendly"
+```
+
+### Question 5: Save Location
+
+```
+header: "Save"
+question: "Where to save preferences?"
+options:
+  - label: "Project"
+    description: ".baoyu-skills/ (this project only)"
+  - label: "User"
+    description: "~/.baoyu-skills/ (all projects)"
+```
+
+## Save Locations
+
+| Choice | Path | Scope |
+|--------|------|-------|
+| Project | `.baoyu-skills/baoyu-cover-image/EXTEND.md` | Current project |
+| User | `~/.baoyu-skills/baoyu-cover-image/EXTEND.md` | All projects |
+
+## After Setup
+
+1. Create directory if needed
+2. Write EXTEND.md with frontmatter
+3. Confirm: "Preferences saved to [path]"
+4. Continue to Step 1
+
+## EXTEND.md Template
+
+```yaml
+---
+version: 1
+watermark:
+  enabled: [true/false]
+  content: "[user input or empty]"
+  position: bottom-right
+  opacity: 0.7
+preferred_type: [selected type or null]
+preferred_style: [selected style or null]
+default_aspect: [2.35:1/16:9/1:1]
+language: null
+custom_styles: []
+---
+```
+
+## Modifying Preferences Later
+
+Users can edit EXTEND.md directly or run setup again:
+- Delete EXTEND.md to trigger setup
+- Edit YAML frontmatter for quick changes
+- Full schema: `config/preferences-schema.md`

skills/baoyu-cover-image/references/config/preferences-schema.md

@@ -0,0 +1,140 @@
+---
+name: preferences-schema
+description: EXTEND.md YAML schema for baoyu-cover-image user preferences
+---
+
+# Preferences Schema
+
+## Full Schema
+
+```yaml
+---
+version: 1
+
+watermark:
+  enabled: false
+  content: ""
+  position: bottom-right  # bottom-right|bottom-left|bottom-center|top-right
+  opacity: 0.7            # 0.1-1.0
+
+preferred_type: null      # hero|conceptual|typography|metaphor|scene|minimal or null for auto-select
+
+preferred_style: null     # Built-in style name or null for auto-select
+
+default_aspect: "2.35:1"  # 2.35:1|16:9|1:1
+
+language: null            # zh|en|ja|ko|auto (null = auto-detect)
+
+custom_styles:
+  - name: my-style
+    description: "Style description"
+    color_palette:
+      primary: ["#1E3A5F", "#4A90D9"]
+      background: "#F5F7FA"
+      accents: ["#00B4D8"]
+    visual_elements: "Clean lines, geometric shapes"
+    typography: "Modern sans-serif"
+    best_for: "Business, tech content"
+---
+```
+
+## Field Reference
+
+| Field | Type | Default | Description |
+|-------|------|---------|-------------|
+| `version` | int | 1 | Schema version |
+| `watermark.enabled` | bool | false | Enable watermark |
+| `watermark.content` | string | "" | Watermark text (@username or custom) |
+| `watermark.position` | enum | bottom-right | Position on image |
+| `watermark.opacity` | float | 0.7 | Transparency (0.1-1.0) |
+| `preferred_type` | string | null | Type name or null for auto |
+| `preferred_style` | string | null | Style name or null for auto |
+| `default_aspect` | string | "2.35:1" | Default aspect ratio |
+| `language` | string | null | Output language (null = auto-detect) |
+| `custom_styles` | array | [] | User-defined styles |
+
+## Type Options
+
+| Value | Description |
+|-------|-------------|
+| `hero` | Large visual impact, title overlay |
+| `conceptual` | Concept visualization, abstract core ideas |
+| `typography` | Text-focused layout, prominent title |
+| `metaphor` | Visual metaphor, concrete expressing abstract |
+| `scene` | Atmospheric scene, narrative feel |
+| `minimal` | Minimalist composition, generous whitespace |
+
+## Position Options
+
+| Value | Description |
+|-------|-------------|
+| `bottom-right` | Lower right corner (default, most common) |
+| `bottom-left` | Lower left corner |
+| `bottom-center` | Bottom center |
+| `top-right` | Upper right corner |
+
+## Aspect Ratio Options
+
+| Value | Description | Best For |
+|-------|-------------|----------|
+| `2.35:1` | Cinematic widescreen | Article headers, blog covers |
+| `16:9` | Standard widescreen | Presentations, video thumbnails |
+| `1:1` | Square | Social media, profile images |
+
+## Custom Style Fields
+
+| Field | Required | Description |
+|-------|----------|-------------|
+| `name` | Yes | Unique style identifier (kebab-case) |
+| `description` | Yes | What the style conveys |
+| `color_palette.primary` | No | Main colors (array) |
+| `color_palette.background` | No | Background color |
+| `color_palette.accents` | No | Accent colors (array) |
+| `visual_elements` | No | Decorative elements |
+| `typography` | No | Font/lettering style |
+| `best_for` | No | Recommended content types |
+
+## Example: Minimal Preferences
+
+```yaml
+---
+version: 1
+watermark:
+  enabled: true
+  content: "@myhandle"
+preferred_type: null
+preferred_style: elegant
+---
+```
+
+## Example: Full Preferences
+
+```yaml
+---
+version: 1
+watermark:
+  enabled: true
+  content: "myblog.com"
+  position: bottom-right
+  opacity: 0.5
+
+preferred_type: conceptual
+
+preferred_style: blueprint
+
+default_aspect: "16:9"
+
+language: en
+
+custom_styles:
+  - name: corporate-tech
+    description: "Professional B2B tech style"
+    color_palette:
+      primary: ["#1E3A5F", "#4A90D9"]
+      background: "#F5F7FA"
+      accents: ["#00B4D8", "#48CAE4"]
+    visual_elements: "Clean lines, subtle gradients, circuit patterns"
+    typography: "Modern sans-serif, professional"
+    best_for: "SaaS, enterprise, technical"
+---
+```

skills/baoyu-cover-image/references/config/watermark-guide.md

@@ -0,0 +1,81 @@
+---
+name: watermark-guide
+description: Watermark configuration guide for baoyu-cover-image
+---
+
+# Watermark Guide
+
+## Position Diagram
+
+```
+┌─────────────────────────────┐
+│                  [top-right]│
+│                             │
+│                             │
+│       COVER IMAGE           │
+│                             │
+│                             │
+│[bottom-left][bottom-center][bottom-right]│
+└─────────────────────────────┘
+```
+
+## Position Recommendations
+
+| Position | Best For | Avoid When |
+|----------|----------|------------|
+| `bottom-right` | Default choice, most common | Title in bottom-right |
+| `bottom-left` | Right-heavy layouts | Key visual in bottom-left |
+| `bottom-center` | Centered designs | Text-heavy bottom area |
+| `top-right` | Bottom-heavy content | Title/header in top-right |
+
+## Opacity Examples
+
+| Opacity | Visual Effect | Use Case |
+|---------|---------------|----------|
+| 0.3 | Very subtle, barely visible | Clean aesthetic priority |
+| 0.5 | Balanced, noticeable but not distracting | Default recommendation |
+| 0.7 | Clearly visible | Brand recognition priority |
+| 0.9 | Strong presence | Anti-copy protection |
+
+## Content Format
+
+| Format | Example | Style |
+|--------|---------|-------|
+| Handle | `@username` | Social media |
+| Domain | `myblog.com` | Cross-platform |
+| Brand | `MyBrand` | Simple branding |
+| Chinese | `博客名` | Chinese platforms |
+
+## Best Practices
+
+1. **Consistency**: Use same watermark across all covers
+2. **Legibility**: Ensure watermark readable on both light/dark areas
+3. **Size**: Keep subtle - should not distract from content
+4. **Contrast**: Adjust opacity based on cover background
+
+## Prompt Integration
+
+When watermark is enabled, add to image generation prompt:
+
+```
+Include a subtle watermark "[content]" positioned at [position]
+with approximately [opacity*100]% visibility. The watermark should
+be legible but not distracting from the main content.
+```
+
+## Cover-Specific Considerations
+
+| Aspect Ratio | Recommended Position | Notes |
+|--------------|---------------------|-------|
+| 2.35:1 | bottom-right | Cinematic - keep corners clean |
+| 16:9 | bottom-right | Standard - flexible placement |
+| 1:1 | bottom-center | Square - centered often works better |
+
+## Common Issues
+
+| Issue | Solution |
+|-------|----------|
+| Watermark invisible | Increase opacity or adjust position |
+| Watermark too prominent | Decrease opacity (0.3-0.5) |
+| Watermark overlaps title | Change position or reduce title area |
+| Inconsistent appearance | Use fixed opacity/position in preferences |

skills/baoyu-infographic/SKILL.md

@@ -1,74 +1,47 @@
 ---
 name: baoyu-infographic
-description: Generate 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", "信息图", or "visual summary".
+description: 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 "可视化".
 ---
 
 # Infographic Generator
 
-Generate professional infographics with two dimensions: layout (information structure) and style (visual aesthetics).
+Two dimensions: **layout** (information structure) × **style** (visual aesthetics). Freely combine any layout with any style.
 
 ## Usage
 
 ```bash
-# Auto-recommend combinations based on content
 /baoyu-infographic path/to/content.md
-
+/baoyu-infographic path/to/content.md --layout hierarchical-layers --style technical-schematic
-# Specify layout
+/baoyu-infographic path/to/content.md --aspect portrait --lang zh
-/baoyu-infographic path/to/content.md --layout hierarchical-layers
+/baoyu-infographic  # then paste content
-
-# Specify style (default: craft-handmade)
-/baoyu-infographic path/to/content.md --style technical-schematic
-
-# Specify both
-/baoyu-infographic path/to/content.md --layout funnel --style corporate-memphis
-
-# With aspect ratio
-/baoyu-infographic path/to/content.md --aspect portrait
-
-# Direct content input
-/baoyu-infographic
-[paste content]
-
-# Direct input with options
-/baoyu-infographic --layout linear-progression --style aged-academia
-[paste content]
 ```
 
 ## Options
 
-| Option | Description |
+| Option | Values |
-|--------|-------------|
+|--------|--------|
-| `--layout <name>` | Information layout (20 options, see Layout Gallery) |
+| `--layout` | 20 options (see Layout Gallery), default: bento-grid |
-| `--style <name>` | Visual style (17 options, default: craft-handmade) |
+| `--style` | 17 options (see Style Gallery), default: craft-handmade |
-| `--aspect <ratio>` | landscape (16:9), portrait (9:16), square (1:1) |
+| `--aspect` | landscape (16:9), portrait (9:16), square (1:1) |
-| `--lang <code>` | Output language (en, zh, ja, etc.) |
+| `--lang` | en, zh, ja, etc. |
-
-## Two Dimensions
-
-| Dimension | Controls | Count |
-|-----------|----------|-------|
-| **Layout** | Information structure: hierarchy, flow, relationships | 20 types |
-| **Style** | Visual aesthetics: colors, textures, artistic treatment | 17 types |
-
-Layout × Style can be freely combined. Example: `--layout hierarchical-layers --style craft-handmade` creates a hierarchy with playful hand-drawn aesthetics.
 
 ## Layout Gallery
 
 | Layout | Best For |
 |--------|----------|
-| `linear-progression` | Timelines, step-by-step processes, tutorials |
+| `linear-progression` | Timelines, processes, tutorials |
 | `binary-comparison` | A vs B, before-after, pros-cons |
 | `comparison-matrix` | Multi-factor comparisons |
-| `hierarchical-layers` | Pyramids, concentric circles, priority levels |
+| `hierarchical-layers` | Pyramids, priority levels |
 | `tree-branching` | Categories, taxonomies |
 | `hub-spoke` | Central concept with related items |
-| `structural-breakdown` | Exploded views, cross-sections, part labeling |
+| `structural-breakdown` | Exploded views, cross-sections |
 | `bento-grid` | Multiple topics, overview (default) |
 | `iceberg` | Surface vs hidden aspects |
-| `bridge` | Problem-solution, gap-crossing |
+| `bridge` | Problem-solution |
-| `funnel` | Conversion processes, filtering |
+| `funnel` | Conversion, filtering |
-| `isometric-map` | Spatial relationships, locations |
+| `isometric-map` | Spatial relationships |
-| `dashboard` | Metrics, KPIs, data display |
+| `dashboard` | Metrics, KPIs |
 | `periodic-table` | Categorized collections |
 | `comic-strip` | Narratives, sequences |
 | `story-mountain` | Plot structure, tension arcs |
@@ -77,415 +50,170 @@ Layout × Style can be freely combined. Example: `--layout hierarchical-layers -
 | `winding-roadmap` | Journey, milestones |
 | `circular-flow` | Cycles, recurring processes |
 
-Detailed layout definitions: `references/layouts/<layout>.md`
+Full definitions: `references/layouts/<layout>.md`
 
 ## Style Gallery
 
 | Style | Description |
 |-------|-------------|
-| `craft-handmade` (Default) | Hand-drawn illustration, paper craft aesthetic |
+| `craft-handmade` | Hand-drawn, paper craft (default) |
-| `claymation` | 3D clay figures, playful stop-motion |
+| `claymation` | 3D clay figures, stop-motion |
-| `kawaii` | Japanese cute, big eyes, pastel colors |
+| `kawaii` | Japanese cute, pastels |
-| `storybook-watercolor` | Soft painted illustrations, whimsical |
+| `storybook-watercolor` | Soft painted, whimsical |
-| `chalkboard` | Colorful chalk on black board |
+| `chalkboard` | Chalk on black board |
-| `cyberpunk-neon` | Neon glow on dark, futuristic |
+| `cyberpunk-neon` | Neon glow, futuristic |
-| `bold-graphic` | Comic style, halftone dots, high contrast |
+| `bold-graphic` | Comic style, halftone |
-| `aged-academia` | Vintage science, sepia sketches |
+| `aged-academia` | Vintage science, sepia |
-| `corporate-memphis` | Flat vector people, vibrant fills |
+| `corporate-memphis` | Flat vector, vibrant |
-| `technical-schematic` | Blueprint, isometric 3D, engineering |
+| `technical-schematic` | Blueprint, engineering |
-| `origami` | Folded paper forms, geometric |
+| `origami` | Folded paper, geometric |
-| `pixel-art` | Retro 8-bit, nostalgic gaming |
+| `pixel-art` | Retro 8-bit |
-| `ui-wireframe` | Grayscale boxes, interface mockup |
+| `ui-wireframe` | Grayscale interface mockup |
-| `subway-map` | Transit diagram, colored lines |
+| `subway-map` | Transit diagram |
-| `ikea-manual` | Minimal line art, assembly style |
+| `ikea-manual` | Minimal line art |
-| `knolling` | Organized flat-lay, top-down |
+| `knolling` | Organized flat-lay |
-| `lego-brick` | Toy brick construction, playful |
+| `lego-brick` | Toy brick construction |
 
-Detailed style definitions: `references/styles/<style>.md`
+Full definitions: `references/styles/<style>.md`
 
 ## Recommended Combinations
 
-Based on content analysis, the system recommends 3-5 layout×style combinations:
+| Content Type | Layout + Style |
-
+|--------------|----------------|
-| Content Type | Recommended Combination |
-|--------------|------------------------|
 | Timeline/History | `linear-progression` + `craft-handmade` |
-| Step-by-step Process | `linear-progression` + `ikea-manual` |
+| Step-by-step | `linear-progression` + `ikea-manual` |
-| Comparison (A vs B) | `binary-comparison` + `corporate-memphis` |
+| A vs B | `binary-comparison` + `corporate-memphis` |
-| Hierarchy/Levels | `hierarchical-layers` + `craft-handmade` |
+| Hierarchy | `hierarchical-layers` + `craft-handmade` |
-| Relationships/Overlap | `venn-diagram` + `craft-handmade` |
+| Overlap | `venn-diagram` + `craft-handmade` |
-| Conversion/Sales | `funnel` + `corporate-memphis` |
+| Conversion | `funnel` + `corporate-memphis` |
-| Recurring Process | `circular-flow` + `craft-handmade` |
+| Cycles | `circular-flow` + `craft-handmade` |
-| Technical/System | `structural-breakdown` + `technical-schematic` |
+| Technical | `structural-breakdown` + `technical-schematic` |
-| Data/Metrics | `dashboard` + `corporate-memphis` |
+| Metrics | `dashboard` + `corporate-memphis` |
-| Educational/Overview | `bento-grid` + `chalkboard` |
+| Educational | `bento-grid` + `chalkboard` |
-| Journey/Roadmap | `winding-roadmap` + `storybook-watercolor` |
+| Journey | `winding-roadmap` + `storybook-watercolor` |
-| Categories/Types | `periodic-table` + `bold-graphic` |
+| Categories | `periodic-table` + `bold-graphic` |
 
-**Default combination**: `bento-grid` + `craft-handmade`
+Default: `bento-grid` + `craft-handmade`
 
-## File Structure
+## Output Structure
-
-Each session creates an independent directory:
 
 ```
 infographic/{topic-slug}/
-├── source-{slug}.{ext}             # Source files
+├── source-{slug}.{ext}
-├── analysis.md                     # Deep content analysis
+├── analysis.md
-├── structured-content.md           # Instructional content structure
+├── structured-content.md
-├── prompts/
+├── prompts/infographic.md
-│   └── infographic.md              # Generated prompt
+└── infographic.png
-└── infographic.png                 # Output image
 ```
 
-**Slug Generation**:
+Slug: 2-4 words kebab-case from topic. Conflict: append `-YYYYMMDD-HHMMSS`.
-1. Extract main topic from content (2-4 words, kebab-case)
-2. Example: "Machine Learning Basics" → `ml-basics`
 
-**Conflict Resolution**:
+## Core Principles
-If `infographic/{topic-slug}/` already exists:
-- Append timestamp: `{topic-slug}-YYYYMMDD-HHMMSS`
-- Example: `ml-basics` exists → `ml-basics-20260120-103052`
 
-## Instructional Design Approach
+- Preserve all source data **verbatim**—no summarization or rephrasing
-
+- Define learning objectives before structuring content
-This skill applies a **world-class instructional designer** mindset to infographic creation:
+- Structure for visual communication (headlines, labels, visual elements)
-
-1. **Deep Understanding**: Read and comprehend the source material thoroughly
-2. **Learning Objectives**: Identify what the viewer should understand after seeing the infographic
-3. **Information Architecture**: Structure content for maximum clarity and retention
-4. **Visual Storytelling**: Use visuals to communicate complex ideas accessibly
-5. **Verbatim Data**: Preserve all source data exactly as written—no summarization or rephrasing of facts
 
 ## Workflow
 
-### Step 1: Analyze Content → `analysis.md`
+### Step 1: Setup & Analyze
 
-Read source content and perform deep instructional analysis.
+**1.1 Load Preferences (EXTEND.md)**
 
-**Actions**:
+Use Bash to check EXTEND.md existence (priority order):
-1. **Save source content** (if not already a file):
-   - If user provides a file path: use as-is
-   - If user pastes content: save to `source.md` in target directory
 
-2. **Deep reading**:
+```bash
-   - Read the entire document thoroughly
+# Check project-level first
-   - Develop deep understanding before proceeding
+test -f .baoyu-skills/baoyu-infographic/EXTEND.md && echo "project"
-   - Identify the core message and purpose
 
-3. **Content analysis**:
+# Then user-level (cross-platform: $HOME works on macOS/Linux/WSL)
-   | Aspect | Questions to Answer |
+test -f "$HOME/.baoyu-skills/baoyu-infographic/EXTEND.md" && echo "user"
-   |--------|---------------------|
-   | **Main Topic** | What is this content fundamentally about? |
-   | **Data Type** | Timeline? Hierarchy? Comparison? Process? Relationships? |
-   | **Complexity** | Simple (3-5 points) or complex (6-10+ points)? |
-   | **Tone** | Technical, educational, playful, serious, persuasive? |
-   | **Audience** | Who is the intended viewer? What do they already know? |
-
-4. **Language detection**:
-   - Detect **source language** from content
-   - Detect **user language** from conversation
-   - Note if source_language ≠ user_language (will ask in Step 4)
-
-5. **Extract design instructions** from user input:
-   - Style preferences (colors, mood, aesthetic)
-   - Layout preferences (structure, organization)
-   - Any specific visual requirements
-   - Separate these from content—they go in the Design Instructions section
-
-6. **Save to `analysis.md`**
-
-**Analysis Output Format**:
-```yaml
----
-title: "[Main topic title]"
-topic: "[Category: educational/technical/business/etc.]"
-data_type: "[timeline/hierarchy/comparison/process/etc.]"
-complexity: "[simple/moderate/complex]"
-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]
-
-## Design Instructions (from user input)
-[Any style, color, layout, or visual preferences extracted from user's steering prompt]
 ```
 
+┌────────────────────────────────────────────────────┬───────────────────┐
+│                        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`**
+
+1. Save source content (file path or paste → `source.md`)
+2. Analyze: topic, data type, complexity, tone, audience
+3. Detect source language and user language
+4. Extract design instructions from user input
+5. Save analysis
+
+See `references/analysis-framework.md` for detailed format.
+
 ### Step 2: Generate Structured Content → `structured-content.md`
 
-Transform analyzed content into a structured format for the infographic designer.
+Transform content into infographic structure:
+1. Title and learning objectives
+2. Sections with: key concept, content (verbatim), visual element, text labels
+3. Data points (all statistics/quotes copied exactly)
+4. Design instructions from user
 
-**Instructional Design Process**:
+**Rules**: Markdown only. No new information. All data verbatim.
 
-1. **Create high-level outline**:
+See `references/structured-content-template.md` for detailed format.
-   - Title that captures the essence
-   - List all main learning objectives
-   - Identify the logical flow
 
-2. **Flesh out each section**:
+### Step 3: Recommend Combinations
-   - For each learning objective, create a section
-   - Mix conceptual explanations with practical elements
-   - Preserve all source data **verbatim**—do not summarize or rephrase
 
-3. **Structure for visual communication**:
+Recommend 3-5 layout×style combinations based on:
-   - Identify what becomes a headline
+- Data structure → matching layout
-   - Identify what becomes supporting text
+- Content tone → matching style
-   - Identify what becomes a visual element
+- Audience expectations
-   - Identify data points, statistics, or quotes
+- User design instructions
-
-**Critical Rules**:
-| Rule | Requirement |
-|------|-------------|
-| **Output format** | Markdown only |
-| **Tone** | Expert trainer: knowledgeable, clear, encouraging |
-| **No new information** | Do not add anything not in the source |
-| **Verbatim data** | All statistics, quotes, and facts copied exactly |
-
-**Structured Content Format**:
-```markdown
-# [Infographic Title]
-
-## Overview
-[Brief description of what this infographic conveys]
-
-## Learning Objectives
-The viewer will understand:
-1. [Objective 1]
-2. [Objective 2]
-3. [Objective 3]
-
----
-
-## Section 1: [Section Title]
-
-**Key Concept**: [One-sentence summary]
-
-**Content**:
-- [Point 1 - verbatim from source]
-- [Point 2 - verbatim from source]
-- [Point 3 - verbatim from source]
-
-**Visual Element**: [What to show visually]
-
-**Text Labels**:
-- Headline: "[Exact text for headline]"
-- Subhead: "[Exact text for subhead]"
-- Labels: "[Label 1]", "[Label 2]", ...
-
----
-
-## Section 2: [Section Title]
-[Continue pattern...]
-
----
-
-## Data Points (Verbatim)
-[All statistics, numbers, quotes exactly as they appear in source]
-- "[Exact quote or statistic 1]"
-- "[Exact quote or statistic 2]"
-
----
-
-## Design Instructions
-[Extracted from user's steering prompt]
-- Style: [preferences]
-- Colors: [preferences]
-- Layout: [preferences]
-- Other: [any other visual requirements]
-```
-
-### Step 3: Generate Layout×Style Recommendations
-
-Based on analysis and structured content, recommend 3-5 combinations.
-
-**Selection Criteria**:
-| Factor | How to Match |
-|--------|--------------|
-| **Data structure** | Timeline→linear-progression, Hierarchy→hierarchical-layers, etc. |
-| **Content tone** | Technical→technical-schematic, Playful→kawaii, etc. |
-| **Audience** | Business→corporate-memphis, Educational→chalkboard, etc. |
-| **Complexity** | Simple→sparse layouts, Complex→dense layouts |
-| **User preferences** | Honor any design instructions from Step 1 |
-
-**Format each recommendation**:
-```
-[Layout] + [Style]: [Brief rationale based on content analysis]
-```
 
 ### Step 4: Confirm Options
 
-**IMPORTANT**: Present ALL options in a single confirmation step using AskUserQuestion.
+Present all options in single confirmation:
-
+1. **Combination** (always): 3+ options with rationale
-**Questions to ask**:
+2. **Aspect** (always): landscape/portrait/square
-
+3. **Language** (only if source ≠ user language): which language for text
-| Question | When to Ask |
-|----------|-------------|
-| Combination | Always (required) |
-| Aspect ratio | Always |
-| Language | Only if `source_language ≠ user_language` |
-
-**AskUserQuestion format**:
-
-**Question 1 (Combination)** - always:
-- Option A (Recommended): [layout] + [style] - [brief rationale]
-- Option B: [layout] + [style] - [brief rationale]
-- Option C: [layout] + [style] - [brief rationale]
-- Custom: Specify your own layout and/or style
-
-**Question 2 (Aspect)** - always:
-- landscape (16:9, Recommended) - standard presentation
-- portrait (9:16) - mobile/social media
-- square (1:1) - social media posts
-
-**Question 3 (Language)** - only if source ≠ user language:
-- [Source language] (matches content)
-- [User language] (your preference)
-
-**Language handling**:
-- If source language = user language: Just inform user
-- If different: Ask which language to use for all text
 
 ### Step 5: Generate Prompt → `prompts/infographic.md`
 
-Create the image generation prompt.
+Combine:
-
+1. Layout definition from `references/layouts/<layout>.md`
-**Process**:
+2. Style definition from `references/styles/<style>.md`
-1. Read layout definition from `references/layouts/<layout>.md`
+3. Base template from `references/base-prompt.md`
-2. Read style definition from `references/styles/<style>.md`
+4. Structured content from Step 2
-3. Read base prompt template from `references/base-prompt.md`
+5. All text in confirmed language
-4. Combine with structured content from Step 2
-5. **All text in prompt uses confirmed language**
-
-**Prompt Structure**:
-```markdown
-Topic: [main topic from analysis]
-Layout: [selected layout]
-Style: [selected style]
-Aspect: [confirmed ratio]
-Language: [confirmed language]
-
-## Layout Guidelines
-[From layout definition file]
-
-## Style Guidelines
-[From style definition file]
-
-## Content to Visualize
-
-### Learning Objectives
-[From structured-content.md]
-
-### Sections
-[From structured-content.md - each section with its visual elements]
-
-### Data Points (Verbatim)
-[All exact statistics, quotes, and facts from source]
-
-## Text Labels (in [language])
-[All text that appears in the infographic, organized by section]
-
-## Design Instructions
-[Any specific visual requirements from user's steering prompt]
-```
 
 ### Step 6: Generate Image
 
-**Image Generation Skill Selection**:
+1. Select available image generation skill (ask user if multiple)
-1. Check available image generation skills
+2. Call with prompt file and output path
-2. If multiple skills available, ask user to choose
+3. On failure, auto-retry once
-
-**Generation**:
-Call selected image generation skill with:
-- Prompt file path: `prompts/infographic.md`
-- Output path: `infographic.png`
-- Aspect ratio parameter if supported
-
-**Error handling**:
-- On failure, auto-retry once before reporting error
-- If retry fails, inform user with error details
 
 ### Step 7: Output Summary
 
-```
+Report: topic, layout, style, aspect, language, output path, files created.
-Infographic Generated!
-
-Topic: [topic from analysis]
-Layout: [layout name]
-Style: [style name]
-Aspect: [aspect ratio]
-Language: [confirmed language]
-Location: [output directory path]
-
-Learning Objectives Covered:
-1. [Objective 1] ✓
-2. [Objective 2] ✓
-3. [Objective 3] ✓
-
-Files:
-✓ analysis.md
-✓ structured-content.md
-✓ prompts/infographic.md
-✓ infographic.png
-
-Preview the image to verify it matches your expectations.
-```
-
-## Quality Checklist
-
-Before generating the final image, verify:
-
-- [ ] All source data preserved verbatim (no summarization)
-- [ ] Learning objectives clearly represented
-- [ ] Layout matches information structure
-- [ ] Style matches content tone and audience
-- [ ] All text labels in correct language
-- [ ] Design instructions from user honored
-- [ ] Visual hierarchy supports comprehension
 
 ## References
 
-Detailed templates and guidelines in `references/` directory:
+- `references/analysis-framework.md` - Analysis methodology
-- `analysis-framework.md` - Instructional design analysis methodology
+- `references/structured-content-template.md` - Content format
-- `structured-content-template.md` - Structured content format and examples
+- `references/base-prompt.md` - Prompt template
-- `base-prompt.md` - Base prompt template for image generation
+- `references/layouts/<layout>.md` - 20 layout definitions
-- `layouts/<layout>.md` - Detailed layout definitions (20 files)
+- `references/styles/<style>.md` - 17 style definitions
-- `styles/<style>.md` - Detailed style definitions (17 files)
-
-## Notes
-
-- Layout determines information architecture; style determines visual treatment
-- Default style `craft-handmade` works well with most layouts
-- Technical content benefits from `technical-schematic` or `ui-wireframe`
-- Educational content works well with `chalkboard`, `storybook-watercolor`
-- Business content pairs with `corporate-memphis`, `dashboard`
-- All text in the infographic uses the confirmed language
-- **Never add information not present in the source document**
-- **Statistics and quotes must be copied exactly—no paraphrasing**
 
 ## Extension Support
 
-Custom styles and configurations via EXTEND.md.
+Custom configurations via EXTEND.md. See **Step 1.1** for paths and supported options.
-
-**Check paths** (priority order):
-1. `.baoyu-skills/baoyu-infographic/EXTEND.md` (project)
-2. `~/.baoyu-skills/baoyu-infographic/EXTEND.md` (user)
-
-If found, load before Step 1. Extension content overrides defaults.

skills/baoyu-infographic/references/layouts/bento-grid.md

@@ -36,6 +36,6 @@ Modular grid layout with varied cell sizes, like a bento box.
 
 ## Recommended Pairings
 
-- `cartoon-hand-drawn`: Friendly overviews (default)
+- `craft-handmade`: Friendly overviews (default)
 - `corporate-memphis`: Business summaries
 - `pixel-art`: Retro feature grids

skills/baoyu-infographic/references/styles/craft-handmade.md

@@ -21,8 +21,16 @@ Hand-drawn and paper craft aesthetic with warm, organic feel.
 - Organic, slightly imperfect shapes
 - Layered depth with shadows (paper variant)
 - Simple cartoon elements and icons
+- Character illustrations (people, personalities in cartoon form)
 - Ample whitespace, clean composition
 - Keywords and core concepts highlighted
+- **Strictly hand-drawn—no realistic or photographic elements**
+
+## Style Enforcement
+
+- All imagery must maintain cartoon/illustrated aesthetic
+- Replace real photos or realistic figures with hand-drawn equivalents
+- Maintain consistent line weight and illustration style throughout
 
 ## Typography
 

skills/baoyu-xhs-images/SKILL.md

@@ -164,11 +164,11 @@ Copy and track progress:
 
 ```
 XHS Infographic Progress:
-- [ ] Step 0: Check preferences (EXTEND.md)
+- [ ] Step 0: Check preferences (EXTEND.md) ⚠️ REQUIRED if not found
 - [ ] Step 1: Analyze content → analysis.md
 - [ ] Step 2: Confirmation 1 - Content understanding ⚠️ REQUIRED
 - [ ] Step 3: Generate 3 outline + style variants
-- [ ] Step 4: Confirmation 2 - Outline & style selection ⚠️ REQUIRED
+- [ ] Step 4: Confirmation 2 - Outline & style & elements selection ⚠️ REQUIRED
 - [ ] Step 5: Generate images (sequential)
 - [ ] Step 6: Completion report
 ```
@@ -176,33 +176,48 @@ XHS Infographic Progress:
 ### Flow
 
 ```
-Input → Analyze → [Confirm 1] → 3 Outlines → [Confirm 2: Outline + Style] → Generate → Complete
+Input → Analyze → [Confirm 1] → 3 Outlines → [Confirm 2: Outline + Style + Elements] → Generate → Complete
 ```
 
-### Step 0: Check Preferences
+### Step 0: Load Preferences (EXTEND.md) ⚠️
 
-**Check paths** (priority order):
+**Purpose**: Load user preferences or run first-time setup. **Do NOT skip setup if EXTEND.md not found.**
-1. `.baoyu-skills/baoyu-xhs-images/EXTEND.md` (project)
-2. `~/.baoyu-skills/baoyu-xhs-images/EXTEND.md` (user)
 
-**If preferences found**:
+Use Bash to check EXTEND.md existence (priority order):
-1. Parse YAML frontmatter
-2. Display current preferences summary:
-   ```
-   Loaded preferences from [path]:
-   - Watermark: [enabled/disabled] "[content]" at [position]
-   - Style: [name] - [description]
-   - Layout: [layout]
-   - Language: [lang]
-   ```
-3. Continue to Step 1
 
-**If NO preferences found**:
+```bash
-1. Ask user with AskUserQuestion (see `references/config/first-time-setup.md`)
+# Check project-level first
-2. Create EXTEND.md with user choices
+test -f .baoyu-skills/baoyu-xhs-images/EXTEND.md && echo "project"
-3. Continue to Step 1
 
-Schema reference: `references/config/preferences-schema.md`
+# Then user-level (cross-platform: $HOME works on macOS/Linux/WSL)
+test -f "$HOME/.baoyu-skills/baoyu-xhs-images/EXTEND.md" && echo "user"
+```
+
+┌────────────────────────────────────────────────────┬───────────────────┐
+│                        Path                        │     Location      │
+├────────────────────────────────────────────────────┼───────────────────┤
+│ .baoyu-skills/baoyu-xhs-images/EXTEND.md           │ Project directory │
+├────────────────────────────────────────────────────┼───────────────────┤
+│ $HOME/.baoyu-skills/baoyu-xhs-images/EXTEND.md     │ User home         │
+└────────────────────────────────────────────────────┴───────────────────┘
+
+┌───────────┬───────────────────────────────────────────────────────────────────────────┐
+│  Result   │                                  Action                                   │
+├───────────┼───────────────────────────────────────────────────────────────────────────┤
+│ Found     │ Read, parse, display summary → Continue to Step 1                         │
+├───────────┼───────────────────────────────────────────────────────────────────────────┤
+│ Not found │ ⚠️ MUST run first-time setup (see below) → Then continue to Step 1        │
+└───────────┴───────────────────────────────────────────────────────────────────────────┘
+
+**First-Time Setup** (when EXTEND.md not found):
+
+**Language**: Use user's input language or saved language preference.
+
+Use AskUserQuestion with ALL questions in ONE call. See `references/config/first-time-setup.md` for question details.
+
+**EXTEND.md Supports**: Watermark | Preferred style/layout | Custom style definitions | Language preference
+
+Schema: `references/config/preferences-schema.md`
 
 ### Step 1: Analyze Content → `analysis.md`
 
@@ -262,6 +277,11 @@ strategy: a  # a, b, or c
 name: Story-Driven
 style: warm  # recommended style for this strategy
 style_reason: "Warm tones enhance emotional storytelling and personal connection"
+elements:  # from style preset, can be customized in Step 4
+  background: solid-pastel
+  decorations: [clouds, stars-sparkles]
+  emphasis: star-burst
+  typography: highlight
 layout: balanced  # primary layout
 image_count: 5
 ---
@@ -289,15 +309,15 @@ image_count: 5
 
 Reference: `references/workflows/outline-template.md`
 
-### Step 4: Confirmation 2 - Outline & Style Selection ⚠️
+### Step 4: Confirmation 2 - Outline & Style & Elements Selection ⚠️
 
-**Purpose**: User chooses outline strategy AND confirms visual style. **Do NOT skip.**
+**Purpose**: User chooses outline strategy, confirms visual style, and customizes elements. **Do NOT skip.**
 
 **Display each strategy**:
 - Strategy name + page count + recommended style
 - Page-by-page summary (P1 → P2 → P3...)
 
-**Use AskUserQuestion** with two questions:
+**Use AskUserQuestion** with three questions:
 
 **Question 1: Outline Strategy**
 - Strategy A (Recommended if "authentic sharing")
@@ -310,11 +330,22 @@ Reference: `references/workflows/outline-template.md`
 - Or select from: cute / fresh / warm / bold / minimal / retro / pop / notion / chalkboard
 - Or type custom style description
 
+**Question 3: Visual Elements** (show after style selection)
+Display the selected style's default elements from preset, then ask:
+- Use style defaults (Recommended) - show preview: background, decorations, emphasis
+- Adjust background - options: solid-pastel / solid-saturated / gradient-linear / gradient-radial / paper-texture / grid
+- Adjust decorations - options: hearts / stars-sparkles / flowers / clouds / leaves / confetti
+- Type custom element preferences
+
 **After response**:
 - Single strategy → copy to `outline.md` with confirmed style
 - Combination → merge specified pages with confirmed style
 - Custom request → regenerate based on feedback
-- Update `outline.md` frontmatter with final style choice
+- Style defaults → use preset's Element Combination as-is
+- Background adjustment → update elements.background with user choice
+- Decorations adjustment → update elements.decorations with user choice
+- Custom elements → parse user's preferences into elements fields
+- Update `outline.md` frontmatter with final style and elements
 
 ### Step 5: Generate Images
 
@@ -428,10 +459,4 @@ Detailed templates in `references/` directory:
 
 ## Extension Support
 
-Custom configurations via EXTEND.md. Loaded in Step 0, overrides defaults.
+Custom configurations via EXTEND.md. See **Step 0** for paths and supported options.
-
-**Check paths** (priority): `.baoyu-skills/baoyu-xhs-images/EXTEND.md` (project) → `~/.baoyu-skills/baoyu-xhs-images/EXTEND.md` (user)
-
-**Supports**: Watermark | Preferred style/layout | Custom style definitions
-
-**References**: `config/preferences-schema.md` | `config/first-time-setup.md`

skills/baoyu-xhs-images/references/config/first-time-setup.md

@@ -31,7 +31,7 @@ No EXTEND.md found
 
 ## Questions
 
-**Language**: Use user's input language or preferred language for all questions. Do not always use English.
+**Language**: Use user's input language or saved language preference.
 
 Use single AskUserQuestion with multiple questions (AskUserQuestion auto-adds "Other" option):