mirror of
https://github.com/JimLiu/baoyu-skills.git
synced 2026-07-13 22:29:48 +08:00
feat(baoyu-image-cards): add image card series skill migrated from baoyu-xhs-images
Rename baoyu-xhs-images to baoyu-image-cards to decouple from Xiaohongshu platform. Deprecate baoyu-xhs-images with migration notice pointing to baoyu-image-cards.
This commit is contained in:
Jim Liu 宝玉
@@ -31,7 +31,7 @@
|
|||||||
"./skills/baoyu-slide-deck",
|
"./skills/baoyu-slide-deck",
|
||||||
"./skills/baoyu-translate",
|
"./skills/baoyu-translate",
|
||||||
"./skills/baoyu-url-to-markdown",
|
"./skills/baoyu-url-to-markdown",
|
||||||
"./skills/baoyu-xhs-images",
|
"./skills/baoyu-image-cards",
|
||||||
"./skills/baoyu-youtube-transcript"
|
"./skills/baoyu-youtube-transcript"
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -55,6 +55,7 @@ Priority: project `skills/` → `$HOME/.baoyu-skills/` → system-level.
|
|||||||
| Skill | Note |
|
| Skill | Note |
|
||||||
|-------|------|
|
|-------|------|
|
||||||
| `baoyu-image-gen` | Migrated to `baoyu-imagine`. Do NOT add to `.claude-plugin/marketplace.json`. Do NOT update README for this skill. |
|
| `baoyu-image-gen` | Migrated to `baoyu-imagine`. Do NOT add to `.claude-plugin/marketplace.json`. Do NOT update README for this skill. |
|
||||||
|
| `baoyu-xhs-images` | Migrated to `baoyu-image-cards`. Do NOT add to `.claude-plugin/marketplace.json`. Do NOT update README for this skill. |
|
||||||
|
|
||||||
## Release Process
|
## Release Process
|
||||||
|
|
||||||
|
|||||||
@@ -97,29 +97,29 @@ Skills are organized into three categories:
|
|||||||
|
|
||||||
Content generation and publishing skills.
|
Content generation and publishing skills.
|
||||||
|
|
||||||
#### baoyu-xhs-images
|
#### baoyu-image-cards
|
||||||
|
|
||||||
Xiaohongshu (RedNote) infographic series generator. Breaks down content into 1-10 cartoon-style infographics with **Style × Layout** two-dimensional system.
|
Image card series generator. Breaks down content into 1-10 cartoon-style image cards with **Style × Layout** two-dimensional system.
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# Auto-select style and layout
|
# Auto-select style and layout
|
||||||
/baoyu-xhs-images posts/ai-future/article.md
|
/baoyu-image-cards posts/ai-future/article.md
|
||||||
|
|
||||||
# Specify style
|
# Specify style
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --style notion
|
/baoyu-image-cards posts/ai-future/article.md --style notion
|
||||||
|
|
||||||
# Specify layout
|
# Specify layout
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --layout dense
|
/baoyu-image-cards posts/ai-future/article.md --layout dense
|
||||||
|
|
||||||
# Combine style and layout
|
# Combine style and layout
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --style tech --layout list
|
/baoyu-image-cards posts/ai-future/article.md --style notion --layout list
|
||||||
|
|
||||||
# Direct content input
|
# Direct content input
|
||||||
/baoyu-xhs-images 今日星座运势
|
/baoyu-image-cards 今日星座运势
|
||||||
|
|
||||||
# Non-interactive (skip all confirmations, for scheduled tasks)
|
# Non-interactive (skip all confirmations, for scheduled tasks)
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --yes
|
/baoyu-image-cards posts/ai-future/article.md --yes
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --yes --preset knowledge-card
|
/baoyu-image-cards posts/ai-future/article.md --yes --preset knowledge-card
|
||||||
```
|
```
|
||||||
|
|
||||||
**Styles** (visual aesthetics): `cute` (default), `fresh`, `warm`, `bold`, `minimal`, `retro`, `pop`, `notion`, `chalkboard`
|
**Styles** (visual aesthetics): `cute` (default), `fresh`, `warm`, `bold`, `minimal`, `retro`, `pop`, `notion`, `chalkboard`
|
||||||
|
|||||||
+9
-9
@@ -97,29 +97,29 @@ clawhub install baoyu-markdown-to-html
|
|||||||
|
|
||||||
内容生成和发布技能。
|
内容生成和发布技能。
|
||||||
|
|
||||||
#### baoyu-xhs-images
|
#### baoyu-image-cards
|
||||||
|
|
||||||
小红书信息图系列生成器。将内容拆解为 1-10 张卡通风格信息图，支持 **风格 × 布局** 二维系统。
|
图片卡片系列生成器。将内容拆解为 1-10 张卡通风格图片卡片，支持 **风格 × 布局** 二维系统。
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# 自动选择风格和布局
|
# 自动选择风格和布局
|
||||||
/baoyu-xhs-images posts/ai-future/article.md
|
/baoyu-image-cards posts/ai-future/article.md
|
||||||
|
|
||||||
# 指定风格
|
# 指定风格
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --style notion
|
/baoyu-image-cards posts/ai-future/article.md --style notion
|
||||||
|
|
||||||
# 指定布局
|
# 指定布局
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --layout dense
|
/baoyu-image-cards posts/ai-future/article.md --layout dense
|
||||||
|
|
||||||
# 组合风格和布局
|
# 组合风格和布局
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --style tech --layout list
|
/baoyu-image-cards posts/ai-future/article.md --style notion --layout list
|
||||||
|
|
||||||
# 直接输入内容
|
# 直接输入内容
|
||||||
/baoyu-xhs-images 今日星座运势
|
/baoyu-image-cards 今日星座运势
|
||||||
|
|
||||||
# 非交互模式（跳过所有确认，适用于定时任务）
|
# 非交互模式（跳过所有确认，适用于定时任务）
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --yes
|
/baoyu-image-cards posts/ai-future/article.md --yes
|
||||||
/baoyu-xhs-images posts/ai-future/article.md --yes --preset knowledge-card
|
/baoyu-image-cards posts/ai-future/article.md --yes --preset knowledge-card
|
||||||
```
|
```
|
||||||
|
|
||||||
**风格**（视觉美学）：`cute`（默认）、`fresh`、`warm`、`bold`、`minimal`、`retro`、`pop`、`notion`、`chalkboard`
|
**风格**（视觉美学）：`cute`（默认）、`fresh`、`warm`、`bold`、`minimal`、`retro`、`pop`、`notion`、`chalkboard`
|
||||||
|
|||||||
@@ -0,0 +1,603 @@
|
|||||||
|
---
|
||||||
|
name: baoyu-image-cards
|
||||||
|
description: Generates infographic image card series with 11 visual styles and 8 layouts. Breaks content into 1-10 cartoon-style image cards optimized for social media engagement. Use when user mentions "小红书图片", "小红书种草", "小绿书", "微信图文", "微信贴图", "image cards", "图片卡片", or wants social media infographic series.
|
||||||
|
version: 1.56.1
|
||||||
|
metadata:
|
||||||
|
openclaw:
|
||||||
|
homepage: https://github.com/JimLiu/baoyu-skills#baoyu-image-cards
|
||||||
|
---
|
||||||
|
|
||||||
|
# Image Card Series Generator
|
||||||
|
|
||||||
|
Break down complex content into eye-catching image card series with multiple style options.
|
||||||
|
|
||||||
|
## Usage
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Auto-select style and layout based on content
|
||||||
|
/baoyu-image-cards posts/ai-future/article.md
|
||||||
|
|
||||||
|
# Specify style
|
||||||
|
/baoyu-image-cards posts/ai-future/article.md --style notion
|
||||||
|
|
||||||
|
# Specify layout
|
||||||
|
/baoyu-image-cards posts/ai-future/article.md --layout dense
|
||||||
|
|
||||||
|
# Combine style and layout
|
||||||
|
/baoyu-image-cards posts/ai-future/article.md --style notion --layout list
|
||||||
|
|
||||||
|
# Use preset (style + layout shorthand)
|
||||||
|
/baoyu-image-cards posts/ai-future/article.md --preset knowledge-card
|
||||||
|
|
||||||
|
# Preset with override
|
||||||
|
/baoyu-image-cards posts/ai-future/article.md --preset poster --layout quadrant
|
||||||
|
|
||||||
|
# Direct content input
|
||||||
|
/baoyu-image-cards
|
||||||
|
[paste content]
|
||||||
|
|
||||||
|
# Direct input with options
|
||||||
|
/baoyu-image-cards --style bold --layout comparison
|
||||||
|
[paste content]
|
||||||
|
|
||||||
|
# Non-interactive (for scheduled tasks / automation)
|
||||||
|
/baoyu-image-cards posts/ai-future/article.md --yes
|
||||||
|
/baoyu-image-cards posts/ai-future/article.md --yes --preset knowledge-card
|
||||||
|
```
|
||||||
|
|
||||||
|
## Options
|
||||||
|
|
||||||
|
| Option | Description |
|
||||||
|
|--------|-------------|
|
||||||
|
| `--style <name>` | Visual style (see Style Gallery) |
|
||||||
|
| `--layout <name>` | Information layout (see Layout Gallery) |
|
||||||
|
| `--preset <name>` | Style + layout shorthand (see [Style Presets](references/style-presets.md)) |
|
||||||
|
| `--yes` | Non-interactive mode: skip all confirmations. Uses EXTEND.md preferences if found, otherwise uses defaults (no watermark, auto style/layout). Auto-confirms recommended plan (Path A). Suitable for scheduled tasks and automation. |
|
||||||
|
|
||||||
|
## Two Dimensions
|
||||||
|
|
||||||
|
| Dimension | Controls | Options |
|
||||||
|
|-----------|----------|---------|
|
||||||
|
| **Style** | Visual aesthetics: colors, lines, decorations | cute, fresh, warm, bold, minimal, retro, pop, notion, chalkboard, study-notes, screen-print |
|
||||||
|
| **Layout** | Information structure: density, arrangement | sparse, balanced, dense, list, comparison, flow, mindmap, quadrant |
|
||||||
|
|
||||||
|
Style × Layout can be freely combined. Example: `--style notion --layout dense` creates an intellectual-looking knowledge card with high information density.
|
||||||
|
|
||||||
|
Or use presets: `--preset knowledge-card` → style + layout in one flag. See [Style Presets](references/style-presets.md).
|
||||||
|
|
||||||
|
## Style Gallery
|
||||||
|
|
||||||
|
| Style | Description |
|
||||||
|
|-------|-------------|
|
||||||
|
| `cute` (Default) | Sweet, adorable, girly aesthetic |
|
||||||
|
| `fresh` | Clean, refreshing, natural |
|
||||||
|
| `warm` | Cozy, friendly, approachable |
|
||||||
|
| `bold` | High impact, attention-grabbing |
|
||||||
|
| `minimal` | Ultra-clean, sophisticated |
|
||||||
|
| `retro` | Vintage, nostalgic, trendy |
|
||||||
|
| `pop` | Vibrant, energetic, eye-catching |
|
||||||
|
| `notion` | Minimalist hand-drawn line art, intellectual |
|
||||||
|
| `chalkboard` | Colorful chalk on black board, educational |
|
||||||
|
| `study-notes` | Realistic handwritten photo style, blue pen + red annotations + yellow highlighter |
|
||||||
|
| `screen-print` | Bold poster art, halftone textures, limited colors, symbolic storytelling |
|
||||||
|
|
||||||
|
Detailed style definitions: `references/presets/<style>.md`
|
||||||
|
|
||||||
|
## Preset Gallery
|
||||||
|
|
||||||
|
Quick-start presets by content scenario. Use `--preset <name>` or recommend during Step 2.
|
||||||
|
|
||||||
|
**Knowledge & Learning**:
|
||||||
|
|
||||||
|
| Preset | Style | Layout | Best For |
|
||||||
|
|--------|-------|--------|----------|
|
||||||
|
| `knowledge-card` | notion | dense | 干货知识卡、概念科普 |
|
||||||
|
| `checklist` | notion | list | 清单、排行榜、必备清单 |
|
||||||
|
| `concept-map` | notion | mindmap | 概念图、知识脉络 |
|
||||||
|
| `swot` | notion | quadrant | SWOT分析、四象限分类 |
|
||||||
|
| `tutorial` | chalkboard | flow | 教程步骤、操作流程 |
|
||||||
|
| `classroom` | chalkboard | balanced | 课堂笔记、知识讲解 |
|
||||||
|
| `study-guide` | study-notes | dense | 学习笔记、考试重点 |
|
||||||
|
|
||||||
|
**Lifestyle & Sharing**:
|
||||||
|
|
||||||
|
| Preset | Style | Layout | Best For |
|
||||||
|
|--------|-------|--------|----------|
|
||||||
|
| `cute-share` | cute | balanced | 少女风分享、日常种草 |
|
||||||
|
| `girly` | cute | sparse | 甜美封面、氛围感 |
|
||||||
|
| `cozy-story` | warm | balanced | 生活故事、情感分享 |
|
||||||
|
| `product-review` | fresh | comparison | 产品对比、测评 |
|
||||||
|
| `nature-flow` | fresh | flow | 健康流程、自然主题 |
|
||||||
|
|
||||||
|
**Impact & Opinion**:
|
||||||
|
|
||||||
|
| Preset | Style | Layout | Best For |
|
||||||
|
|--------|-------|--------|----------|
|
||||||
|
| `warning` | bold | list | 避坑指南、重要提醒 |
|
||||||
|
| `versus` | bold | comparison | 正反对比、强烈对照 |
|
||||||
|
| `clean-quote` | minimal | sparse | 金句、极简封面 |
|
||||||
|
| `pro-summary` | minimal | balanced | 专业总结、商务内容 |
|
||||||
|
|
||||||
|
**Trend & Entertainment**:
|
||||||
|
|
||||||
|
| Preset | Style | Layout | Best For |
|
||||||
|
|--------|-------|--------|----------|
|
||||||
|
| `retro-ranking` | retro | list | 复古排行、经典盘点 |
|
||||||
|
| `throwback` | retro | balanced | 怀旧分享、老物件 |
|
||||||
|
| `pop-facts` | pop | list | 趣味冷知识、好玩的事 |
|
||||||
|
| `hype` | pop | sparse | 炸裂封面、惊叹分享 |
|
||||||
|
|
||||||
|
**Poster & Editorial**:
|
||||||
|
|
||||||
|
| Preset | Style | Layout | Best For |
|
||||||
|
|--------|-------|--------|----------|
|
||||||
|
| `poster` | screen-print | sparse | 海报风封面、影评书评 |
|
||||||
|
| `editorial` | screen-print | balanced | 观点文章、文化评论 |
|
||||||
|
| `cinematic` | screen-print | comparison | 电影对比、戏剧张力 |
|
||||||
|
|
||||||
|
Full preset definitions: [references/style-presets.md](references/style-presets.md)
|
||||||
|
|
||||||
|
## Layout Gallery
|
||||||
|
|
||||||
|
| Layout | Description |
|
||||||
|
|--------|-------------|
|
||||||
|
| `sparse` (Default) | Minimal information, maximum impact (1-2 points) |
|
||||||
|
| `balanced` | Standard content layout (3-4 points) |
|
||||||
|
| `dense` | High information density, knowledge card style (5-8 points) |
|
||||||
|
| `list` | Enumeration and ranking format (4-7 items) |
|
||||||
|
| `comparison` | Side-by-side contrast layout |
|
||||||
|
| `flow` | Process and timeline layout (3-6 steps) |
|
||||||
|
| `mindmap` | Center radial mind map layout (4-8 branches) |
|
||||||
|
| `quadrant` | Four-quadrant / circular section layout |
|
||||||
|
|
||||||
|
Detailed layout definitions: `references/elements/canvas.md`
|
||||||
|
|
||||||
|
## Auto Selection
|
||||||
|
|
||||||
|
| Content Signals | Style | Layout | Recommended Preset |
|
||||||
|
|-----------------|-------|--------|--------------------|
|
||||||
|
| Beauty, fashion, cute, girl, pink | `cute` | sparse/balanced | `cute-share`, `girly` |
|
||||||
|
| Health, nature, clean, fresh, organic | `fresh` | balanced/flow | `product-review`, `nature-flow` |
|
||||||
|
| Life, story, emotion, feeling, warm | `warm` | balanced | `cozy-story` |
|
||||||
|
| Warning, important, must, critical | `bold` | list/comparison | `warning`, `versus` |
|
||||||
|
| Professional, business, elegant, simple | `minimal` | sparse/balanced | `clean-quote`, `pro-summary` |
|
||||||
|
| Classic, vintage, old, traditional | `retro` | balanced | `throwback`, `retro-ranking` |
|
||||||
|
| Fun, exciting, wow, amazing | `pop` | sparse/list | `hype`, `pop-facts` |
|
||||||
|
| Knowledge, concept, productivity, SaaS | `notion` | dense/list | `knowledge-card`, `checklist` |
|
||||||
|
| Education, tutorial, learning, teaching, classroom | `chalkboard` | balanced/dense | `tutorial`, `classroom` |
|
||||||
|
| Notes, handwritten, study guide, knowledge, realistic, photo | `study-notes` | dense/list/mindmap | `study-guide` |
|
||||||
|
| Movie, album, concert, poster, opinion, editorial, dramatic, cinematic | `screen-print` | sparse/comparison | `poster`, `editorial`, `cinematic` |
|
||||||
|
|
||||||
|
## Outline Strategies
|
||||||
|
|
||||||
|
Three differentiated outline strategies for different content goals:
|
||||||
|
|
||||||
|
### Strategy A: Story-Driven (故事驱动型)
|
||||||
|
|
||||||
|
| Aspect | Description |
|
||||||
|
|--------|-------------|
|
||||||
|
| **Concept** | Personal experience as main thread, emotional resonance first |
|
||||||
|
| **Features** | Start from pain point, show before/after change, strong authenticity |
|
||||||
|
| **Best for** | Reviews, personal shares, transformation stories |
|
||||||
|
| **Structure** | Hook → Problem → Discovery → Experience → Conclusion |
|
||||||
|
|
||||||
|
### Strategy B: Information-Dense (信息密集型)
|
||||||
|
|
||||||
|
| Aspect | Description |
|
||||||
|
|--------|-------------|
|
||||||
|
| **Concept** | Value-first, efficient information delivery |
|
||||||
|
| **Features** | Clear structure, explicit points, professional credibility |
|
||||||
|
| **Best for** | Tutorials, comparisons, product reviews, checklists |
|
||||||
|
| **Structure** | Core conclusion → Info card → Pros/Cons → Recommendation |
|
||||||
|
|
||||||
|
### Strategy C: Visual-First (视觉优先型)
|
||||||
|
|
||||||
|
| Aspect | Description |
|
||||||
|
|--------|-------------|
|
||||||
|
| **Concept** | Visual impact as core, minimal text |
|
||||||
|
| **Features** | Large images, atmospheric, instant appeal |
|
||||||
|
| **Best for** | High-aesthetic products, lifestyle, mood-based content |
|
||||||
|
| **Structure** | Hero image → Detail shots → Lifestyle scene → CTA |
|
||||||
|
|
||||||
|
## File Structure
|
||||||
|
|
||||||
|
Each session creates an independent directory named by content slug:
|
||||||
|
|
||||||
|
```
|
||||||
|
image-cards/{topic-slug}/
|
||||||
|
├── source-{slug}.{ext} # Source files (text, images, etc.)
|
||||||
|
├── analysis.md # Deep analysis + questions asked
|
||||||
|
├── outline-strategy-a.md # Strategy A: Story-driven
|
||||||
|
├── outline-strategy-b.md # Strategy B: Information-dense
|
||||||
|
├── outline-strategy-c.md # Strategy C: Visual-first
|
||||||
|
├── outline.md # Final selected/merged outline
|
||||||
|
├── prompts/
|
||||||
|
│ ├── 01-cover-[slug].md
|
||||||
|
│ ├── 02-content-[slug].md
|
||||||
|
│ └── ...
|
||||||
|
├── 01-cover-[slug].png
|
||||||
|
├── 02-content-[slug].png
|
||||||
|
└── NN-ending-[slug].png
|
||||||
|
```
|
||||||
|
|
||||||
|
**Slug Generation**:
|
||||||
|
1. Extract main topic from content (2-4 words, kebab-case)
|
||||||
|
2. Example: "AI工具推荐" → `ai-tools-recommend`
|
||||||
|
|
||||||
|
**Conflict Resolution**:
|
||||||
|
If `image-cards/{topic-slug}/` already exists:
|
||||||
|
- Append timestamp: `{topic-slug}-YYYYMMDD-HHMMSS`
|
||||||
|
- Example: `ai-tools` exists → `ai-tools-20260118-143052`
|
||||||
|
|
||||||
|
**Source Files**:
|
||||||
|
Copy all sources with naming `source-{slug}.{ext}`:
|
||||||
|
- `source-article.md`, `source-photo.jpg`, etc.
|
||||||
|
- Multiple sources supported: text, images, files from conversation
|
||||||
|
|
||||||
|
## Workflow
|
||||||
|
|
||||||
|
### Progress Checklist
|
||||||
|
|
||||||
|
Copy and track progress:
|
||||||
|
|
||||||
|
```
|
||||||
|
Image Card Series Progress:
|
||||||
|
- [ ] Step 0: Check preferences (EXTEND.md) ⛔ BLOCKING (--yes: use defaults if not found)
|
||||||
|
- [ ] Found → load preferences → continue
|
||||||
|
- [ ] Not found → run first-time setup → MUST complete before Step 1 (--yes: skip setup, use defaults)
|
||||||
|
- [ ] Step 1: Analyze content → analysis.md
|
||||||
|
- [ ] Step 2: Smart Confirm ⚠️ REQUIRED (--yes: auto-confirm Path A)
|
||||||
|
- [ ] Path A: Quick confirm → generate recommended outline
|
||||||
|
- [ ] Path B: Customize → adjust then generate outline
|
||||||
|
- [ ] Path C: Detailed → 3 outlines → second confirm → generate outline
|
||||||
|
- [ ] Step 3: Generate images (sequential)
|
||||||
|
- [ ] Step 4: Completion report
|
||||||
|
```
|
||||||
|
|
||||||
|
### Flow
|
||||||
|
|
||||||
|
```
|
||||||
|
Input → [--yes?] ─┬─ Yes → [Step 0: Load or defaults] → Analyze → Auto-confirm → Generate → Complete
|
||||||
|
│
|
||||||
|
└─ No → [Step 0: Preferences] ─┬─ Found → Continue
|
||||||
|
│
|
||||||
|
└─ Not found → First-Time Setup ⛔ BLOCKING
|
||||||
|
│
|
||||||
|
└─ Complete setup → Save EXTEND.md → Continue
|
||||||
|
│
|
||||||
|
┌─────────────────────────────────────────────────────────────────────────────────────┘
|
||||||
|
↓
|
||||||
|
Analyze → [Smart Confirm] ─┬─ Quick: confirm recommended → outline.md → Generate → Complete
|
||||||
|
│
|
||||||
|
├─ Customize: adjust options → outline.md → Generate → Complete
|
||||||
|
│
|
||||||
|
└─ Detailed: 3 outlines → [Confirm 2] → outline.md → Generate → Complete
|
||||||
|
```
|
||||||
|
|
||||||
|
### Step 0: Load Preferences (EXTEND.md) ⛔ BLOCKING
|
||||||
|
|
||||||
|
**Purpose**: Load user preferences or run first-time setup.
|
||||||
|
|
||||||
|
**`--yes` mode**: If EXTEND.md found → load it. If not found → use built-in defaults (no watermark, style/layout auto-select, language from content). Do NOT run first-time setup, do NOT create EXTEND.md, do NOT ask any questions. Proceed directly to Step 1.
|
||||||
|
|
||||||
|
**CRITICAL** (interactive mode only): 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 style, do NOT ask about layout — ONLY complete the preferences setup first.
|
||||||
|
|
||||||
|
Check EXTEND.md existence (priority order):
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# macOS, Linux, WSL, Git Bash
|
||||||
|
test -f .baoyu-skills/baoyu-image-cards/EXTEND.md && echo "project"
|
||||||
|
test -f "${XDG_CONFIG_HOME:-$HOME/.config}/baoyu-skills/baoyu-image-cards/EXTEND.md" && echo "xdg"
|
||||||
|
test -f "$HOME/.baoyu-skills/baoyu-image-cards/EXTEND.md" && echo "user"
|
||||||
|
```
|
||||||
|
|
||||||
|
```powershell
|
||||||
|
# PowerShell (Windows)
|
||||||
|
if (Test-Path .baoyu-skills/baoyu-image-cards/EXTEND.md) { "project" }
|
||||||
|
$xdg = if ($env:XDG_CONFIG_HOME) { $env:XDG_CONFIG_HOME } else { "$HOME/.config" }
|
||||||
|
if (Test-Path "$xdg/baoyu-skills/baoyu-image-cards/EXTEND.md") { "xdg" }
|
||||||
|
if (Test-Path "$HOME/.baoyu-skills/baoyu-image-cards/EXTEND.md") { "user" }
|
||||||
|
```
|
||||||
|
|
||||||
|
┌────────────────────────────────────────────────────┬───────────────────┐
|
||||||
|
│ Path │ Location │
|
||||||
|
├────────────────────────────────────────────────────┼───────────────────┤
|
||||||
|
│ .baoyu-skills/baoyu-image-cards/EXTEND.md │ Project directory │
|
||||||
|
├────────────────────────────────────────────────────┼───────────────────┤
|
||||||
|
│ $HOME/.baoyu-skills/baoyu-image-cards/EXTEND.md │ User home │
|
||||||
|
└────────────────────────────────────────────────────┴───────────────────┘
|
||||||
|
|
||||||
|
┌───────────┬─────────────────────────────────────────────────────────────────────────────────────────────────────┐
|
||||||
|
│ Result │ Action │
|
||||||
|
├───────────┼─────────────────────────────────────────────────────────────────────────────────────────────────────┤
|
||||||
|
│ Found │ Read, parse, display summary → Continue to Step 1 │
|
||||||
|
├───────────┼─────────────────────────────────────────────────────────────────────────────────────────────────────┤
|
||||||
|
│ Not found │ ⛔ BLOCKING: Run first-time setup ONLY (see below) → Complete and save EXTEND.md → Then 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`
|
||||||
|
|
||||||
|
Read source content, save it if needed, and perform deep 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
|
||||||
|
- **Backup rule**: If `source.md` exists, rename to `source-backup-YYYYMMDD-HHMMSS.md`
|
||||||
|
2. Read source content
|
||||||
|
3. **Deep analysis** following `references/workflows/analysis-framework.md`:
|
||||||
|
- Content type classification (种草/干货/测评/教程/避坑...)
|
||||||
|
- Hook analysis (爆款标题潜力)
|
||||||
|
- Target audience identification
|
||||||
|
- Engagement potential (收藏/分享/评论)
|
||||||
|
- Visual opportunity mapping
|
||||||
|
- Swipe flow design
|
||||||
|
4. Detect source language
|
||||||
|
5. Determine recommended image count (2-10)
|
||||||
|
6. **Auto-recommend** best strategy + style + layout based on content signals
|
||||||
|
7. **Save to `analysis.md`**
|
||||||
|
|
||||||
|
### Step 2: Smart Confirm ⚠️
|
||||||
|
|
||||||
|
**Purpose**: Present auto-recommended plan, let user confirm or adjust.
|
||||||
|
|
||||||
|
**`--yes` mode**: Skip this entire step. Use auto-recommended strategy + style + layout from Step 1 analysis (or `--style`/`--layout`/`--preset` if provided). Generate outline directly using Path A logic → save to `outline.md` → proceed to Step 3. No AskUserQuestion calls.
|
||||||
|
|
||||||
|
**Interactive mode**: Do NOT skip.
|
||||||
|
|
||||||
|
**Auto-Recommendation Logic**:
|
||||||
|
1. Use Auto Selection table to match content signals → best strategy + style + layout
|
||||||
|
2. Infer optimal image count from content density
|
||||||
|
3. Load style's default elements from preset
|
||||||
|
|
||||||
|
**Display** (analysis summary + recommended plan):
|
||||||
|
|
||||||
|
```
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
📋 内容分析
|
||||||
|
主题：[topic] | 类型：[content_type]
|
||||||
|
要点：[key points summary]
|
||||||
|
受众：[target audience]
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
🎨 推荐方案（自动匹配）
|
||||||
|
策略：[A/B/C] [strategy name]（[reason]）
|
||||||
|
风格：[style] · 布局：[layout] · 预设：[preset]
|
||||||
|
图片：[N]张（封面+[N-2]内容+结尾）
|
||||||
|
元素：[background] / [decorations] / [emphasis]
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
```
|
||||||
|
|
||||||
|
**Use AskUserQuestion** with single question:
|
||||||
|
|
||||||
|
| Option | Description |
|
||||||
|
|--------|-------------|
|
||||||
|
| 1. ✅ 确认，直接生成（推荐） | Trust auto-recommendation, proceed immediately |
|
||||||
|
| 2. 🎛️ 自定义调整 | Modify strategy/style/layout/count in one step |
|
||||||
|
| 3. 📋 详细模式 | Generate 3 outlines, then choose (two confirmations) |
|
||||||
|
|
||||||
|
#### Path A: Quick Confirm (Option 1)
|
||||||
|
|
||||||
|
Generate single outline using recommended strategy + style → save to `outline.md` → Step 3.
|
||||||
|
|
||||||
|
#### Path B: Customize (Option 2)
|
||||||
|
|
||||||
|
**Use AskUserQuestion** with adjustable options (leave blank = keep recommended):
|
||||||
|
|
||||||
|
1. **策略风格**: Current: [strategy + style]. Options: A Story-Driven(warm) | B Information-Dense(notion) | C Visual-First(screen-print). Or specify style directly: cute/fresh/warm/bold/minimal/retro/pop/notion/chalkboard/study-notes/screen-print. Or use preset: knowledge-card / checklist / tutorial / poster / cinematic / etc.
|
||||||
|
2. **布局**: Current: [layout]. Options: sparse | balanced | dense | list | comparison | flow | mindmap | quadrant
|
||||||
|
3. **图片数量**: Current: [N]. Range: 2-10
|
||||||
|
4. **补充说明**（可选）: Selling point emphasis, audience adjustment, color preference, etc.
|
||||||
|
|
||||||
|
**After response**: Generate single outline with user's choices → save to `outline.md` → Step 3.
|
||||||
|
|
||||||
|
#### Path C: Detailed Mode (Option 3)
|
||||||
|
|
||||||
|
Full two-confirmation flow for maximum control:
|
||||||
|
|
||||||
|
**Step 2a: Content Understanding**
|
||||||
|
|
||||||
|
**Use AskUserQuestion** for:
|
||||||
|
1. Core selling point (multiSelect: true)
|
||||||
|
2. Target audience
|
||||||
|
3. Style preference: Authentic sharing / Professional review / Aesthetic mood / Auto
|
||||||
|
4. Additional context (optional)
|
||||||
|
|
||||||
|
**After response**: Update `analysis.md`.
|
||||||
|
|
||||||
|
**Step 2b: Generate 3 Outline Variants**
|
||||||
|
|
||||||
|
| Strategy | Filename | Outline | Recommended Style |
|
||||||
|
|----------|----------|---------|-------------------|
|
||||||
|
| A | `outline-strategy-a.md` | Story-driven: emotional, before/after | warm, cute, fresh |
|
||||||
|
| B | `outline-strategy-b.md` | Information-dense: structured, factual | notion, minimal, chalkboard |
|
||||||
|
| C | `outline-strategy-c.md` | Visual-first: atmospheric, minimal text | bold, pop, retro, screen-print |
|
||||||
|
|
||||||
|
**Outline format** (YAML front matter + content):
|
||||||
|
```yaml
|
||||||
|
---
|
||||||
|
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
|
||||||
|
background: solid-pastel
|
||||||
|
decorations: [clouds, stars-sparkles]
|
||||||
|
emphasis: star-burst
|
||||||
|
typography: highlight
|
||||||
|
layout: balanced # primary layout
|
||||||
|
image_count: 5
|
||||||
|
---
|
||||||
|
|
||||||
|
## P1 Cover
|
||||||
|
**Type**: cover
|
||||||
|
**Hook**: "入冬后脸不干了🥹终于找到对的面霜"
|
||||||
|
**Visual**: Product hero shot with cozy winter atmosphere
|
||||||
|
**Layout**: sparse
|
||||||
|
|
||||||
|
## P2 Problem
|
||||||
|
**Type**: pain-point
|
||||||
|
**Message**: Previous struggles with dry skin
|
||||||
|
**Visual**: Before state, relatable scenario
|
||||||
|
**Layout**: balanced
|
||||||
|
|
||||||
|
...
|
||||||
|
```
|
||||||
|
|
||||||
|
**Differentiation requirements**:
|
||||||
|
- Each strategy MUST have different outline structure AND different recommended style
|
||||||
|
- Adapt page count: A typically 4-6, B typically 3-5, C typically 3-4
|
||||||
|
- Include `style_reason` explaining why this style fits the strategy
|
||||||
|
|
||||||
|
Reference: `references/workflows/outline-template.md`
|
||||||
|
|
||||||
|
**Step 2c: Outline & Style Selection**
|
||||||
|
|
||||||
|
**Use AskUserQuestion** with three questions:
|
||||||
|
|
||||||
|
**Q1: Outline Strategy**: A / B / C / Combine (specify pages from each)
|
||||||
|
|
||||||
|
**Q2: Visual Style**: Use recommended | Select preset | Select style | Custom description
|
||||||
|
|
||||||
|
**Q3: Visual Elements**: Use defaults (Recommended) | Adjust background | Adjust decorations | Custom
|
||||||
|
|
||||||
|
**After response**: Save selected/merged outline to `outline.md` with confirmed style and elements → Step 3.
|
||||||
|
|
||||||
|
### Step 3: Generate Images
|
||||||
|
|
||||||
|
With confirmed outline + style + layout:
|
||||||
|
|
||||||
|
**Visual Consistency — Reference Image Chain**:
|
||||||
|
To ensure character/style consistency across all images in a series:
|
||||||
|
1. **Generate image 1 (cover) FIRST** — without `--ref`
|
||||||
|
2. **Use image 1 as `--ref` for ALL remaining images** (2, 3, ..., N)
|
||||||
|
- This anchors the character design, color rendering, and illustration style
|
||||||
|
- Command pattern: `--ref <path-to-image-01.png>` added to every subsequent generation
|
||||||
|
|
||||||
|
This is critical for styles that use recurring characters, mascots, or illustration elements. Image 1 becomes the visual anchor for the entire series.
|
||||||
|
|
||||||
|
**For each image (cover + content + ending)**:
|
||||||
|
1. Save prompt to `prompts/NN-{type}-[slug].md` (in user's preferred language)
|
||||||
|
- **Backup rule**: If prompt file exists, rename to `prompts/NN-{type}-[slug]-backup-YYYYMMDD-HHMMSS.md`
|
||||||
|
2. Generate image:
|
||||||
|
- **Image 1**: Generate without `--ref` (this establishes the visual anchor)
|
||||||
|
- **Images 2+**: Generate with `--ref <image-01-path>` for consistency
|
||||||
|
- **Backup rule**: If image file exists, rename to `NN-{type}-[slug]-backup-YYYYMMDD-HHMMSS.png`
|
||||||
|
3. Report progress after each generation
|
||||||
|
|
||||||
|
**Watermark Application** (if enabled in preferences):
|
||||||
|
Add to each image generation prompt:
|
||||||
|
```
|
||||||
|
Include a subtle watermark "[content]" positioned at [position].
|
||||||
|
The watermark should be legible but not distracting from the main content.
|
||||||
|
```
|
||||||
|
Reference: `references/config/watermark-guide.md`
|
||||||
|
|
||||||
|
**Image Generation Skill Selection**:
|
||||||
|
- Check available image generation skills
|
||||||
|
- If multiple skills available: ask user preference (interactive) or use first available skill (`--yes` mode)
|
||||||
|
|
||||||
|
**Session Management**:
|
||||||
|
If image generation skill supports `--sessionId`:
|
||||||
|
1. Generate unique session ID: `cards-{topic-slug}-{timestamp}`
|
||||||
|
2. Use same session ID for all images
|
||||||
|
3. Combined with reference image chain, ensures maximum visual consistency
|
||||||
|
|
||||||
|
### Step 4: Completion Report
|
||||||
|
|
||||||
|
```
|
||||||
|
Image Card Series Complete!
|
||||||
|
|
||||||
|
Topic: [topic]
|
||||||
|
Mode: [Quick / Custom / Detailed]
|
||||||
|
Strategy: [A/B/C/Combined]
|
||||||
|
Style: [style name]
|
||||||
|
Layout: [layout name or "varies"]
|
||||||
|
Location: [directory path]
|
||||||
|
Images: N total
|
||||||
|
|
||||||
|
✓ analysis.md
|
||||||
|
✓ outline.md
|
||||||
|
✓ outline-strategy-a/b/c.md (detailed mode only)
|
||||||
|
|
||||||
|
Files:
|
||||||
|
- 01-cover-[slug].png ✓ Cover (sparse)
|
||||||
|
- 02-content-[slug].png ✓ Content (balanced)
|
||||||
|
- 03-content-[slug].png ✓ Content (dense)
|
||||||
|
- 04-ending-[slug].png ✓ Ending (sparse)
|
||||||
|
```
|
||||||
|
|
||||||
|
## Image Modification
|
||||||
|
|
||||||
|
| Action | Steps |
|
||||||
|
|--------|-------|
|
||||||
|
| **Edit** | **Update prompt file FIRST** → Regenerate with same session ID |
|
||||||
|
| **Add** | Specify position → Create prompt → Generate → Renumber subsequent files (NN+1) → Update outline |
|
||||||
|
| **Delete** | Remove files → Renumber subsequent (NN-1) → Update outline |
|
||||||
|
|
||||||
|
**IMPORTANT**: When updating images, ALWAYS update the prompt file (`prompts/NN-{type}-[slug].md`) FIRST before regenerating. This ensures changes are documented and reproducible.
|
||||||
|
|
||||||
|
## Content Breakdown Principles
|
||||||
|
|
||||||
|
1. **Cover (Image 1)**: Hook + visual impact → `sparse` layout
|
||||||
|
2. **Content (Middle)**: Core value per image → `balanced`/`dense`/`list`/`comparison`/`flow`
|
||||||
|
3. **Ending (Last)**: CTA / summary → `sparse` or `balanced`
|
||||||
|
|
||||||
|
**Style × Layout Matrix** (✓✓ = highly recommended, ✓ = works well):
|
||||||
|
|
||||||
|
| | sparse | balanced | dense | list | comparison | flow | mindmap | quadrant |
|
||||||
|
|---|:---:|:---:|:---:|:---:|:---:|:---:|:---:|:---:|
|
||||||
|
| cute | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✓ | ✓ | ✓ |
|
||||||
|
| fresh | ✓✓ | ✓✓ | ✓ | ✓ | ✓ | ✓✓ | ✓ | ✓ |
|
||||||
|
| warm | ✓✓ | ✓✓ | ✓ | ✓ | ✓✓ | ✓ | ✓ | ✓ |
|
||||||
|
| bold | ✓✓ | ✓ | ✓ | ✓✓ | ✓✓ | ✓ | ✓ | ✓✓ |
|
||||||
|
| minimal | ✓✓ | ✓✓ | ✓✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
|
||||||
|
| retro | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓ | ✓ | ✓ | ✓ |
|
||||||
|
| pop | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓✓ | ✓ | ✓ | ✓ |
|
||||||
|
| notion | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓✓ |
|
||||||
|
| chalkboard | ✓✓ | ✓✓ | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓✓ | ✓ |
|
||||||
|
| study-notes | ✗ | ✓ | ✓✓ | ✓✓ | ✓ | ✓ | ✓✓ | ✓ |
|
||||||
|
| screen-print | ✓✓ | ✓✓ | ✗ | ✓ | ✓✓ | ✓ | ✗ | ✓✓ |
|
||||||
|
|
||||||
|
## References
|
||||||
|
|
||||||
|
Detailed templates in `references/` directory:
|
||||||
|
|
||||||
|
**Elements** (Visual building blocks):
|
||||||
|
- `elements/canvas.md` - Aspect ratios, safe zones, grid layouts
|
||||||
|
- `elements/image-effects.md` - Cutout, stroke, filters
|
||||||
|
- `elements/typography.md` - Decorated text (花字), tags, text direction
|
||||||
|
- `elements/decorations.md` - Emphasis marks, backgrounds, doodles, frames
|
||||||
|
|
||||||
|
**Presets** (Style presets):
|
||||||
|
- `presets/<name>.md` - Element combination definitions (cute, notion, warm...)
|
||||||
|
- `style-presets.md` - Preset shortcuts (style + layout combos)
|
||||||
|
|
||||||
|
**Workflows** (Process guides):
|
||||||
|
- `workflows/analysis-framework.md` - Content analysis framework
|
||||||
|
- `workflows/outline-template.md` - Outline template with layout guide
|
||||||
|
- `workflows/prompt-assembly.md` - Prompt assembly guide
|
||||||
|
|
||||||
|
**Config** (Settings):
|
||||||
|
- `config/preferences-schema.md` - EXTEND.md schema
|
||||||
|
- `config/first-time-setup.md` - First-time setup flow
|
||||||
|
- `config/watermark-guide.md` - Watermark configuration
|
||||||
|
|
||||||
|
## Notes
|
||||||
|
|
||||||
|
- Auto-retry once on failure | Cartoon alternatives for sensitive figures
|
||||||
|
- Use confirmed language preference | Maintain style consistency
|
||||||
|
- **Smart Confirm required** (Step 2) - do not skip; detailed mode uses two sub-confirmations
|
||||||
|
|
||||||
|
## Extension Support
|
||||||
|
|
||||||
|
Custom configurations via EXTEND.md. See **Step 0** for paths and supported options.
|
||||||
@@ -0,0 +1,122 @@
|
|||||||
|
---
|
||||||
|
name: first-time-setup
|
||||||
|
description: First-time setup flow for baoyu-xhs-images preferences
|
||||||
|
---
|
||||||
|
|
||||||
|
# First-Time Setup
|
||||||
|
|
||||||
|
## Overview
|
||||||
|
|
||||||
|
When no EXTEND.md is found, guide user through preference setup.
|
||||||
|
|
||||||
|
**⛔ BLOCKING OPERATION**: This setup MUST complete before ANY other workflow steps. Do NOT:
|
||||||
|
- Ask about content/article
|
||||||
|
- Ask about style or layout
|
||||||
|
- Ask about target audience
|
||||||
|
- Proceed to content analysis
|
||||||
|
|
||||||
|
ONLY ask the questions in this setup flow, save EXTEND.md, then continue.
|
||||||
|
|
||||||
|
## 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 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 Style
|
||||||
|
|
||||||
|
```
|
||||||
|
header: "Style"
|
||||||
|
question: "Default visual style preference? Or type another style name or your custom style"
|
||||||
|
options:
|
||||||
|
- label: "None (Recommended)"
|
||||||
|
description: "Auto-select based on content analysis"
|
||||||
|
- label: "cute"
|
||||||
|
description: "Sweet, adorable - classic XHS aesthetic"
|
||||||
|
- label: "notion"
|
||||||
|
description: "Minimalist hand-drawn, intellectual"
|
||||||
|
```
|
||||||
|
|
||||||
|
### Question 3: 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-xhs-images/EXTEND.md` | Current project |
|
||||||
|
| User | `~/.baoyu-skills/baoyu-xhs-images/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_style:
|
||||||
|
name: [selected style or null]
|
||||||
|
description: ""
|
||||||
|
preferred_layout: null
|
||||||
|
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`
|
||||||
@@ -0,0 +1,118 @@
|
|||||||
|
---
|
||||||
|
name: preferences-schema
|
||||||
|
description: EXTEND.md YAML schema for baoyu-xhs-images user preferences
|
||||||
|
---
|
||||||
|
|
||||||
|
# Preferences Schema
|
||||||
|
|
||||||
|
## Full Schema
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
---
|
||||||
|
version: 1
|
||||||
|
|
||||||
|
watermark:
|
||||||
|
enabled: false
|
||||||
|
content: ""
|
||||||
|
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
||||||
|
|
||||||
|
preferred_style:
|
||||||
|
name: null # Built-in or custom style name
|
||||||
|
description: "" # Override/notes
|
||||||
|
|
||||||
|
preferred_layout: null # sparse|balanced|dense|list|comparison|flow
|
||||||
|
|
||||||
|
language: null # zh|en|ja|ko|auto
|
||||||
|
|
||||||
|
custom_styles:
|
||||||
|
- name: my-style
|
||||||
|
description: "Style description"
|
||||||
|
color_palette:
|
||||||
|
primary: ["#FED7E2", "#FEEBC8"]
|
||||||
|
background: "#FFFAF0"
|
||||||
|
accents: ["#FF69B4", "#FF6B6B"]
|
||||||
|
visual_elements: "Hearts, stars, sparkles"
|
||||||
|
typography: "Rounded, bubbly hand lettering"
|
||||||
|
best_for: "Lifestyle, beauty"
|
||||||
|
---
|
||||||
|
```
|
||||||
|
|
||||||
|
## 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 |
|
||||||
|
| `preferred_style.name` | string | null | Style name or null |
|
||||||
|
| `preferred_style.description` | string | "" | Custom notes/override |
|
||||||
|
| `preferred_layout` | string | null | Layout preference or null |
|
||||||
|
| `language` | string | null | Output language (null = auto-detect) |
|
||||||
|
| `custom_styles` | array | [] | User-defined styles |
|
||||||
|
|
||||||
|
## 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 |
|
||||||
|
|
||||||
|
## 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: "@myusername"
|
||||||
|
preferred_style:
|
||||||
|
name: notion
|
||||||
|
---
|
||||||
|
```
|
||||||
|
|
||||||
|
## Example: Full Preferences
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
---
|
||||||
|
version: 1
|
||||||
|
watermark:
|
||||||
|
enabled: true
|
||||||
|
content: "@myxhsaccount"
|
||||||
|
position: bottom-right
|
||||||
|
|
||||||
|
preferred_style:
|
||||||
|
name: notion
|
||||||
|
description: "Clean knowledge cards for tech content"
|
||||||
|
|
||||||
|
preferred_layout: dense
|
||||||
|
|
||||||
|
language: zh
|
||||||
|
|
||||||
|
custom_styles:
|
||||||
|
- name: corporate
|
||||||
|
description: "Professional B2B style"
|
||||||
|
color_palette:
|
||||||
|
primary: ["#1E3A5F", "#4A90D9"]
|
||||||
|
background: "#F5F7FA"
|
||||||
|
accents: ["#00B4D8", "#48CAE4"]
|
||||||
|
visual_elements: "Clean lines, subtle gradients, geometric shapes"
|
||||||
|
typography: "Modern sans-serif, professional"
|
||||||
|
best_for: "Business, SaaS, enterprise"
|
||||||
|
---
|
||||||
|
```
|
||||||
@@ -0,0 +1,62 @@
|
|||||||
|
---
|
||||||
|
name: watermark-guide
|
||||||
|
description: Watermark configuration guide for baoyu-xhs-images
|
||||||
|
---
|
||||||
|
|
||||||
|
# Watermark Guide
|
||||||
|
|
||||||
|
## Position Diagram
|
||||||
|
|
||||||
|
```
|
||||||
|
┌─────────────────────────────┐
|
||||||
|
│ [top-right]│
|
||||||
|
│ │
|
||||||
|
│ │
|
||||||
|
│ IMAGE CONTENT │
|
||||||
|
│ │
|
||||||
|
│ │
|
||||||
|
│[bottom-left][bottom-center][bottom-right]│
|
||||||
|
└─────────────────────────────┘
|
||||||
|
```
|
||||||
|
|
||||||
|
## Position Recommendations
|
||||||
|
|
||||||
|
| Position | Best For | Avoid When |
|
||||||
|
|----------|----------|------------|
|
||||||
|
| `bottom-right` | Default choice, most common | Key info in bottom-right |
|
||||||
|
| `bottom-left` | Right-heavy layouts | Key info in bottom-left |
|
||||||
|
| `bottom-center` | Centered designs | Text-heavy bottom area |
|
||||||
|
| `top-right` | Bottom-heavy content | Title/header in top-right |
|
||||||
|
|
||||||
|
## Content Format
|
||||||
|
|
||||||
|
| Format | Example | Style |
|
||||||
|
|--------|---------|-------|
|
||||||
|
| Handle | `@username` | Most common for XHS |
|
||||||
|
| Text | `MyBrand` | Simple branding |
|
||||||
|
| Chinese | `小红书:用户名` | Platform specific |
|
||||||
|
| URL | `myblog.com` | Cross-platform |
|
||||||
|
|
||||||
|
## Best Practices
|
||||||
|
|
||||||
|
1. **Consistency**: Use same watermark across all images in series
|
||||||
|
2. **Legibility**: Ensure watermark readable on both light/dark areas
|
||||||
|
3. **Size**: Keep subtle - should not distract from content
|
||||||
|
|
||||||
|
## Prompt Integration
|
||||||
|
|
||||||
|
When watermark is enabled, add to image generation prompt:
|
||||||
|
|
||||||
|
```
|
||||||
|
Include a subtle watermark "[content]" positioned at [position].
|
||||||
|
The watermark should be legible but not distracting from the main content.
|
||||||
|
```
|
||||||
|
|
||||||
|
## Common Issues
|
||||||
|
|
||||||
|
| Issue | Solution |
|
||||||
|
|-------|----------|
|
||||||
|
| Watermark invisible | Adjust position or check contrast |
|
||||||
|
| Watermark too prominent | Change position or reduce size |
|
||||||
|
| Watermark overlaps content | Change position |
|
||||||
|
| Inconsistent across images | Use session ID for consistency |
|
||||||
@@ -0,0 +1,122 @@
|
|||||||
|
# Canvas & Layout
|
||||||
|
|
||||||
|
Core canvas specifications and layout grids for Xiaohongshu infographics.
|
||||||
|
|
||||||
|
## Aspect Ratios
|
||||||
|
|
||||||
|
| Name | Ratio | Pixels | Note |
|
||||||
|
|------|-------|--------|------|
|
||||||
|
| portrait-3-4 | 3:4 | 1242×1660 | Highest traffic on XHS (recommended) |
|
||||||
|
| square | 1:1 | 1242×1242 | Second recommended |
|
||||||
|
| portrait-2-3 | 2:3 | 1242×1863 | Taller format |
|
||||||
|
|
||||||
|
**Default**: portrait-3-4 for maximum engagement.
|
||||||
|
|
||||||
|
## Safe Zones
|
||||||
|
|
||||||
|
Avoid placing critical content in these areas:
|
||||||
|
|
||||||
|
| Zone | Position | Reason |
|
||||||
|
|------|----------|--------|
|
||||||
|
| bottom-overlay | Bottom 10% | Title bar overlay on mobile |
|
||||||
|
| top-right | Top-right corner | Like/share button overlay |
|
||||||
|
| bottom-right | Bottom-right corner | Watermark position |
|
||||||
|
|
||||||
|
```
|
||||||
|
┌─────────────────────────────┐
|
||||||
|
│ [like/share]│ ← top-right: avoid
|
||||||
|
│ │
|
||||||
|
│ │
|
||||||
|
│ ✓ SAFE CONTENT AREA │
|
||||||
|
│ │
|
||||||
|
│ │
|
||||||
|
│ [title bar overlay area] │ ← bottom 10%: avoid key info
|
||||||
|
└─────────────────────────────┘
|
||||||
|
```
|
||||||
|
|
||||||
|
## Grid Layouts
|
||||||
|
|
||||||
|
### Density-Based Layouts
|
||||||
|
|
||||||
|
| Layout | Info Density | Whitespace | Points/Image | Best For |
|
||||||
|
|--------|--------------|------------|--------------|----------|
|
||||||
|
| sparse | Low | 60-70% | 1-2 | Covers, quotes, impactful statements |
|
||||||
|
| balanced | Medium | 40-50% | 3-4 | Standard content, tutorials |
|
||||||
|
| dense | High | 20-30% | 5-8 | Knowledge cards, cheat sheets |
|
||||||
|
|
||||||
|
### Structure-Based Layouts
|
||||||
|
|
||||||
|
| Layout | Structure | Items | Best For |
|
||||||
|
|--------|-----------|-------|----------|
|
||||||
|
| list | Vertical enumeration | 4-7 | Rankings, checklists, step guides |
|
||||||
|
| comparison | Left vs Right | 2 sections | Before/after, pros/cons |
|
||||||
|
| flow | Connected nodes | 3-6 steps | Processes, timelines, workflows |
|
||||||
|
| mindmap | Center radial | 4-8 branches | Concept maps, brainstorming, topic overview |
|
||||||
|
| quadrant | 4-section grid | 4 sections | SWOT analysis, priority matrix, classification |
|
||||||
|
|
||||||
|
## Layout by Position
|
||||||
|
|
||||||
|
| Position | Recommended Layout | Why |
|
||||||
|
|----------|-------------------|-----|
|
||||||
|
| Cover | sparse | Maximum visual impact, clear title |
|
||||||
|
| Setup | balanced | Context without overwhelming |
|
||||||
|
| Core | balanced/dense/list | Based on content density |
|
||||||
|
| Payoff | balanced/list | Clear takeaways |
|
||||||
|
| Ending | sparse | Clean CTA, memorable close |
|
||||||
|
|
||||||
|
## Grid Cells
|
||||||
|
|
||||||
|
For multi-element compositions:
|
||||||
|
|
||||||
|
| Name | Cells | Use Case |
|
||||||
|
|------|-------|----------|
|
||||||
|
| single | 1 | Hero image, maximum impact |
|
||||||
|
| dual | 2 | Before/after, comparison |
|
||||||
|
| triptych | 3 | Steps, process flow |
|
||||||
|
| quad | 4 | Product showcase |
|
||||||
|
| six-grid | 6 | Checklist, collection |
|
||||||
|
| nine-grid | 9 | Multi-image gallery |
|
||||||
|
|
||||||
|
## Visual Balance
|
||||||
|
|
||||||
|
### Sparse Layout
|
||||||
|
- Single focal point centered
|
||||||
|
- Breathing room on all sides
|
||||||
|
- Symmetrical composition
|
||||||
|
|
||||||
|
### Balanced Layout
|
||||||
|
- Top-weighted title
|
||||||
|
- Evenly distributed content below
|
||||||
|
- Clear visual hierarchy
|
||||||
|
|
||||||
|
### Dense Layout
|
||||||
|
- Organized grid structure
|
||||||
|
- Clear section boundaries
|
||||||
|
- Compact but readable spacing
|
||||||
|
|
||||||
|
### List Layout
|
||||||
|
- Left-aligned items
|
||||||
|
- Clear number/bullet hierarchy
|
||||||
|
- Consistent item format
|
||||||
|
|
||||||
|
### Comparison Layout
|
||||||
|
- Symmetrical left/right
|
||||||
|
- Clear visual contrast
|
||||||
|
- Divider between sections
|
||||||
|
|
||||||
|
### Flow Layout
|
||||||
|
- Directional flow (top→bottom or left→right)
|
||||||
|
- Connected nodes with arrows
|
||||||
|
- Clear progression indicators
|
||||||
|
|
||||||
|
### Mindmap Layout
|
||||||
|
- Central topic node
|
||||||
|
- Radial branches outward
|
||||||
|
- Hierarchical sub-branches
|
||||||
|
- Organic curved connections
|
||||||
|
|
||||||
|
### Quadrant Layout
|
||||||
|
- 4-section grid (2×2)
|
||||||
|
- Clear axis labels
|
||||||
|
- Each quadrant with distinct content
|
||||||
|
- Optional circular variant for cycles
|
||||||
@@ -0,0 +1,152 @@
|
|||||||
|
# Decorative Assets
|
||||||
|
|
||||||
|
Visual embellishments and decorative elements for Xiaohongshu infographics.
|
||||||
|
|
||||||
|
## Emphasis Marks (强调标记)
|
||||||
|
|
||||||
|
Elements to draw attention to specific content.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| red-arrow | Red arrow pointing to target | Product features, key points |
|
||||||
|
| circle-mark | Circle highlight annotation | Highlighting details |
|
||||||
|
| underline | Straight or wavy underline | Text emphasis |
|
||||||
|
| star-burst | Starburst explosion effect | Special offers, wow factor |
|
||||||
|
| checkmark | Checkmark/tick symbol | Completed items, pros |
|
||||||
|
| cross-mark | X mark symbol | Cons, things to avoid |
|
||||||
|
| exclamation | Exclamation point decoration | Important warnings |
|
||||||
|
| question | Question mark decoration | FAQ, curiosity |
|
||||||
|
| numbering | Circled numbers | Steps, rankings |
|
||||||
|
| bracket | Bracket highlighting | Grouping, emphasis |
|
||||||
|
|
||||||
|
## Backgrounds (背景)
|
||||||
|
|
||||||
|
Base layer treatments.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| solid-saturated | High-saturation solid color | Bold, energetic |
|
||||||
|
| solid-pastel | Soft pastel solid color | Cute, gentle |
|
||||||
|
| gradient-linear | Linear color gradient | Modern, dynamic |
|
||||||
|
| gradient-radial | Radial color gradient | Spotlight effect |
|
||||||
|
| frosted-glass | Frosted glass blur effect | Layered compositions |
|
||||||
|
| paper-texture | Paper or craft texture | Handmade aesthetic |
|
||||||
|
| fabric-texture | Fabric/cloth texture | Cozy, tactile |
|
||||||
|
| chalkboard | Blackboard texture | Educational content |
|
||||||
|
| grid | Subtle grid pattern | Structured, organized |
|
||||||
|
| dots | Polka dot pattern | Playful, retro |
|
||||||
|
|
||||||
|
## Doodles & Emoji (涂鸦)
|
||||||
|
|
||||||
|
Hand-drawn decorative elements.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| hand-drawn-lines | Sketchy hand-drawn lines | Connections, borders |
|
||||||
|
| stars-sparkles | Stars and sparkle effects | Magic, excellence |
|
||||||
|
| flowers | Floral decorations | Beauty, feminine |
|
||||||
|
| hearts | Heart symbols | Love, favorites |
|
||||||
|
| clouds | Cloud shapes | Dreamy, thoughts |
|
||||||
|
| arrows-curvy | Curved directional arrows | Flow, direction |
|
||||||
|
| squiggles | Wavy squiggle lines | Energy, movement |
|
||||||
|
| confetti | Scattered confetti | Celebration |
|
||||||
|
| leaves | Leaf decorations | Nature, fresh |
|
||||||
|
| bubbles | Circular bubble shapes | Playful, light |
|
||||||
|
|
||||||
|
## Emoji Integration
|
||||||
|
|
||||||
|
| Category | Examples | Use Case |
|
||||||
|
|----------|----------|----------|
|
||||||
|
| Reactions | 🥹 😍 🤯 | Emotional emphasis |
|
||||||
|
| Objects | ✨ 💡 🎯 | Visual markers |
|
||||||
|
| Actions | 👇 👆 ➡️ | Directional cues |
|
||||||
|
| Nature | 🌸 🌿 ☀️ | Thematic decoration |
|
||||||
|
|
||||||
|
## Frames (边框)
|
||||||
|
|
||||||
|
Container and border treatments.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| polaroid | Instant photo frame | Photo showcase |
|
||||||
|
| film-strip | Film negative border | Cinematic, retro |
|
||||||
|
| phone-screenshot | Mobile device mockup | App/screen content |
|
||||||
|
| torn-paper | Torn paper edge effect | Scrapbook aesthetic |
|
||||||
|
| rounded-rect | Rounded rectangle border | Clean containers |
|
||||||
|
| decorative | Ornate decorative border | Premium, elegant |
|
||||||
|
| tape-corners | Washi tape corners | Crafty, casual |
|
||||||
|
| stamp-border | Stamp perforated edge | Vintage, postal |
|
||||||
|
|
||||||
|
## Dividers (分隔线)
|
||||||
|
|
||||||
|
Section separators.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| line-simple | Simple horizontal line | Clean separation |
|
||||||
|
| line-dashed | Dashed line | Subtle division |
|
||||||
|
| line-wavy | Wavy line | Playful separation |
|
||||||
|
| dots-row | Row of dots | Decorative division |
|
||||||
|
| ornamental | Decorative flourish | Elegant separation |
|
||||||
|
|
||||||
|
## Stickers (贴纸)
|
||||||
|
|
||||||
|
Pre-composed decorative elements.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| badge-new | "NEW" badge | New products |
|
||||||
|
| badge-hot | "HOT" badge | Trending items |
|
||||||
|
| badge-sale | Sale/discount badge | Promotions |
|
||||||
|
| seal-quality | Quality seal | Recommendations |
|
||||||
|
| ribbon-award | Award ribbon | Best picks |
|
||||||
|
| tag-price | Price tag shape | Pricing info |
|
||||||
|
|
||||||
|
## Style-Specific Decorations
|
||||||
|
|
||||||
|
### Cute Style
|
||||||
|
- Hearts, stars, sparkles
|
||||||
|
- Ribbon decorations, sticker-style
|
||||||
|
- Cute character elements
|
||||||
|
|
||||||
|
### Notion Style
|
||||||
|
- Simple line doodles
|
||||||
|
- Geometric shapes, stick figures
|
||||||
|
- Maximum whitespace, minimal decoration
|
||||||
|
|
||||||
|
### Warm Style
|
||||||
|
- Sun rays, coffee cups, cozy items
|
||||||
|
- Warm lighting effects
|
||||||
|
- Friendly, inviting decorations
|
||||||
|
|
||||||
|
### Fresh Style
|
||||||
|
- Plant leaves, clouds, water drops
|
||||||
|
- Simple geometric shapes
|
||||||
|
- Open, breathing composition
|
||||||
|
|
||||||
|
### Bold Style
|
||||||
|
- Exclamation marks, arrows
|
||||||
|
- Warning icons, strong shapes
|
||||||
|
- High contrast elements
|
||||||
|
|
||||||
|
### Pop Style
|
||||||
|
- Bold shapes, speech bubbles
|
||||||
|
- Comic-style effects, starburst
|
||||||
|
- Dynamic, energetic decorations
|
||||||
|
|
||||||
|
### Retro Style
|
||||||
|
- Halftone dots, vintage badges
|
||||||
|
- Classic icons, tape effects
|
||||||
|
- Aged texture overlays
|
||||||
|
|
||||||
|
### Chalkboard Style
|
||||||
|
- Chalk dust effects
|
||||||
|
- Hand-drawn doodles
|
||||||
|
- Mathematical formulas, simple icons
|
||||||
|
|
||||||
|
### Screen-Print Style
|
||||||
|
- Bold silhouettes, geometric shapes
|
||||||
|
- Halftone dot patterns, print grain
|
||||||
|
- No doodles — negative space does the work
|
||||||
|
- Stencil-cut edges, color block boundaries
|
||||||
|
- Vintage poster border treatments
|
||||||
@@ -0,0 +1,92 @@
|
|||||||
|
# Image Processing Layer
|
||||||
|
|
||||||
|
Visual effects applied to image elements in Xiaohongshu infographics.
|
||||||
|
|
||||||
|
## AI Cutout (抠图)
|
||||||
|
|
||||||
|
Subject extraction styles for product/figure isolation.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| clean | Sharp edges, precise boundaries | Product photography, tech items |
|
||||||
|
| soft | Soft transition, feathered edges | Portrait cutout, organic subjects |
|
||||||
|
| stylized | Hand-drawn edge treatment | Artistic compositions |
|
||||||
|
|
||||||
|
## Stroke Effects (描边)
|
||||||
|
|
||||||
|
Border treatments for cutout elements.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| white-solid | White solid line border | Classic sticker feel, high contrast |
|
||||||
|
| colored-solid | Colored solid line border | Playful vibe, brand colors |
|
||||||
|
| dashed | Dashed/dotted border | Handmade aesthetic, casual |
|
||||||
|
| double | Double-layer stroke | Emphasis effect, premium feel |
|
||||||
|
| glow | Soft outer glow | Dreamy, soft aesthetic |
|
||||||
|
| shadow | Drop shadow effect | Depth, floating element |
|
||||||
|
|
||||||
|
**Stroke Width Guidelines**:
|
||||||
|
- Thin: 2-4px - Subtle, elegant
|
||||||
|
- Medium: 5-8px - Standard visibility
|
||||||
|
- Thick: 10-15px - Bold emphasis
|
||||||
|
|
||||||
|
## Filters (滤镜)
|
||||||
|
|
||||||
|
Color grading and mood presets popular on XHS.
|
||||||
|
|
||||||
|
| Name | Chinese | Description | Mood |
|
||||||
|
|------|---------|-------------|------|
|
||||||
|
| clear-glow | 清透感 | Transparent, radiant, luminous | Fresh, youthful |
|
||||||
|
| film-grain | 胶片感 | Vintage film aesthetic, grain texture | Nostalgic, artistic |
|
||||||
|
| cream-skin | 奶油肌 | Smooth, creamy complexion tones | Soft, flattering |
|
||||||
|
| japanese-magazine | 日杂感 | Lifestyle magazine aesthetic | Curated, aspirational |
|
||||||
|
| high-saturation | 高饱和 | Vibrant, punchy colors | Energetic, eye-catching |
|
||||||
|
| muted-tones | 莫兰迪 | Morandi-style desaturated palette | Sophisticated, calm |
|
||||||
|
| warm-tone | 暖色调 | Golden hour warmth | Cozy, inviting |
|
||||||
|
| cool-tone | 冷色调 | Blue-shifted coolness | Modern, clean |
|
||||||
|
|
||||||
|
## Texture Overlays
|
||||||
|
|
||||||
|
Additional texture effects.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| paper | Paper or fabric texture | Handmade feel |
|
||||||
|
| noise | Fine grain noise | Analog aesthetic |
|
||||||
|
| halftone | Dot pattern | Retro print style |
|
||||||
|
| scratch | Light scratch marks | Vintage wear |
|
||||||
|
|
||||||
|
## Blending Modes
|
||||||
|
|
||||||
|
For layered compositions.
|
||||||
|
|
||||||
|
| Mode | Effect | Use Case |
|
||||||
|
|------|--------|----------|
|
||||||
|
| multiply | Darken, merge | Shadow effects |
|
||||||
|
| screen | Lighten, glow | Light effects |
|
||||||
|
| overlay | Contrast boost | Vibrant compositions |
|
||||||
|
| soft-light | Subtle blending | Natural layering |
|
||||||
|
|
||||||
|
## Effect Combinations
|
||||||
|
|
||||||
|
Common effect stacks for different styles:
|
||||||
|
|
||||||
|
### Cute Style
|
||||||
|
- Filter: clear-glow or cream-skin
|
||||||
|
- Stroke: white-solid (medium)
|
||||||
|
- Texture: none
|
||||||
|
|
||||||
|
### Notion Style
|
||||||
|
- Filter: none or muted-tones
|
||||||
|
- Stroke: white-solid (thin) or none
|
||||||
|
- Texture: paper (subtle)
|
||||||
|
|
||||||
|
### Retro Style
|
||||||
|
- Filter: film-grain
|
||||||
|
- Stroke: double or dashed
|
||||||
|
- Texture: halftone, scratch
|
||||||
|
|
||||||
|
### Bold Style
|
||||||
|
- Filter: high-saturation
|
||||||
|
- Stroke: colored-solid (thick)
|
||||||
|
- Texture: none
|
||||||
@@ -0,0 +1,96 @@
|
|||||||
|
# Typography System
|
||||||
|
|
||||||
|
Text styling elements for Xiaohongshu infographics.
|
||||||
|
|
||||||
|
## Decorated Text (花字)
|
||||||
|
|
||||||
|
Stylized text treatments for emphasis and visual appeal.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| gradient | Gradient color fill | Title emphasis, modern feel |
|
||||||
|
| stroke-text | Outlined text with stroke | Cover headlines, high visibility |
|
||||||
|
| shadow-3d | 3D shadow/extrusion effect | Key terms, depth |
|
||||||
|
| highlight | Highlighter marker effect | Critical information, key points |
|
||||||
|
| neon | Neon glow effect | Tech content, night aesthetic |
|
||||||
|
| handwritten | Authentic handwritten style | Personal touch, casual |
|
||||||
|
| bubble | Rounded, inflated letterforms | Cute, playful content |
|
||||||
|
| brush | Brush stroke texture | Artistic, dynamic |
|
||||||
|
|
||||||
|
## Tags & Labels (标签)
|
||||||
|
|
||||||
|
Structured text containers.
|
||||||
|
|
||||||
|
| Name | Description | Use Case |
|
||||||
|
|------|-------------|----------|
|
||||||
|
| black-white | Black background, white text | Brand names, prices, categories |
|
||||||
|
| white-black | White background, black text | Clean labels, minimal style |
|
||||||
|
| bubble | Speech bubble style | Dialogue, annotations, callouts |
|
||||||
|
| pointer | Arrow pointer with label | Product callouts, pointing to features |
|
||||||
|
| ribbon | Ribbon/banner shape | Special offers, highlights |
|
||||||
|
| stamp | Stamp/seal style | Authenticity, recommendations |
|
||||||
|
| pill | Rounded pill shape | Tags, categories, keywords |
|
||||||
|
|
||||||
|
## Text Hierarchy
|
||||||
|
|
||||||
|
Recommended text sizing for visual hierarchy.
|
||||||
|
|
||||||
|
| Level | Role | Relative Size | Style |
|
||||||
|
|-------|------|---------------|-------|
|
||||||
|
| H1 | Main title | 100% | Bold, decorated |
|
||||||
|
| H2 | Section header | 70-80% | Semi-bold |
|
||||||
|
| H3 | Subsection | 50-60% | Medium weight |
|
||||||
|
| Body | Content text | 40-50% | Regular |
|
||||||
|
| Caption | Small notes | 30-35% | Light |
|
||||||
|
|
||||||
|
## Text Direction
|
||||||
|
|
||||||
|
| Direction | Description | Use Case |
|
||||||
|
|-----------|-------------|----------|
|
||||||
|
| horizontal | Standard left-to-right | Default for most content |
|
||||||
|
| vertical | Top-to-bottom columns | Magazine style, traditional Chinese |
|
||||||
|
| curved | Text following a curve | Decorative, around shapes |
|
||||||
|
| diagonal | Angled text | Dynamic compositions |
|
||||||
|
|
||||||
|
## Text Effects
|
||||||
|
|
||||||
|
| Effect | Description | Use Case |
|
||||||
|
|--------|-------------|----------|
|
||||||
|
| shadow | Drop shadow behind text | Readability on busy backgrounds |
|
||||||
|
| outline | Outline around letterforms | High contrast visibility |
|
||||||
|
| glow | Soft glow around text | Dreamy, emphasis |
|
||||||
|
| underline-wavy | Wavy underline decoration | Playful emphasis |
|
||||||
|
| strikethrough | Crossed out text | Before/after, corrections |
|
||||||
|
|
||||||
|
## Language Considerations
|
||||||
|
|
||||||
|
### Chinese Text (中文)
|
||||||
|
- Punctuation: 「」（）、。！？
|
||||||
|
- Spacing: No spaces between characters
|
||||||
|
- Line height: 1.5-1.8x for readability
|
||||||
|
|
||||||
|
### Mixed Text
|
||||||
|
- English in Chinese context: Maintain consistent baseline
|
||||||
|
- Numbers: Use consistent number style (lining vs old-style)
|
||||||
|
|
||||||
|
## Style-Specific Typography
|
||||||
|
|
||||||
|
### Cute Style
|
||||||
|
- Rounded, bubbly hand lettering
|
||||||
|
- Soft shadows, playful decorations
|
||||||
|
- Pink/pastel color accents
|
||||||
|
|
||||||
|
### Notion Style
|
||||||
|
- Clean hand-drawn lettering
|
||||||
|
- Simple sans-serif labels
|
||||||
|
- Minimal decoration
|
||||||
|
|
||||||
|
### Bold Style
|
||||||
|
- Impactful hand lettering with shadows
|
||||||
|
- High contrast colors
|
||||||
|
- Strong outlines
|
||||||
|
|
||||||
|
### Chalkboard Style
|
||||||
|
- Chalk texture on all text
|
||||||
|
- Visible imperfections
|
||||||
|
- Multi-color chalk variety
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
---
|
||||||
|
name: bold
|
||||||
|
category: impact
|
||||||
|
---
|
||||||
|
|
||||||
|
# Bold Style
|
||||||
|
|
||||||
|
High impact, attention-grabbing aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | dual
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: clean
|
||||||
|
stroke: colored-solid | double
|
||||||
|
filter: high-saturation
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: shadow-3d | stroke-text
|
||||||
|
tags: black-white | ribbon
|
||||||
|
direction: horizontal | diagonal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: exclamation | star-burst | red-arrow
|
||||||
|
background: solid-saturated | gradient-linear
|
||||||
|
doodles: arrows-curvy | squiggles
|
||||||
|
frames: none
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Vibrant red, orange, yellow | #E53E3E, #DD6B20, #F6E05E |
|
||||||
|
| Background | Deep black, dark charcoal | #000000, #1A1A1A |
|
||||||
|
| Accents | White, neon yellow | #FFFFFF, #F7FF00 |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Exclamation marks, arrows, warning icons
|
||||||
|
- Strong shapes, high contrast elements
|
||||||
|
- Dramatic compositions
|
||||||
|
- Bold geometric forms
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Bold, impactful hand lettering with shadows
|
||||||
|
- High contrast text treatments
|
||||||
|
- Large, commanding headlines
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Impactful statements |
|
||||||
|
| balanced | ✓ | Warning content |
|
||||||
|
| dense | ✓ | Critical information cards |
|
||||||
|
| list | ✓✓ | Must-know lists, rankings |
|
||||||
|
| comparison | ✓✓ | Dramatic contrasts |
|
||||||
|
| flow | ✓ | Critical process steps |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Important tips and warnings
|
||||||
|
- Must-know content
|
||||||
|
- Critical announcements
|
||||||
|
- Rankings and comparisons
|
||||||
|
- Attention-grabbing hooks
|
||||||
@@ -0,0 +1,97 @@
|
|||||||
|
---
|
||||||
|
name: chalkboard
|
||||||
|
category: educational
|
||||||
|
---
|
||||||
|
|
||||||
|
# Chalkboard Style
|
||||||
|
|
||||||
|
Black chalkboard background with colorful chalk drawing aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | dual | triptych
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: stylized
|
||||||
|
stroke: none
|
||||||
|
filter: none
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: handwritten
|
||||||
|
tags: none
|
||||||
|
direction: horizontal | vertical
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: underline | circle-mark | arrows-curvy
|
||||||
|
background: chalkboard
|
||||||
|
doodles: hand-drawn-lines | stars-sparkles
|
||||||
|
frames: none
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Background | Chalkboard black, green-black | #1A1A1A, #1C2B1C |
|
||||||
|
| Primary Text | Chalk white | #F5F5F5 |
|
||||||
|
| Accent 1 | Chalk yellow | #FFE566 |
|
||||||
|
| Accent 2 | Chalk pink | #FF9999 |
|
||||||
|
| Accent 3 | Chalk blue | #66B3FF |
|
||||||
|
| Accent 4 | Chalk green | #90EE90 |
|
||||||
|
| Accent 5 | Chalk orange | #FFB366 |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Hand-drawn chalk illustrations with sketchy, imperfect lines
|
||||||
|
- Chalk dust effects around text and key elements
|
||||||
|
- Doodles: stars, arrows, underlines, circles, checkmarks
|
||||||
|
- Mathematical formulas and simple diagrams
|
||||||
|
- Eraser smudges and chalk residue textures
|
||||||
|
- Stick figures and simple icons
|
||||||
|
- Connection lines with hand-drawn feel
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Hand-drawn chalk lettering style
|
||||||
|
- Visible chalk texture on all text
|
||||||
|
- Imperfect baseline adds authenticity
|
||||||
|
- White or bright colored chalk for emphasis
|
||||||
|
|
||||||
|
## Style Rules
|
||||||
|
|
||||||
|
### Do
|
||||||
|
- Maintain authentic chalk texture on all elements
|
||||||
|
- Use imperfect, hand-drawn quality throughout
|
||||||
|
- Add subtle chalk dust and smudge effects
|
||||||
|
- Create visual hierarchy with color variety
|
||||||
|
- Include playful doodles and annotations
|
||||||
|
|
||||||
|
### Don't
|
||||||
|
- Use perfect geometric shapes
|
||||||
|
- Create clean digital-looking lines
|
||||||
|
- Add photorealistic elements
|
||||||
|
- Use gradients or glossy effects
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Educational covers |
|
||||||
|
| balanced | ✓✓ | Standard lessons |
|
||||||
|
| dense | ✓✓ | Detailed tutorials |
|
||||||
|
| list | ✓✓ | Learning checklists |
|
||||||
|
| comparison | ✓ | Concept comparisons |
|
||||||
|
| flow | ✓✓ | Process explanations |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Educational content
|
||||||
|
- Tutorials and how-to's
|
||||||
|
- Classroom themes
|
||||||
|
- Teaching materials
|
||||||
|
- Workshops
|
||||||
|
- Informal learning sessions
|
||||||
|
- Knowledge sharing
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
---
|
||||||
|
name: cute
|
||||||
|
category: sweet
|
||||||
|
---
|
||||||
|
|
||||||
|
# Cute Style
|
||||||
|
|
||||||
|
Sweet, adorable, girly - classic Xiaohongshu aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | dual | quad
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: soft
|
||||||
|
stroke: white-solid | colored-solid
|
||||||
|
filter: clear-glow | cream-skin
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: bubble | highlight
|
||||||
|
tags: pill | bubble
|
||||||
|
direction: horizontal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: star-burst | hearts
|
||||||
|
background: solid-pastel | gradient-linear
|
||||||
|
doodles: hearts | stars-sparkles | flowers
|
||||||
|
frames: polaroid | tape-corners
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Pink, peach, mint, lavender | #FED7E2, #FEEBC8, #C6F6D5, #E9D8FD |
|
||||||
|
| Background | Cream, soft pink | #FFFAF0, #FFF5F7 |
|
||||||
|
| Accents | Hot pink, coral | #FF69B4, #FF6B6B |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Hearts, stars, sparkles, cute faces
|
||||||
|
- Ribbon decorations, sticker-style
|
||||||
|
- Cute stickers, emoji icons
|
||||||
|
- Soft, rounded shapes
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Rounded, bubbly hand lettering
|
||||||
|
- Soft shadows, playful decorations
|
||||||
|
- Pink/pastel color accents on text
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Covers, emotional impact |
|
||||||
|
| balanced | ✓✓ | Standard cute content |
|
||||||
|
| dense | ✓ | Cute knowledge cards |
|
||||||
|
| list | ✓✓ | Checklists, cute rankings |
|
||||||
|
| comparison | ✓ | Before/after transformations |
|
||||||
|
| flow | ✓ | Cute step guides |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Lifestyle content
|
||||||
|
- Beauty and skincare
|
||||||
|
- Fashion and style
|
||||||
|
- Daily tips and hacks
|
||||||
|
- Personal shares
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
---
|
||||||
|
name: fresh
|
||||||
|
category: natural
|
||||||
|
---
|
||||||
|
|
||||||
|
# Fresh Style
|
||||||
|
|
||||||
|
Clean, refreshing, natural aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | triptych
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: soft
|
||||||
|
stroke: white-solid | none
|
||||||
|
filter: clear-glow | cool-tone
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: none | highlight
|
||||||
|
tags: pill | white-black
|
||||||
|
direction: horizontal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: checkmark | circle-mark
|
||||||
|
background: solid-white | solid-pastel
|
||||||
|
doodles: leaves | clouds | bubbles
|
||||||
|
frames: rounded-rect | none
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Mint green, sky blue, light yellow | #9AE6B4, #90CDF4, #FAF089 |
|
||||||
|
| Background | Pure white, soft mint | #FFFFFF, #F0FFF4 |
|
||||||
|
| Accents | Leaf green, water blue | #48BB78, #4299E1 |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Plant leaves, clouds, water drops
|
||||||
|
- Simple geometric shapes
|
||||||
|
- Breathing room, open composition
|
||||||
|
- Natural, organic elements
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Clean, light hand lettering with breathing room
|
||||||
|
- Airy spacing
|
||||||
|
- Fresh color accents
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Clean covers |
|
||||||
|
| balanced | ✓✓ | Standard fresh content |
|
||||||
|
| dense | ✓ | Organized information |
|
||||||
|
| list | ✓ | Wellness tips |
|
||||||
|
| comparison | ✓ | Before/after health |
|
||||||
|
| flow | ✓✓ | Organic processes |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Health and wellness
|
||||||
|
- Minimalist lifestyle
|
||||||
|
- Self-care content
|
||||||
|
- Nature-related topics
|
||||||
|
- Clean living tips
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
---
|
||||||
|
name: minimal
|
||||||
|
category: elegant
|
||||||
|
---
|
||||||
|
|
||||||
|
# Minimal Style
|
||||||
|
|
||||||
|
Ultra-clean, sophisticated aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: clean
|
||||||
|
stroke: none | white-solid
|
||||||
|
filter: none | muted-tones
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: none
|
||||||
|
tags: white-black | pill
|
||||||
|
direction: horizontal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: underline | circle-mark
|
||||||
|
background: solid-white | solid-pastel
|
||||||
|
doodles: hand-drawn-lines
|
||||||
|
frames: none | rounded-rect
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Black, white | #000000, #FFFFFF |
|
||||||
|
| Background | Off-white, pure white | #FAFAFA, #FFFFFF |
|
||||||
|
| Accents | Single color (content-derived) | Blue, green, or coral |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Single focal point, thin lines
|
||||||
|
- Maximum whitespace
|
||||||
|
- Simple, clean decorations
|
||||||
|
- Restrained visual elements
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Clean, simple hand lettering
|
||||||
|
- Minimal weight variations
|
||||||
|
- Elegant spacing
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Elegant statements |
|
||||||
|
| balanced | ✓✓ | Professional content |
|
||||||
|
| dense | ✓✓ | Clean knowledge cards |
|
||||||
|
| list | ✓ | Simple lists |
|
||||||
|
| comparison | ✓ | Clean comparisons |
|
||||||
|
| flow | ✓ | Elegant processes |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Professional content
|
||||||
|
- Serious topics
|
||||||
|
- Elegant presentations
|
||||||
|
- High-end products
|
||||||
|
- Business content
|
||||||
@@ -0,0 +1,73 @@
|
|||||||
|
---
|
||||||
|
name: notion
|
||||||
|
category: minimal
|
||||||
|
---
|
||||||
|
|
||||||
|
# Notion Style
|
||||||
|
|
||||||
|
Minimalist hand-drawn line art, intellectual aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | dual
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: clean
|
||||||
|
stroke: none | white-solid
|
||||||
|
filter: none | muted-tones
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: none | handwritten
|
||||||
|
tags: black-white | pill
|
||||||
|
direction: horizontal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: circle-mark | underline
|
||||||
|
background: solid-white | paper-texture
|
||||||
|
doodles: hand-drawn-lines | arrows-curvy
|
||||||
|
frames: none | rounded-rect
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Black, dark gray | #1A1A1A, #4A4A4A |
|
||||||
|
| Background | Pure white, off-white | #FFFFFF, #FAFAFA |
|
||||||
|
| Accents | Pastel blue, pastel yellow, pastel pink | #A8D4F0, #F9E79F, #FADBD8 |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Simple line doodles, hand-drawn wobble effect
|
||||||
|
- Geometric shapes, stick figures
|
||||||
|
- Maximum whitespace, single-weight ink lines
|
||||||
|
- Clean, uncluttered compositions
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Clean hand-drawn lettering
|
||||||
|
- Simple sans-serif labels
|
||||||
|
- Minimal decoration on text
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Concept covers |
|
||||||
|
| balanced | ✓✓ | Standard explanations |
|
||||||
|
| dense | ✓✓ | Knowledge cards, cheat sheets |
|
||||||
|
| list | ✓✓ | Productivity tips, tool lists |
|
||||||
|
| comparison | ✓✓ | Data comparisons |
|
||||||
|
| flow | ✓✓ | Process diagrams |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Knowledge sharing
|
||||||
|
- Concept explanations
|
||||||
|
- SaaS content
|
||||||
|
- Productivity tips
|
||||||
|
- Tech tutorials
|
||||||
|
- Professional content
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
---
|
||||||
|
name: pop
|
||||||
|
category: energetic
|
||||||
|
---
|
||||||
|
|
||||||
|
# Pop Style
|
||||||
|
|
||||||
|
Vibrant, energetic, eye-catching aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | quad
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: stylized
|
||||||
|
stroke: colored-solid | double
|
||||||
|
filter: high-saturation
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: stroke-text | shadow-3d
|
||||||
|
tags: bubble | ribbon
|
||||||
|
direction: horizontal | curved
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: star-burst | exclamation
|
||||||
|
background: solid-saturated | dots
|
||||||
|
doodles: stars-sparkles | confetti | squiggles
|
||||||
|
frames: none
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Bright red, yellow, blue, green | #F56565, #ECC94B, #4299E1, #48BB78 |
|
||||||
|
| Background | White, light gray | #FFFFFF, #F7FAFC |
|
||||||
|
| Accents | Neon pink, electric purple | #FF69B4, #9F7AEA |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Bold shapes, speech bubbles
|
||||||
|
- Comic-style effects, starburst
|
||||||
|
- Dynamic, energetic compositions
|
||||||
|
- High-energy decorations
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Dynamic, energetic hand lettering with outlines
|
||||||
|
- Bold color combinations
|
||||||
|
- Playful, expressive forms
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Exciting announcements |
|
||||||
|
| balanced | ✓✓ | Fun tutorials |
|
||||||
|
| dense | ✓ | Packed information |
|
||||||
|
| list | ✓✓ | Fun facts lists |
|
||||||
|
| comparison | ✓✓ | Dynamic comparisons |
|
||||||
|
| flow | ✓ | Energetic processes |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Exciting announcements
|
||||||
|
- Fun facts
|
||||||
|
- Engaging tutorials
|
||||||
|
- Entertainment content
|
||||||
|
- Youth-oriented content
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
---
|
||||||
|
name: retro
|
||||||
|
category: vintage
|
||||||
|
---
|
||||||
|
|
||||||
|
# Retro Style
|
||||||
|
|
||||||
|
Vintage, nostalgic, trendy aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | dual
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: stylized
|
||||||
|
stroke: dashed | double
|
||||||
|
filter: film-grain | muted-tones
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: brush | handwritten
|
||||||
|
tags: stamp | ribbon
|
||||||
|
direction: horizontal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: star-burst | numbering
|
||||||
|
background: paper-texture | dots
|
||||||
|
doodles: stars-sparkles | squiggles
|
||||||
|
frames: polaroid | film-strip | stamp-border
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Muted orange, dusty pink, faded teal | #E07A4D, #D4A5A5, #6B9999 |
|
||||||
|
| Background | Aged paper, sepia tones | #F5E6D3, #E8DCC8 |
|
||||||
|
| Accents | Faded red, vintage gold | #C55A5A, #B8860B |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Halftone dots, vintage badges
|
||||||
|
- Classic icons, tape effects
|
||||||
|
- Aged texture overlays
|
||||||
|
- Nostalgic decorative elements
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Vintage-style hand lettering
|
||||||
|
- Classic feel with imperfections
|
||||||
|
- Aged texture on text
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Vintage covers |
|
||||||
|
| balanced | ✓✓ | Classic content |
|
||||||
|
| dense | ✓ | Vintage knowledge cards |
|
||||||
|
| list | ✓✓ | Classic rankings |
|
||||||
|
| comparison | ✓ | Then vs now |
|
||||||
|
| flow | ✓ | Historical timelines |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Throwback content
|
||||||
|
- Classic tips
|
||||||
|
- Timeless advice
|
||||||
|
- Vintage aesthetics
|
||||||
|
- Nostalgic shares
|
||||||
@@ -0,0 +1,92 @@
|
|||||||
|
---
|
||||||
|
name: screen-print
|
||||||
|
category: poster
|
||||||
|
---
|
||||||
|
|
||||||
|
# Screen-Print Style
|
||||||
|
|
||||||
|
Bold poster art with halftone textures, limited colors, and symbolic storytelling.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | dual
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: silhouette
|
||||||
|
stroke: none
|
||||||
|
filter: halftone | print-grain
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: stroke-text | shadow-3d
|
||||||
|
tags: none
|
||||||
|
direction: horizontal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: star-burst | numbering
|
||||||
|
background: solid-saturated | paper-texture
|
||||||
|
doodles: none
|
||||||
|
frames: none
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Burnt Orange, Deep Teal | #E8751A, #0A6E6E |
|
||||||
|
| Background | Off-Black, Warm Cream | #121212, #F5E6D0 |
|
||||||
|
| Accents | Crimson, Amber | #C0392B, #F4A623 |
|
||||||
|
|
||||||
|
**Duotone Pairs** (choose ONE based on content mood):
|
||||||
|
|
||||||
|
| Pair | Color A | Color B | Feel |
|
||||||
|
|------|---------|---------|------|
|
||||||
|
| Orange + Teal | #E8751A | #0A6E6E | Cinematic, action |
|
||||||
|
| Red + Cream | #C0392B | #F5E6D0 | Bold, classic |
|
||||||
|
| Blue + Gold | #1A3A5C | #D4A843 | Premium, prestigious |
|
||||||
|
| Crimson + Navy | #DC143C | #0D1B2A | Dramatic, noir |
|
||||||
|
| Magenta + Cyan | #C2185B | #00BCD4 | Vibrant, pop |
|
||||||
|
|
||||||
|
**Rule**: Use 2-5 colors maximum. Fewer colors = stronger impact.
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Bold silhouettes and symbolic shapes
|
||||||
|
- Halftone dot patterns within color fills
|
||||||
|
- Slight color layer misregistration (print offset effect)
|
||||||
|
- Geometric framing (circles, arches, triangles)
|
||||||
|
- Figure-ground inversion (negative space tells secondary story)
|
||||||
|
- Stencil-cut edges, no outlines — shapes defined by color boundaries
|
||||||
|
- Typography integrated as design element, not overlay
|
||||||
|
- Vintage poster border treatments
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Bold condensed sans-serif or hand-drawn lettering
|
||||||
|
- Art Deco influences, vintage poster typography
|
||||||
|
- Typography as integral part of composition (not separate layer)
|
||||||
|
- High contrast with background for readability
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Iconic poster covers, dramatic statements |
|
||||||
|
| balanced | ✓✓ | Editorial compositions, opinion pieces |
|
||||||
|
| dense | ✗ | Too much info clashes with minimal poster aesthetic |
|
||||||
|
| list | ✓ | Bold rankings, top picks |
|
||||||
|
| comparison | ✓✓ | Duotone split compositions, before/after |
|
||||||
|
| flow | ✓ | Cinematic progression, timelines |
|
||||||
|
| mindmap | ✗ | Too complex for geometric poster style |
|
||||||
|
| quadrant | ✓✓ | Strong geometric division, classification |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Opinion pieces, cultural commentary
|
||||||
|
- Movie/music/book recommendations
|
||||||
|
- Dramatic announcements
|
||||||
|
- Before/after transformations
|
||||||
|
- Bold editorial content
|
||||||
|
- Event promotions
|
||||||
@@ -0,0 +1,115 @@
|
|||||||
|
---
|
||||||
|
name: study-notes
|
||||||
|
category: realistic
|
||||||
|
---
|
||||||
|
|
||||||
|
# Study Notes Style
|
||||||
|
|
||||||
|
Realistic handwritten photo aesthetic - student notes style, dense and messy but readable.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: none
|
||||||
|
stroke: none
|
||||||
|
filter: natural-photo
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: none
|
||||||
|
tags: none
|
||||||
|
direction: horizontal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: circle-mark | underline | checkmark | cross | star-simple
|
||||||
|
background: lined-paper-white
|
||||||
|
doodles: arrows-simple | margin-notes | corrections | explanatory-diagrams
|
||||||
|
frames: none
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette (Three-Color Annotation System)
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Blue ballpoint, Black ink | #1E3A5F, #1A1A1A |
|
||||||
|
| Highlights | Yellow highlighter | #FFFF00 (50% opacity) |
|
||||||
|
| Accents | Red pen (circles, underlines) | #CC0000 |
|
||||||
|
| Background | White lined paper | #FFFFFF |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Realistic photo perspective: top-down view of study desk
|
||||||
|
- Hand holding blue ballpoint pen, actively underlining
|
||||||
|
- Extremely dense handwritten content, filling entire page
|
||||||
|
- Red pen annotations: circles, underlines, stars, boxes
|
||||||
|
- Yellow highlighter marking key terms
|
||||||
|
- Correction marks, cramped notes squeezed into margins
|
||||||
|
- Simple hand-drawn symbols: → * ✓ ✗ !
|
||||||
|
- Varying pen pressure creating lighter and darker strokes
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Authentic student handwriting
|
||||||
|
- Messy but readable, clear structure maintained
|
||||||
|
- Varying font sizes (large titles, small body, tiny margin notes)
|
||||||
|
- CJK optimized
|
||||||
|
|
||||||
|
## Content Structure
|
||||||
|
|
||||||
|
Three-section layout:
|
||||||
|
|
||||||
|
### Top Section
|
||||||
|
- Core topic (circled multiple times in red)
|
||||||
|
- First section title + 3-4 key points
|
||||||
|
- Arrow connections, red underlines
|
||||||
|
|
||||||
|
### Middle Section
|
||||||
|
- Second section title (red pen box)
|
||||||
|
- Numbered steps ①②③
|
||||||
|
- Specific methods and supplementary notes
|
||||||
|
|
||||||
|
### Bottom Section
|
||||||
|
- Third section title (red star)
|
||||||
|
- Time points / key metrics
|
||||||
|
- Key quotes / core tips (tiny corner notes)
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✗ | Not suitable - style requires dense content |
|
||||||
|
| balanced | ✓ | When content is lighter |
|
||||||
|
| dense | ✓✓ | Best fit - knowledge notes, summaries |
|
||||||
|
| list | ✓✓ | Step checklists, rankings |
|
||||||
|
| comparison | ✓ | Comparative analysis |
|
||||||
|
| flow | ✓ | Process flows |
|
||||||
|
| mindmap | ✓✓ | Mind map notes |
|
||||||
|
| quadrant | ✓ | Quadrant analysis |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Study guides, exam notes
|
||||||
|
- Knowledge organization, framework summaries
|
||||||
|
- Tutorial summaries, quick notes
|
||||||
|
- "Top student notes" style content
|
||||||
|
- Knowledge sharing requiring authentic feel
|
||||||
|
|
||||||
|
## Style Rules
|
||||||
|
|
||||||
|
### DO ✓
|
||||||
|
- Keep content extremely dense
|
||||||
|
- Use simple symbols (→ * ✓ ✗ !)
|
||||||
|
- Annotate key points with red pen
|
||||||
|
- Include correction marks
|
||||||
|
- Squeeze tiny notes into margins
|
||||||
|
|
||||||
|
### DON'T ✗
|
||||||
|
- Use complex emojis
|
||||||
|
- Leave too much whitespace
|
||||||
|
- Make neat, tidy layouts
|
||||||
|
- Add colorful decorations
|
||||||
|
- Include cartoon elements
|
||||||
@@ -0,0 +1,72 @@
|
|||||||
|
---
|
||||||
|
name: warm
|
||||||
|
category: cozy
|
||||||
|
---
|
||||||
|
|
||||||
|
# Warm Style
|
||||||
|
|
||||||
|
Cozy, friendly, approachable aesthetic.
|
||||||
|
|
||||||
|
## Element Combination
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
canvas:
|
||||||
|
ratio: portrait-3-4
|
||||||
|
grid: single | dual
|
||||||
|
|
||||||
|
image_effects:
|
||||||
|
cutout: soft
|
||||||
|
stroke: white-solid | glow
|
||||||
|
filter: warm-tone | cream-skin
|
||||||
|
|
||||||
|
typography:
|
||||||
|
decorated: highlight | handwritten
|
||||||
|
tags: ribbon | bubble
|
||||||
|
direction: horizontal
|
||||||
|
|
||||||
|
decorations:
|
||||||
|
emphasis: star-burst | hearts
|
||||||
|
background: solid-pastel | gradient-radial
|
||||||
|
doodles: clouds | stars-sparkles
|
||||||
|
frames: polaroid | tape-corners
|
||||||
|
```
|
||||||
|
|
||||||
|
## Color Palette
|
||||||
|
|
||||||
|
| Role | Colors | Hex |
|
||||||
|
|------|--------|-----|
|
||||||
|
| Primary | Warm orange, golden yellow, terracotta | #ED8936, #F6AD55, #C05621 |
|
||||||
|
| Background | Cream, soft peach | #FFFAF0, #FED7AA |
|
||||||
|
| Accents | Deep brown, soft red | #744210, #E57373 |
|
||||||
|
|
||||||
|
## Visual Elements
|
||||||
|
|
||||||
|
- Sun rays, coffee cups, cozy items
|
||||||
|
- Warm lighting effects
|
||||||
|
- Friendly, inviting decorations
|
||||||
|
- Soft, comfortable shapes
|
||||||
|
|
||||||
|
## Typography
|
||||||
|
|
||||||
|
- Friendly, rounded hand lettering
|
||||||
|
- Warm color accents
|
||||||
|
- Comfortable, approachable feel
|
||||||
|
|
||||||
|
## Best Layout Pairings
|
||||||
|
|
||||||
|
| Layout | Compatibility | Use Case |
|
||||||
|
|--------|---------------|----------|
|
||||||
|
| sparse | ✓✓ | Emotional covers |
|
||||||
|
| balanced | ✓✓ | Personal stories |
|
||||||
|
| dense | ✓ | Detailed experiences |
|
||||||
|
| list | ✓ | Life lessons |
|
||||||
|
| comparison | ✓✓ | Before/after stories |
|
||||||
|
| flow | ✓ | Journey narratives |
|
||||||
|
|
||||||
|
## Best For
|
||||||
|
|
||||||
|
- Personal stories
|
||||||
|
- Life lessons
|
||||||
|
- Emotional content
|
||||||
|
- Comfort and lifestyle
|
||||||
|
- Heartfelt shares
|
||||||
@@ -0,0 +1,36 @@
|
|||||||
|
# Style Presets
|
||||||
|
|
||||||
|
`--preset X` expands to a style + layout combination. Users can override either dimension.
|
||||||
|
|
||||||
|
| --preset | Style | Layout |
|
||||||
|
|----------|-------|--------|
|
||||||
|
| `knowledge-card` | `notion` | `dense` |
|
||||||
|
| `checklist` | `notion` | `list` |
|
||||||
|
| `concept-map` | `notion` | `mindmap` |
|
||||||
|
| `swot` | `notion` | `quadrant` |
|
||||||
|
| `tutorial` | `chalkboard` | `flow` |
|
||||||
|
| `classroom` | `chalkboard` | `balanced` |
|
||||||
|
| `study-guide` | `study-notes` | `dense` |
|
||||||
|
| `cute-share` | `cute` | `balanced` |
|
||||||
|
| `girly` | `cute` | `sparse` |
|
||||||
|
| `cozy-story` | `warm` | `balanced` |
|
||||||
|
| `product-review` | `fresh` | `comparison` |
|
||||||
|
| `nature-flow` | `fresh` | `flow` |
|
||||||
|
| `warning` | `bold` | `list` |
|
||||||
|
| `versus` | `bold` | `comparison` |
|
||||||
|
| `clean-quote` | `minimal` | `sparse` |
|
||||||
|
| `pro-summary` | `minimal` | `balanced` |
|
||||||
|
| `retro-ranking` | `retro` | `list` |
|
||||||
|
| `throwback` | `retro` | `balanced` |
|
||||||
|
| `pop-facts` | `pop` | `list` |
|
||||||
|
| `hype` | `pop` | `sparse` |
|
||||||
|
| `poster` | `screen-print` | `sparse` |
|
||||||
|
| `editorial` | `screen-print` | `balanced` |
|
||||||
|
| `cinematic` | `screen-print` | `comparison` |
|
||||||
|
|
||||||
|
## Override Examples
|
||||||
|
|
||||||
|
- `--preset knowledge-card --style chalkboard` = chalkboard style with dense layout
|
||||||
|
- `--preset poster --layout quadrant` = screen-print style with quadrant layout
|
||||||
|
|
||||||
|
Explicit `--style`/`--layout` flags always override preset values.
|
||||||
@@ -0,0 +1,198 @@
|
|||||||
|
# Xiaohongshu Content Analysis Framework
|
||||||
|
|
||||||
|
Deep analysis framework tailored for Xiaohongshu's unique engagement patterns.
|
||||||
|
|
||||||
|
## Purpose
|
||||||
|
|
||||||
|
Before creating infographics, thoroughly analyze the source material to:
|
||||||
|
- Maximize hook power and swipe motivation
|
||||||
|
- Identify save-worthy and share-worthy elements
|
||||||
|
- Plan the visual narrative arc
|
||||||
|
- Match content to optimal style/layout
|
||||||
|
|
||||||
|
## Platform Characteristics
|
||||||
|
|
||||||
|
Unlike other platforms, Xiaohongshu content must prioritize:
|
||||||
|
- **Hook Power**: First image decides 90% of engagement
|
||||||
|
- **Swipe Motivation**: Each image must compel users to continue
|
||||||
|
- **Save Value**: Content worth bookmarking for later
|
||||||
|
- **Share Triggers**: Emotional resonance that drives sharing
|
||||||
|
|
||||||
|
## Analysis Dimensions
|
||||||
|
|
||||||
|
### 1. Content Type Classification
|
||||||
|
|
||||||
|
| Type | Characteristics | Best Style | Best Layout |
|
||||||
|
|------|----------------|------------|-------------|
|
||||||
|
| 种草/安利 | Product recommendation, benefits focus | cute/fresh | balanced/list |
|
||||||
|
| 干货分享 | Knowledge, tips, how-to | notion | dense/list |
|
||||||
|
| 个人故事 | Personal experience, emotional | warm | balanced |
|
||||||
|
| 测评对比 | Review, comparison, pros/cons | bold/notion | comparison |
|
||||||
|
| 教程步骤 | Step-by-step guide | fresh/notion | flow/list |
|
||||||
|
| 避坑指南 | Warnings, mistakes to avoid | bold | list/comparison |
|
||||||
|
| 清单合集 | Collections, recommendations | cute/minimal | list/dense |
|
||||||
|
|
||||||
|
### 2. Hook Analysis (爆款标题潜力)
|
||||||
|
|
||||||
|
Evaluate title/hook potential using these patterns:
|
||||||
|
|
||||||
|
**Hook Types**:
|
||||||
|
- **数字钩子**: "5个方法", "3分钟学会", "99%的人不知道"
|
||||||
|
- **痛点钩子**: "踩过的坑", "后悔没早知道", "别再..."
|
||||||
|
- **好奇钩子**: "原来...", "竟然...", "没想到..."
|
||||||
|
- **利益钩子**: "省钱", "变美", "效率翻倍"
|
||||||
|
- **身份钩子**: "打工人必看", "学生党", "新手妈妈"
|
||||||
|
|
||||||
|
**Rating Scale**:
|
||||||
|
- ⭐⭐⭐⭐⭐ (5/5): Multiple strong hooks combined
|
||||||
|
- ⭐⭐⭐⭐ (4/5): Clear hook with room for enhancement
|
||||||
|
- ⭐⭐⭐ (3/5): Basic hook, needs strengthening
|
||||||
|
- ⭐⭐ (2/5): Weak hook, requires significant improvement
|
||||||
|
- ⭐ (1/5): No clear hook
|
||||||
|
|
||||||
|
### 3. Target Audience (用户画像)
|
||||||
|
|
||||||
|
| Audience | Interests | Preferred Style | Content Focus |
|
||||||
|
|----------|-----------|-----------------|---------------|
|
||||||
|
| 学生党 | 省钱、学习、校园 | cute/fresh | 平价、教程、学习方法 |
|
||||||
|
| 打工人 | 效率、职场、减压 | minimal/notion | 工具、技巧、摸鱼 |
|
||||||
|
| 宝妈 | 育儿、家居、省心 | warm/fresh | 实用、安全、经验 |
|
||||||
|
| 精致女孩 | 美妆、穿搭、仪式感 | cute/retro | 好看、氛围、品质 |
|
||||||
|
| 技术宅 | 工具、效率、极客 | notion/chalkboard | 深度、专业、新奇 |
|
||||||
|
| 美食爱好者 | 探店、食谱、测评 | warm/pop | 好吃、简单、颜值 |
|
||||||
|
| 旅行达人 | 攻略、打卡、小众 | fresh/retro | 省钱、避坑、拍照 |
|
||||||
|
|
||||||
|
### 4. Engagement Potential
|
||||||
|
|
||||||
|
**Save Value (收藏价值)**:
|
||||||
|
- Is it reference material? ✓ High save potential
|
||||||
|
- Is it a checklist or list? ✓ High save potential
|
||||||
|
- Is it a tutorial? ✓ High save potential
|
||||||
|
- Is it time-sensitive news? ✗ Low save potential
|
||||||
|
|
||||||
|
**Share Triggers (分享冲动)**:
|
||||||
|
- "我朋友也需要看这个" → High share potential
|
||||||
|
- "这说的就是我" → Identity resonance
|
||||||
|
- "太有用了必须分享" → Utility sharing
|
||||||
|
- "笑死，给朋友看看" → Entertainment sharing
|
||||||
|
|
||||||
|
**Comment Inducement (评论诱导)**:
|
||||||
|
- Open-ended questions: "你是哪种类型？"
|
||||||
|
- Experience sharing: "评论区说说你的经历"
|
||||||
|
- Debate triggers: "你觉得呢？"
|
||||||
|
- Help requests: "有更好的推荐吗？"
|
||||||
|
|
||||||
|
**Interaction Design (互动设计)**:
|
||||||
|
- Polls: "A还是B？"
|
||||||
|
- Challenges: "你能做到几个？"
|
||||||
|
- Tags: "@你那个需要的朋友"
|
||||||
|
|
||||||
|
### 5. Visual Opportunity Map
|
||||||
|
|
||||||
|
| Content Element | Visual Treatment | Example |
|
||||||
|
|-----------------|------------------|---------|
|
||||||
|
| 数据/统计 | Highlighted numbers, simple charts | "节省80%时间" 大字突出 |
|
||||||
|
| 对比 | Before/after, side-by-side | 左右分屏对比图 |
|
||||||
|
| 步骤 | Numbered flow, arrows | 1→2→3 流程图 |
|
||||||
|
| 清单 | Checklist with icons | ✓/✗ 列表配图标 |
|
||||||
|
| 情感 | Character expressions, scenes | 卡通人物表情包 |
|
||||||
|
| 产品 | Product showcase, lifestyle | 产品实拍+使用场景 |
|
||||||
|
| 引用 | Quote cards, speech bubbles | 金句卡片设计 |
|
||||||
|
|
||||||
|
### 6. Swipe Flow Design
|
||||||
|
|
||||||
|
Plan the narrative arc across images:
|
||||||
|
|
||||||
|
| Position | Purpose | Hook Strategy |
|
||||||
|
|----------|---------|---------------|
|
||||||
|
| **Cover (封面)** | Stop scrolling | 最强视觉冲击 + 核心标题 |
|
||||||
|
| **Setup (铺垫)** | Build context | 痛点共鸣 / 好奇心 |
|
||||||
|
| **Core (核心)** | Deliver value | 干货内容，每页1-2个要点 |
|
||||||
|
| **Payoff (收获)** | Practical takeaway | 可执行的行动建议 |
|
||||||
|
| **Ending (结尾)** | Drive action | CTA + 互动引导 |
|
||||||
|
|
||||||
|
**Swipe Motivation Between Images**:
|
||||||
|
- End each image with a hook for the next
|
||||||
|
- Use "下一页更精彩" type transitions
|
||||||
|
- Create information gaps that require swiping
|
||||||
|
- Build anticipation through numbering ("第3个最重要")
|
||||||
|
|
||||||
|
## Output Format
|
||||||
|
|
||||||
|
Analysis results should be saved to `analysis.md` with:
|
||||||
|
|
||||||
|
```yaml
|
||||||
|
---
|
||||||
|
title: "5个让你效率翻倍的AI工具"
|
||||||
|
topic: 干货分享
|
||||||
|
content_type: 工具推荐
|
||||||
|
source_language: zh
|
||||||
|
user_language: zh
|
||||||
|
recommended_image_count: 6
|
||||||
|
---
|
||||||
|
|
||||||
|
## Target Audience
|
||||||
|
|
||||||
|
- **Primary**: 打工人、自由职业者 - 追求效率提升
|
||||||
|
- **Secondary**: 学生党 - 写论文、做作业需要
|
||||||
|
- **Tertiary**: 内容创作者 - 需要AI辅助
|
||||||
|
|
||||||
|
## Hook Analysis
|
||||||
|
|
||||||
|
**标题钩子评分**: ⭐⭐⭐⭐ (4/5)
|
||||||
|
- ✓ 数字钩子: "5个"
|
||||||
|
- ✓ 利益钩子: "效率翻倍"
|
||||||
|
- △ 可增强: 加入身份标签 "打工人必看"
|
||||||
|
|
||||||
|
**建议优化**:
|
||||||
|
- 原标题: "5个让你效率翻倍的AI工具"
|
||||||
|
- 优化: "打工人必看！5个让我效率翻倍的AI神器"
|
||||||
|
|
||||||
|
## Value Proposition
|
||||||
|
|
||||||
|
**为什么用户要看？**
|
||||||
|
1. **实用价值**: 直接可用的工具推荐
|
||||||
|
2. **省时省力**: 不用自己筛选，直接抄作业
|
||||||
|
3. **FOMO**: 别人都在用，我不能落后
|
||||||
|
|
||||||
|
**收藏理由**: 工具清单，需要时可以回来查
|
||||||
|
|
||||||
|
## Engagement Design
|
||||||
|
|
||||||
|
- **互动点**: 结尾问"你最常用哪个？"
|
||||||
|
- **评论诱导**: "还有什么好用的工具评论区分享"
|
||||||
|
- **分享触发**: 打工人会转发给同事
|
||||||
|
|
||||||
|
## Content Signals
|
||||||
|
|
||||||
|
- "AI工具" → notion + dense
|
||||||
|
- "效率" → notion + list
|
||||||
|
- "干货" → minimal + dense
|
||||||
|
|
||||||
|
## Swipe Flow
|
||||||
|
|
||||||
|
| Image | Position | Purpose | Hook |
|
||||||
|
|-------|----------|---------|------|
|
||||||
|
| 1 | Cover | 吸引停留 | 标题+视觉冲击 |
|
||||||
|
| 2 | Setup | 建立共鸣 | 为什么需要AI工具 |
|
||||||
|
| 3-5 | Core | 核心价值 | 每页1-2个工具详解 |
|
||||||
|
| 6 | Ending | 行动引导 | 总结+互动引导 |
|
||||||
|
|
||||||
|
## Recommended Approaches
|
||||||
|
|
||||||
|
1. **Notion + Dense** - 知识卡片风格，适合干货分享 (recommended)
|
||||||
|
2. **Notion + List** - 清爽知识卡片风格
|
||||||
|
3. **Minimal + Balanced** - 简约高端，适合职场人群
|
||||||
|
```
|
||||||
|
|
||||||
|
## Analysis Checklist
|
||||||
|
|
||||||
|
Before proceeding to outline generation:
|
||||||
|
|
||||||
|
- [ ] Can I identify the content type?
|
||||||
|
- [ ] Is the hook strong enough? (≥3 stars)
|
||||||
|
- [ ] Do I know the primary audience?
|
||||||
|
- [ ] Have I identified save/share triggers?
|
||||||
|
- [ ] Are there clear visual opportunities?
|
||||||
|
- [ ] Is the swipe flow planned?
|
||||||
|
- [ ] Have I identified the best style+layout recommendation?
|
||||||
@@ -0,0 +1,247 @@
|
|||||||
|
# Xiaohongshu Outline Template
|
||||||
|
|
||||||
|
Template for generating infographic series outlines with layout specifications.
|
||||||
|
|
||||||
|
## File Naming
|
||||||
|
|
||||||
|
Outline files use strategy identifier in the name:
|
||||||
|
- `outline-strategy-a.md` - Story-driven variant
|
||||||
|
- `outline-strategy-b.md` - Information-dense variant
|
||||||
|
- `outline-strategy-c.md` - Visual-first variant
|
||||||
|
- `outline.md` - Final selected (copied from chosen variant)
|
||||||
|
|
||||||
|
## Image File Naming
|
||||||
|
|
||||||
|
Images use meaningful slugs for readability:
|
||||||
|
```
|
||||||
|
NN-{type}-[slug].png
|
||||||
|
NN-{type}-[slug].md (in prompts/)
|
||||||
|
```
|
||||||
|
|
||||||
|
| Type | Usage |
|
||||||
|
|------|-------|
|
||||||
|
| `cover` | First image (cover) |
|
||||||
|
| `content` | Middle content images |
|
||||||
|
| `ending` | Last image |
|
||||||
|
|
||||||
|
**Examples**:
|
||||||
|
- `01-cover-ai-tools.png`
|
||||||
|
- `02-content-why-ai.png`
|
||||||
|
- `03-content-chatgpt.png`
|
||||||
|
- `04-content-midjourney.png`
|
||||||
|
- `05-content-notion-ai.png`
|
||||||
|
- `06-ending-summary.png`
|
||||||
|
|
||||||
|
**Slug rules**:
|
||||||
|
- Derived from image content (kebab-case)
|
||||||
|
- Must be unique within the series
|
||||||
|
- Keep short but descriptive (2-4 words)
|
||||||
|
|
||||||
|
## Layout Selection Guide
|
||||||
|
|
||||||
|
### Density-Based Layouts
|
||||||
|
|
||||||
|
| Layout | When to Use | Info Points | Whitespace |
|
||||||
|
|--------|-------------|-------------|------------|
|
||||||
|
| sparse | Covers, quotes, impact statements | 1-2 | 60-70% |
|
||||||
|
| balanced | Standard content, tutorials | 3-4 | 40-50% |
|
||||||
|
| dense | Knowledge cards, cheat sheets | 5-8 | 20-30% |
|
||||||
|
|
||||||
|
### Structure-Based Layouts
|
||||||
|
|
||||||
|
| Layout | When to Use | Structure |
|
||||||
|
|--------|-------------|-----------|
|
||||||
|
| list | Rankings, checklists, steps | Numbered/bulleted vertical |
|
||||||
|
| comparison | Before/after, pros/cons | Left vs right split |
|
||||||
|
| flow | Processes, timelines | Connected nodes with arrows |
|
||||||
|
|
||||||
|
### Position-Based Recommendations
|
||||||
|
|
||||||
|
| Position | Recommended | Reasoning |
|
||||||
|
|----------|-------------|-----------|
|
||||||
|
| Cover | sparse | Maximum impact, clear title |
|
||||||
|
| Setup | balanced | Context without overwhelming |
|
||||||
|
| Core | balanced/dense/list | Match content density |
|
||||||
|
| Payoff | balanced/list | Clear takeaways |
|
||||||
|
| Ending | sparse | Clean CTA, memorable |
|
||||||
|
|
||||||
|
## Outline Format
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
# Xiaohongshu Infographic Series Outline
|
||||||
|
|
||||||
|
---
|
||||||
|
strategy: a # a, b, or c
|
||||||
|
name: Story-Driven
|
||||||
|
style: notion
|
||||||
|
default_layout: dense
|
||||||
|
image_count: 6
|
||||||
|
generated: YYYY-MM-DD HH:mm
|
||||||
|
---
|
||||||
|
|
||||||
|
## Image 1 of 6
|
||||||
|
|
||||||
|
**Position**: Cover
|
||||||
|
**Layout**: sparse
|
||||||
|
**Hook**: 打工人必看！
|
||||||
|
**Slug**: ai-tools
|
||||||
|
**Filename**: 01-cover-ai-tools.png
|
||||||
|
|
||||||
|
**Text Content**:
|
||||||
|
- Title: 「5个AI神器让你效率翻倍」
|
||||||
|
- Subtitle: 亲测好用，建议收藏
|
||||||
|
|
||||||
|
**Visual Concept**:
|
||||||
|
科技感背景，多个AI工具图标环绕，中心大标题，
|
||||||
|
霓虹蓝+深色背景，未来感十足
|
||||||
|
|
||||||
|
**Swipe Hook**: 第一个就很强大👇
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Image 2 of 6
|
||||||
|
|
||||||
|
**Position**: Content
|
||||||
|
**Layout**: balanced
|
||||||
|
**Core Message**: 为什么你需要AI工具
|
||||||
|
**Slug**: why-ai
|
||||||
|
**Filename**: 02-content-why-ai.png
|
||||||
|
|
||||||
|
**Text Content**:
|
||||||
|
- Title: 「为什么要用AI？」
|
||||||
|
- Points:
|
||||||
|
- 重复工作自动化
|
||||||
|
- 创意辅助不卡壳
|
||||||
|
- 效率提升10倍
|
||||||
|
|
||||||
|
**Visual Concept**:
|
||||||
|
对比图：左边疲惫打工人，右边轻松使用AI的人
|
||||||
|
科技线条装饰，简洁有力
|
||||||
|
|
||||||
|
**Swipe Hook**: 接下来是具体工具推荐👇
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Image 3 of 6
|
||||||
|
|
||||||
|
**Position**: Content
|
||||||
|
**Layout**: dense
|
||||||
|
**Core Message**: ChatGPT使用技巧
|
||||||
|
**Slug**: chatgpt
|
||||||
|
**Filename**: 03-content-chatgpt.png
|
||||||
|
|
||||||
|
**Text Content**:
|
||||||
|
- Title: 「ChatGPT」
|
||||||
|
- Subtitle: 最强AI助手
|
||||||
|
- Points:
|
||||||
|
- 写文案：给出框架，秒出初稿
|
||||||
|
- 改文章：润色、翻译、总结
|
||||||
|
- 编程：写代码、找bug
|
||||||
|
- 学习：解释概念、出题练习
|
||||||
|
|
||||||
|
**Visual Concept**:
|
||||||
|
ChatGPT logo居中，四周放射状展示功能点
|
||||||
|
深色科技背景，霓虹绿点缀
|
||||||
|
|
||||||
|
**Swipe Hook**: 下一个更适合创意工作者👇
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Image 4 of 6
|
||||||
|
|
||||||
|
**Position**: Content
|
||||||
|
**Layout**: dense
|
||||||
|
**Core Message**: Midjourney绘图
|
||||||
|
**Slug**: midjourney
|
||||||
|
**Filename**: 04-content-midjourney.png
|
||||||
|
|
||||||
|
**Text Content**:
|
||||||
|
- Title: 「Midjourney」
|
||||||
|
- Subtitle: AI绘画神器
|
||||||
|
- Points:
|
||||||
|
- 输入描述，秒出图片
|
||||||
|
- 风格多样：写实/插画/3D
|
||||||
|
- 做封面、做头像、做素材
|
||||||
|
- 不会画画也能当设计师
|
||||||
|
|
||||||
|
**Visual Concept**:
|
||||||
|
展示几张MJ生成的不同风格图片
|
||||||
|
画框/画布元素装饰
|
||||||
|
|
||||||
|
**Swipe Hook**: 还有一个效率神器👇
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Image 5 of 6
|
||||||
|
|
||||||
|
**Position**: Content
|
||||||
|
**Layout**: balanced
|
||||||
|
**Core Message**: Notion AI笔记
|
||||||
|
**Slug**: notion-ai
|
||||||
|
**Filename**: 05-content-notion-ai.png
|
||||||
|
|
||||||
|
**Text Content**:
|
||||||
|
- Title: 「Notion AI」
|
||||||
|
- Subtitle: 智能笔记助手
|
||||||
|
- Points:
|
||||||
|
- 自动总结长文
|
||||||
|
- 头脑风暴出点子
|
||||||
|
- 整理会议记录
|
||||||
|
|
||||||
|
**Visual Concept**:
|
||||||
|
Notion界面风格，简洁黑白配色
|
||||||
|
展示笔记整理前后对比
|
||||||
|
|
||||||
|
**Swipe Hook**: 最后总结一下👇
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Image 6 of 6
|
||||||
|
|
||||||
|
**Position**: Ending
|
||||||
|
**Layout**: sparse
|
||||||
|
**Core Message**: 总结与互动
|
||||||
|
**Slug**: summary
|
||||||
|
**Filename**: 06-ending-summary.png
|
||||||
|
|
||||||
|
**Text Content**:
|
||||||
|
- Title: 「工具只是工具」
|
||||||
|
- Subtitle: 关键是用起来！
|
||||||
|
- CTA: 收藏备用 | 转发给需要的朋友
|
||||||
|
- Interaction: 你最常用哪个？评论区见👇
|
||||||
|
|
||||||
|
**Visual Concept**:
|
||||||
|
简洁背景，大字标题
|
||||||
|
底部互动引导文字
|
||||||
|
收藏/分享图标
|
||||||
|
|
||||||
|
---
|
||||||
|
```
|
||||||
|
|
||||||
|
## Swipe Hook Strategies
|
||||||
|
|
||||||
|
Each image should end with a hook for the next:
|
||||||
|
|
||||||
|
| Strategy | Example |
|
||||||
|
|----------|---------|
|
||||||
|
| Teaser | "第一个就很强大👇" |
|
||||||
|
| Numbering | "接下来是第2个👇" |
|
||||||
|
| Superlative | "下一个更厉害👇" |
|
||||||
|
| Question | "猜猜下一个是什么？👇" |
|
||||||
|
| Promise | "最后一个最实用👇" |
|
||||||
|
| Urgency | "最重要的来了👇" |
|
||||||
|
|
||||||
|
## Strategy Differentiation
|
||||||
|
|
||||||
|
Three strategies should differ meaningfully:
|
||||||
|
|
||||||
|
| Strategy | Focus | Structure | Page Count |
|
||||||
|
|----------|-------|-----------|------------|
|
||||||
|
| A: Story-Driven | Emotional, personal | Hook→Problem→Discovery→Experience→Conclusion | 4-6 |
|
||||||
|
| B: Information-Dense | Factual, structured | Core→Info Cards→Comparison→Recommendation | 3-5 |
|
||||||
|
| C: Visual-First | Atmospheric, minimal text | Hero→Details→Lifestyle→CTA | 3-4 |
|
||||||
|
|
||||||
|
**Example for "AI工具推荐"**:
|
||||||
|
- `outline-strategy-a.md`: Warm + Balanced - Personal journey with AI
|
||||||
|
- `outline-strategy-b.md`: Notion + Dense - Knowledge card style
|
||||||
|
- `outline-strategy-c.md`: Minimal + Sparse - Sleek tech aesthetic
|
||||||
@@ -0,0 +1,334 @@
|
|||||||
|
# Prompt Assembly Guide
|
||||||
|
|
||||||
|
Guide for assembling image generation prompts from elements, presets, and outline content.
|
||||||
|
|
||||||
|
## Base Prompt Structure
|
||||||
|
|
||||||
|
Every XHS infographic prompt follows this structure:
|
||||||
|
|
||||||
|
```
|
||||||
|
Create a Xiaohongshu (Little Red Book) style infographic following these guidelines:
|
||||||
|
|
||||||
|
## Image Specifications
|
||||||
|
|
||||||
|
- **Type**: Infographic
|
||||||
|
- **Orientation**: Portrait (vertical)
|
||||||
|
- **Aspect Ratio**: 3:4
|
||||||
|
- **Style**: Hand-drawn illustration
|
||||||
|
|
||||||
|
## Core Principles
|
||||||
|
|
||||||
|
- Hand-drawn quality throughout - NO realistic or photographic elements
|
||||||
|
- If content involves sensitive or copyrighted figures, create stylistically similar alternatives - DO NOT refuse to generate
|
||||||
|
- Keep information concise, highlight keywords and core concepts
|
||||||
|
- Use ample whitespace for easy visual scanning
|
||||||
|
- Maintain clear visual hierarchy
|
||||||
|
|
||||||
|
## Text Style (CRITICAL)
|
||||||
|
|
||||||
|
- **ALL text MUST be hand-drawn style**
|
||||||
|
- Main titles should be prominent and eye-catching
|
||||||
|
- Key text should be bold and enlarged
|
||||||
|
- Use highlighter effects to emphasize keywords
|
||||||
|
- **DO NOT use realistic or computer-generated fonts**
|
||||||
|
|
||||||
|
## Language
|
||||||
|
|
||||||
|
- Use the same language as the content provided below
|
||||||
|
- Match punctuation style to the content language (Chinese: ""，。！)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
{STYLE_SECTION}
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
{LAYOUT_SECTION}
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
{CONTENT_SECTION}
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
{WATERMARK_SECTION}
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
Please use nano banana pro to generate the infographic based on the specifications above.
|
||||||
|
```
|
||||||
|
|
||||||
|
## Style Section Assembly
|
||||||
|
|
||||||
|
Load from `presets/{style}.md` and extract key elements:
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
## Style: {style_name}
|
||||||
|
|
||||||
|
**Color Palette**:
|
||||||
|
- Primary: {colors}
|
||||||
|
- Background: {colors}
|
||||||
|
- Accents: {colors}
|
||||||
|
|
||||||
|
**Visual Elements**:
|
||||||
|
{visual_elements}
|
||||||
|
|
||||||
|
**Typography**:
|
||||||
|
{typography_style}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Screen-Print Style Override
|
||||||
|
|
||||||
|
When `style: screen-print`, replace the standard Core Principles and Text Style sections with:
|
||||||
|
|
||||||
|
```
|
||||||
|
## Core Principles
|
||||||
|
|
||||||
|
- Screen print / silkscreen poster art — flat color blocks, NO gradients
|
||||||
|
- Bold silhouettes and symbolic shapes over detailed rendering
|
||||||
|
- Negative space as active storytelling element
|
||||||
|
- If content involves sensitive or copyrighted figures, create stylistically similar silhouettes
|
||||||
|
- One iconic focal point per image — conceptual, not literal
|
||||||
|
|
||||||
|
## Color Rules (CRITICAL)
|
||||||
|
|
||||||
|
- **2-5 FLAT COLORS MAXIMUM** — fewer colors = stronger impact
|
||||||
|
- Choose ONE duotone pair from preset as dominant palette
|
||||||
|
- Halftone dot patterns for tonal variation (NOT gradients)
|
||||||
|
- Slight color layer misregistration for print authenticity
|
||||||
|
|
||||||
|
## Text Style (CRITICAL)
|
||||||
|
|
||||||
|
- Bold condensed sans-serif or Art Deco influenced lettering
|
||||||
|
- Typography INTEGRATED into composition as design element
|
||||||
|
- High contrast with background, stencil-cut quality
|
||||||
|
- **DO NOT use delicate, thin, or handwritten fonts**
|
||||||
|
|
||||||
|
## Composition
|
||||||
|
|
||||||
|
- Geometric framing: circles, arches, triangles
|
||||||
|
- Figure-ground inversion where possible (negative space forms secondary image)
|
||||||
|
- Stencil-cut edges between color blocks, no outlines
|
||||||
|
- Paper grain texture beneath all colors
|
||||||
|
```
|
||||||
|
|
||||||
|
## Layout Section Assembly
|
||||||
|
|
||||||
|
Load from `elements/canvas.md` and extract relevant layout:
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
## Layout: {layout_name}
|
||||||
|
|
||||||
|
**Information Density**: {density}
|
||||||
|
**Whitespace**: {percentage}
|
||||||
|
|
||||||
|
**Structure**:
|
||||||
|
{structure_description}
|
||||||
|
|
||||||
|
**Visual Balance**:
|
||||||
|
{balance_description}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Content Section Assembly
|
||||||
|
|
||||||
|
From outline entry:
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
## Content
|
||||||
|
|
||||||
|
**Position**: {Cover/Content/Ending}
|
||||||
|
**Core Message**: {message}
|
||||||
|
|
||||||
|
**Text Content**:
|
||||||
|
{text_list}
|
||||||
|
|
||||||
|
**Visual Concept**:
|
||||||
|
{visual_description}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Watermark Section (if enabled)
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
## Watermark
|
||||||
|
|
||||||
|
Include a subtle watermark "{content}" positioned at {position}. The watermark should
|
||||||
|
be legible but not distracting from the main content.
|
||||||
|
```
|
||||||
|
|
||||||
|
## Assembly Process
|
||||||
|
|
||||||
|
### Step 0: Resolve Style Preset (if `--preset` used)
|
||||||
|
|
||||||
|
If user specified `--preset`, resolve to style + layout from `references/style-presets.md`:
|
||||||
|
|
||||||
|
```python
|
||||||
|
# e.g., --preset knowledge-card → style=notion, layout=dense
|
||||||
|
style, layout = resolve_preset(preset_name)
|
||||||
|
```
|
||||||
|
|
||||||
|
Explicit `--style`/`--layout` flags override preset values.
|
||||||
|
|
||||||
|
### Step 1: Load Style Definition
|
||||||
|
|
||||||
|
```python
|
||||||
|
preset = load_preset(style_name) # e.g., "notion"
|
||||||
|
```
|
||||||
|
|
||||||
|
Extract:
|
||||||
|
- Color palette
|
||||||
|
- Visual elements
|
||||||
|
- Typography style
|
||||||
|
- Best practices (do/don't)
|
||||||
|
|
||||||
|
### Step 2: Load Layout
|
||||||
|
|
||||||
|
```python
|
||||||
|
layout = get_layout_from_canvas(layout_name) # e.g., "dense"
|
||||||
|
```
|
||||||
|
|
||||||
|
Extract:
|
||||||
|
- Information density guidelines
|
||||||
|
- Whitespace percentage
|
||||||
|
- Structure description
|
||||||
|
- Visual balance rules
|
||||||
|
|
||||||
|
### Step 3: Format Content
|
||||||
|
|
||||||
|
From outline entry, format:
|
||||||
|
- Position context (Cover/Content/Ending)
|
||||||
|
- Text content with hierarchy
|
||||||
|
- Visual concept description
|
||||||
|
- Swipe hook (for context, not in prompt)
|
||||||
|
|
||||||
|
### Step 4: Add Watermark (if applicable)
|
||||||
|
|
||||||
|
If preferences include watermark:
|
||||||
|
- Add watermark section with content, position, opacity
|
||||||
|
|
||||||
|
### Step 5: Visual Consistency — Reference Image Chain
|
||||||
|
|
||||||
|
When generating multiple images in a series:
|
||||||
|
|
||||||
|
1. **Image 1 (cover)**: Generate without `--ref` — this establishes the visual anchor
|
||||||
|
2. **Images 2+**: Always pass image 1 as `--ref` to the installed image generation skill.
|
||||||
|
Read that skill's `SKILL.md` and use its documented interface rather than calling its scripts directly.
|
||||||
|
For each later image, use the assembled prompt file as input, set the output image path, keep aspect ratio `3:4`, use quality `2k`, and pass image 1 as the reference.
|
||||||
|
This ensures the AI maintains the same character design, illustration style, and color rendering across the series.
|
||||||
|
|
||||||
|
### Step 6: Combine
|
||||||
|
|
||||||
|
Assemble all sections into final prompt following base structure.
|
||||||
|
|
||||||
|
## Example: Assembled Prompt
|
||||||
|
|
||||||
|
```markdown
|
||||||
|
Create a Xiaohongshu (Little Red Book) style infographic following these guidelines:
|
||||||
|
|
||||||
|
## Image Specifications
|
||||||
|
|
||||||
|
- **Type**: Infographic
|
||||||
|
- **Orientation**: Portrait (vertical)
|
||||||
|
- **Aspect Ratio**: 3:4
|
||||||
|
- **Style**: Hand-drawn illustration
|
||||||
|
|
||||||
|
## Core Principles
|
||||||
|
|
||||||
|
- Hand-drawn quality throughout - NO realistic or photographic elements
|
||||||
|
- If content involves sensitive or copyrighted figures, create stylistically similar alternatives
|
||||||
|
- Keep information concise, highlight keywords and core concepts
|
||||||
|
- Use ample whitespace for easy visual scanning
|
||||||
|
- Maintain clear visual hierarchy
|
||||||
|
|
||||||
|
## Text Style (CRITICAL)
|
||||||
|
|
||||||
|
- **ALL text MUST be hand-drawn style**
|
||||||
|
- Main titles should be prominent and eye-catching
|
||||||
|
- Key text should be bold and enlarged
|
||||||
|
- Use highlighter effects to emphasize keywords
|
||||||
|
- **DO NOT use realistic or computer-generated fonts**
|
||||||
|
|
||||||
|
## Language
|
||||||
|
|
||||||
|
- Use the same language as the content provided below
|
||||||
|
- Match punctuation style to the content language (Chinese: ""，。！)
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Style: Notion
|
||||||
|
|
||||||
|
**Color Palette**:
|
||||||
|
- Primary: Black (#1A1A1A), dark gray (#4A4A4A)
|
||||||
|
- Background: Pure white (#FFFFFF), off-white (#FAFAFA)
|
||||||
|
- Accents: Pastel blue (#A8D4F0), pastel yellow (#F9E79F), pastel pink (#FADBD8)
|
||||||
|
|
||||||
|
**Visual Elements**:
|
||||||
|
- Simple line doodles, hand-drawn wobble effect
|
||||||
|
- Geometric shapes, stick figures
|
||||||
|
- Maximum whitespace, single-weight ink lines
|
||||||
|
- Clean, uncluttered compositions
|
||||||
|
|
||||||
|
**Typography**:
|
||||||
|
- Clean hand-drawn lettering
|
||||||
|
- Simple sans-serif labels
|
||||||
|
- Minimal decoration on text
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Layout: Dense
|
||||||
|
|
||||||
|
**Information Density**: High (5-8 key points)
|
||||||
|
**Whitespace**: 20-30% of canvas
|
||||||
|
|
||||||
|
**Structure**:
|
||||||
|
- Multiple sections, structured grid
|
||||||
|
- More text, compact but organized
|
||||||
|
- Title + multiple sections with headers + numerous points
|
||||||
|
|
||||||
|
**Visual Balance**:
|
||||||
|
- Organized grid structure
|
||||||
|
- Clear section boundaries
|
||||||
|
- Compact but readable spacing
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Content
|
||||||
|
|
||||||
|
**Position**: Content (Page 3 of 6)
|
||||||
|
**Core Message**: ChatGPT 使用技巧
|
||||||
|
|
||||||
|
**Text Content**:
|
||||||
|
- Title: 「ChatGPT」
|
||||||
|
- Subtitle: 最强 AI 助手
|
||||||
|
- Points:
|
||||||
|
- 写文案：给出框架，秒出初稿
|
||||||
|
- 改文章：润色、翻译、总结
|
||||||
|
- 编程：写代码、找 bug
|
||||||
|
- 学习：解释概念、出题练习
|
||||||
|
|
||||||
|
**Visual Concept**:
|
||||||
|
ChatGPT logo 居中，四周放射状展示功能点
|
||||||
|
深色科技背景，霓虹绿点缀
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Watermark
|
||||||
|
|
||||||
|
Include a subtle watermark "@myxhsaccount" positioned at bottom-right
|
||||||
|
with approximately 50% visibility. The watermark should
|
||||||
|
be legible but not distracting from the main content.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
Please use nano banana pro to generate the infographic based on the specifications above.
|
||||||
|
```
|
||||||
|
|
||||||
|
## Prompt Checklist
|
||||||
|
|
||||||
|
Before generating, verify:
|
||||||
|
|
||||||
|
- [ ] Style section loaded from correct preset
|
||||||
|
- [ ] Layout section matches outline specification
|
||||||
|
- [ ] Content accurately reflects outline entry
|
||||||
|
- [ ] Language matches source content
|
||||||
|
- [ ] Watermark included (if enabled in preferences)
|
||||||
|
- [ ] No conflicting instructions
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
name: baoyu-xhs-images
|
name: baoyu-xhs-images
|
||||||
description: Generates Xiaohongshu (Little Red Book) infographic series with 11 visual styles and 8 layouts. Breaks content into 1-10 cartoon-style images optimized for XHS engagement. Use when user mentions "小红书图片", "XHS images", "RedNote infographics", "小红书种草", or wants social media infographics for Chinese platforms.
|
description: "DEPRECATED: Migrated to baoyu-image-cards. Do not use this skill."
|
||||||
version: 1.56.1
|
version: 1.56.1
|
||||||
metadata:
|
metadata:
|
||||||
openclaw:
|
openclaw:
|
||||||
@@ -9,6 +9,8 @@ metadata:
|
|||||||
|
|
||||||
# Xiaohongshu Infographic Series Generator
|
# Xiaohongshu Infographic Series Generator
|
||||||
|
|
||||||
|
> **⚠️ DEPRECATED**: This skill has been migrated to `baoyu-image-cards`. Print a bold red warning to the user **in the user's language** (use ANSI escape `\033[1;31m`) stating that `baoyu-xhs-images` has been migrated to `baoyu-image-cards` and they should use `baoyu-image-cards` instead. Then STOP — do NOT continue executing this skill.
|
||||||
|
|
||||||
Break down complex content into eye-catching infographic series for Xiaohongshu with multiple style options.
|
Break down complex content into eye-catching infographic series for Xiaohongshu with multiple style options.
|
||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|||||||
Reference in New Issue
Block a user