mirror of
https://github.com/JimLiu/baoyu-skills.git
synced 2026-07-13 22:29:48 +08:00
Compare commits
7 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| e6a9b217e6 | |||
| ec1743592c | |||
| fe647a11bb | |||
| 5a11b49b00 | |||
| 04692515bb | |||
| eb54c2a2e7 | |||
| a39c8eb0bd |
@@ -6,7 +6,7 @@
|
|||||||
},
|
},
|
||||||
"metadata": {
|
"metadata": {
|
||||||
"description": "Skills shared by Baoyu for improving daily work efficiency",
|
"description": "Skills shared by Baoyu for improving daily work efficiency",
|
||||||
"version": "1.21.2"
|
"version": "1.21.4"
|
||||||
},
|
},
|
||||||
"plugins": [
|
"plugins": [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -2,6 +2,18 @@
|
|||||||
|
|
||||||
English | [中文](./CHANGELOG.zh.md)
|
English | [中文](./CHANGELOG.zh.md)
|
||||||
|
|
||||||
|
## 1.21.4 - 2026-01-25
|
||||||
|
|
||||||
|
### Fixes
|
||||||
|
- `baoyu-post-to-wechat`: adds Windows compatibility—uses `fileURLToPath` for correct path resolution, replaces system-dependent copy/paste tools (osascript/xdotool) with CDP keyboard events for cross-platform support.
|
||||||
|
- `baoyu-post-to-wechat`: fixes regressions from Windows compatibility PR—corrects broken `-fixed` filename references, restores frontmatter quote stripping, restores `--title` CLI parameter, fixes summary extraction to skip headings/quotes/lists, fixes argument parsing for single-dash flags, removes debug logs.
|
||||||
|
- `baoyu-article-illustrator`, `baoyu-cover-image`, `baoyu-xhs-images`: removes opacity option from watermark configuration.
|
||||||
|
|
||||||
|
## 1.21.3 - 2026-01-24
|
||||||
|
|
||||||
|
### Refactor
|
||||||
|
- `baoyu-article-illustrator`: simplifies SKILL.md by extracting content to reference files—adds `references/usage.md` for command syntax, `references/prompt-construction.md` for prompt templates. Reorganizes workflow from 5 to 6 steps with new Pre-check phase. Adds `default_output_dir` preference option.
|
||||||
|
|
||||||
## 1.21.2 - 2026-01-24
|
## 1.21.2 - 2026-01-24
|
||||||
|
|
||||||
### Features
|
### Features
|
||||||
|
|||||||
@@ -2,6 +2,18 @@
|
|||||||
|
|
||||||
[English](./CHANGELOG.md) | 中文
|
[English](./CHANGELOG.md) | 中文
|
||||||
|
|
||||||
|
## 1.21.4 - 2026-01-25
|
||||||
|
|
||||||
|
### 修复
|
||||||
|
- `baoyu-post-to-wechat`:新增 Windows 兼容性——使用 `fileURLToPath` 正确解析路径,将系统依赖的复制粘贴工具(osascript/xdotool)替换为 CDP 键盘事件,实现跨平台支持。
|
||||||
|
- `baoyu-post-to-wechat`:修复 Windows 兼容性 PR 引入的回退问题——修正错误的 `-fixed` 文件名引用、恢复 frontmatter 引号剥离、恢复 `--title` CLI 参数、修复摘要提取逻辑以正确跳过标题/引用/列表、修复单横线参数解析、移除调试日志。
|
||||||
|
- `baoyu-article-illustrator`、`baoyu-cover-image`、`baoyu-xhs-images`:移除水印配置中的透明度选项。
|
||||||
|
|
||||||
|
## 1.21.3 - 2026-01-24
|
||||||
|
|
||||||
|
### 重构
|
||||||
|
- `baoyu-article-illustrator`:简化 SKILL.md,提取内容至引用文件——新增 `references/usage.md` 用于命令语法,`references/prompt-construction.md` 用于提示词模板。工作流从 5 步重组为 6 步,新增 Pre-check 预检阶段。新增 `default_output_dir` 偏好设置选项。
|
||||||
|
|
||||||
## 1.21.2 - 2026-01-24
|
## 1.21.2 - 2026-01-24
|
||||||
|
|
||||||
### 新功能
|
### 新功能
|
||||||
|
|||||||
@@ -7,236 +7,188 @@ description: Analyzes article structure, identifies positions requiring visual a
|
|||||||
|
|
||||||
Analyze articles, identify illustration positions, generate images with Type × Style consistency.
|
Analyze articles, identify illustration positions, generate images with Type × Style consistency.
|
||||||
|
|
||||||
## Usage
|
|
||||||
|
|
||||||
```bash
|
|
||||||
# Auto-select type and style based on content
|
|
||||||
/baoyu-article-illustrator path/to/article.md
|
|
||||||
|
|
||||||
# Specify type
|
|
||||||
/baoyu-article-illustrator path/to/article.md --type infographic
|
|
||||||
|
|
||||||
# Specify style
|
|
||||||
/baoyu-article-illustrator path/to/article.md --style blueprint
|
|
||||||
|
|
||||||
# Combine type and style
|
|
||||||
/baoyu-article-illustrator path/to/article.md --type flowchart --style notion
|
|
||||||
|
|
||||||
# Specify density
|
|
||||||
/baoyu-article-illustrator path/to/article.md --density rich
|
|
||||||
|
|
||||||
# Direct content input
|
|
||||||
/baoyu-article-illustrator
|
|
||||||
[paste content]
|
|
||||||
```
|
|
||||||
|
|
||||||
## Options
|
|
||||||
|
|
||||||
| Option | Description |
|
|
||||||
|--------|-------------|
|
|
||||||
| `--type <name>` | Illustration type (see Type Gallery) |
|
|
||||||
| `--style <name>` | Visual style (see Style Gallery) |
|
|
||||||
| `--density <level>` | Image count: minimal / balanced / rich |
|
|
||||||
|
|
||||||
## Two Dimensions
|
## Two Dimensions
|
||||||
|
|
||||||
| Dimension | Controls | Examples |
|
| Dimension | Controls | Examples |
|
||||||
|-----------|----------|----------|
|
|-----------|----------|----------|
|
||||||
| **Type** | Information structure, content layout | infographic, scene, flowchart, comparison, framework, timeline |
|
| **Type** | Information structure, layout | infographic, scene, flowchart, comparison, framework, timeline |
|
||||||
| **Style** | Visual aesthetics, colors, mood | notion, warm, minimal, blueprint, watercolor, elegant |
|
| **Style** | Visual aesthetics, mood | notion, warm, minimal, blueprint, watercolor, elegant |
|
||||||
|
|
||||||
Type × Style can be freely combined. Example: `--type infographic --style blueprint` creates technical data visualization with schematic aesthetics.
|
Type × Style can be freely combined. Example: `--type infographic --style blueprint`
|
||||||
|
|
||||||
## Type Gallery
|
## Type Gallery
|
||||||
|
|
||||||
| Type | Description | Best For |
|
| Type | Best For |
|
||||||
|------|-------------|----------|
|
|------|----------|
|
||||||
| `infographic` | Data visualization, charts, metrics | Technical articles, data analysis, comparisons |
|
| `infographic` | Data, metrics, technical articles |
|
||||||
| `scene` | Atmospheric illustration, mood rendering | Narrative articles, personal stories, emotional content |
|
| `scene` | Narratives, personal stories, emotional content |
|
||||||
| `flowchart` | Process diagrams, step visualization | Tutorials, workflows, decision trees |
|
| `flowchart` | Tutorials, workflows, processes |
|
||||||
| `comparison` | Side-by-side, before/after contrast | Product comparisons, option evaluations |
|
| `comparison` | Side-by-side, before/after, options |
|
||||||
| `framework` | Concept maps, relationship diagrams | Methodologies, models, architecture design |
|
| `framework` | Methodologies, models, architecture |
|
||||||
| `timeline` | Chronological progression | History, project progress, evolution |
|
| `timeline` | History, progress, evolution |
|
||||||
|
|
||||||
## Density Options
|
|
||||||
|
|
||||||
| Density | Count | Description |
|
|
||||||
|---------|-------|-------------|
|
|
||||||
| `minimal` | 1-2 | Core concepts only |
|
|
||||||
| `balanced` (Default) | 3-5 | Major sections coverage |
|
|
||||||
| `rich` | 6+ | Rich visual support |
|
|
||||||
|
|
||||||
## Style Gallery
|
## Style Gallery
|
||||||
|
|
||||||
| Style | Description | Best For |
|
| Style | Best For |
|
||||||
|-------|-------------|----------|
|
|-------|----------|
|
||||||
| `notion` (Default) | Minimalist hand-drawn line art | Knowledge sharing, SaaS, productivity |
|
| `notion` (Default) | Knowledge sharing, SaaS, productivity |
|
||||||
| `elegant` | Refined, sophisticated | Business, thought leadership |
|
| `elegant` | Business, thought leadership |
|
||||||
| `warm` | Friendly, approachable | Personal growth, lifestyle, education |
|
| `warm` | Personal growth, lifestyle, education |
|
||||||
| `minimal` | Ultra-clean, zen-like | Philosophy, minimalism, core concepts |
|
| `minimal` | Philosophy, core concepts |
|
||||||
| `blueprint` | Technical schematics | Architecture, system design, engineering |
|
| `blueprint` | Architecture, system design |
|
||||||
| `watercolor` | Soft artistic with natural warmth | Lifestyle, travel, creative |
|
| `watercolor` | Lifestyle, travel, creative |
|
||||||
| `editorial` | Magazine-style infographic | Tech explainers, journalism |
|
| `editorial` | Tech explainers, journalism |
|
||||||
| `scientific` | Academic precise diagrams | Biology, chemistry, technical research |
|
| `scientific` | Academic, technical research |
|
||||||
|
|
||||||
Full style specifications: `references/styles/<style>.md`
|
Full styles: [references/styles.md](references/styles.md)
|
||||||
|
|
||||||
## Type × Style Compatibility
|
|
||||||
|
|
||||||
| | notion | warm | minimal | blueprint | watercolor | elegant | editorial | scientific |
|
|
||||||
|---|:---:|:---:|:---:|:---:|:---:|:---:|:---:|:---:|
|
|
||||||
| infographic | ✓✓ | ✓ | ✓✓ | ✓✓ | ✓ | ✓✓ | ✓✓ | ✓✓ |
|
|
||||||
| scene | ✓ | ✓✓ | ✓ | ✗ | ✓✓ | ✓ | ✓ | ✗ |
|
|
||||||
| flowchart | ✓✓ | ✓ | ✓ | ✓✓ | ✗ | ✓ | ✓✓ | ✓ |
|
|
||||||
| comparison | ✓✓ | ✓ | ✓✓ | ✓ | ✓ | ✓✓ | ✓✓ | ✓ |
|
|
||||||
| framework | ✓✓ | ✓ | ✓✓ | ✓✓ | ✗ | ✓✓ | ✓ | ✓✓ |
|
|
||||||
| timeline | ✓✓ | ✓ | ✓ | ✓ | ✓✓ | ✓✓ | ✓✓ | ✓ |
|
|
||||||
|
|
||||||
✓✓ = highly recommended | ✓ = compatible | ✗ = not recommended
|
|
||||||
|
|
||||||
## Auto Selection
|
## Auto Selection
|
||||||
|
|
||||||
| Content Signals | Recommended Type | Recommended Style |
|
| Content Signals | Type | Style |
|
||||||
|-----------------|------------------|-------------------|
|
|-----------------|------|-------|
|
||||||
| API, metrics, data, comparison, numbers | infographic | blueprint, notion |
|
| API, metrics, data, numbers | infographic | blueprint, notion |
|
||||||
| Story, emotion, journey, experience, personal | scene | warm, watercolor |
|
| Story, emotion, journey | scene | warm, watercolor |
|
||||||
| How-to, steps, workflow, process, tutorial | flowchart | notion, minimal |
|
| How-to, steps, workflow | flowchart | notion, minimal |
|
||||||
| vs, pros/cons, before/after, alternatives | comparison | notion, elegant |
|
| vs, pros/cons, before/after | comparison | notion, elegant |
|
||||||
| Framework, model, architecture, principles | framework | blueprint, notion |
|
| Framework, model, architecture | framework | blueprint, notion |
|
||||||
| History, timeline, progress, evolution | timeline | elegant, warm |
|
| History, timeline, progress | timeline | elegant, warm |
|
||||||
|
|
||||||
## Output Directory
|
|
||||||
|
|
||||||
```
|
|
||||||
illustrations/{topic-slug}/
|
|
||||||
├── source-{slug}.{ext}
|
|
||||||
├── outline.md
|
|
||||||
├── prompts/
|
|
||||||
│ └── illustration-{slug}.md
|
|
||||||
└── NN-{type}-{slug}.png
|
|
||||||
```
|
|
||||||
|
|
||||||
**Slug**: Extract 2-4 word topic in kebab-case.
|
|
||||||
**Conflict**: Append `-YYYYMMDD-HHMMSS` if exists.
|
|
||||||
|
|
||||||
## Workflow
|
## Workflow
|
||||||
|
|
||||||
### Progress
|
Copy this checklist and track progress:
|
||||||
|
|
||||||
```
|
```
|
||||||
- [ ] Step 1: Setup & Analyze
|
Progress:
|
||||||
- [ ] Step 2: Confirm Settings ⚠️ REQUIRED
|
- [ ] Step 1: Pre-check
|
||||||
- [ ] Step 3: Generate Outline
|
- [ ] Step 2: Setup & Analyze
|
||||||
- [ ] Step 4: Generate Images
|
- [ ] Step 3: Confirm Settings ⚠️ REQUIRED
|
||||||
- [ ] Step 5: Finalize
|
- [ ] Step 4: Generate Outline
|
||||||
|
- [ ] Step 5: Generate Images
|
||||||
|
- [ ] Step 6: Finalize
|
||||||
```
|
```
|
||||||
|
|
||||||
### Step 1: Setup & Analyze
|
---
|
||||||
|
|
||||||
**1.1 Load Preferences (EXTEND.md)**
|
### Step 1: Pre-check
|
||||||
|
|
||||||
Use Bash to check EXTEND.md existence (priority order):
|
**1.1 Determine Input Type**
|
||||||
|
|
||||||
|
| Input | Output Directory | Next |
|
||||||
|
|-------|------------------|------|
|
||||||
|
| File path | Ask user (1.2) | → 1.2 |
|
||||||
|
| Pasted content | `illustrations/{topic-slug}/` | → 1.4 |
|
||||||
|
|
||||||
|
**1.2 Determine Output Directory** (file path input only)
|
||||||
|
|
||||||
|
Check `default_output_dir` in preferences:
|
||||||
|
|
||||||
|
| Preference Value | Action |
|
||||||
|
|------------------|--------|
|
||||||
|
| `same-dir` | Use `{article-dir}/`, display "Output: {path}" |
|
||||||
|
| `illustrations-subdir` | Use `{article-dir}/illustrations/`, display "Output: {path}" |
|
||||||
|
| `independent` | Use `illustrations/{topic-slug}/`, display "Output: {path}" |
|
||||||
|
| Not configured | **MUST** ask with AskUserQuestion ↓ |
|
||||||
|
|
||||||
|
**AskUserQuestion** (when no preference):
|
||||||
|
- `{article-dir}/` - Same directory as article
|
||||||
|
- `{article-dir}/illustrations/` - Illustrations subdirectory (Recommended)
|
||||||
|
- `illustrations/{topic-slug}/` - Independent directory
|
||||||
|
- Save as default - Remember this choice for future runs
|
||||||
|
|
||||||
|
**1.3 Check Existing Images**
|
||||||
|
|
||||||
|
Scan target directory for `.png/.jpg/.webp` files.
|
||||||
|
|
||||||
|
If images exist → AskUserQuestion: How to handle?
|
||||||
|
- `supplement` - Keep existing, generate only new positions
|
||||||
|
- `overwrite` - Overwrite same-name files
|
||||||
|
- `regenerate` - Clear all and regenerate
|
||||||
|
|
||||||
|
**1.4 Confirm Article Update Method** (file path input only)
|
||||||
|
|
||||||
|
AskUserQuestion: How to update article?
|
||||||
|
- `update` - Modify original file directly
|
||||||
|
- `copy` - Create `{name}-illustrated.md` copy
|
||||||
|
|
||||||
|
**1.5 Load Preferences (EXTEND.md)**
|
||||||
|
|
||||||
```bash
|
```bash
|
||||||
# Check project-level first
|
|
||||||
test -f .baoyu-skills/baoyu-article-illustrator/EXTEND.md && echo "project"
|
test -f .baoyu-skills/baoyu-article-illustrator/EXTEND.md && echo "project"
|
||||||
|
|
||||||
# Then user-level (cross-platform: $HOME works on macOS/Linux/WSL)
|
|
||||||
test -f "$HOME/.baoyu-skills/baoyu-article-illustrator/EXTEND.md" && echo "user"
|
test -f "$HOME/.baoyu-skills/baoyu-article-illustrator/EXTEND.md" && echo "user"
|
||||||
```
|
```
|
||||||
|
|
||||||
┌──────────────────────────────────────────────────────────┬───────────────────┐
|
| Result | Action |
|
||||||
│ Path │ Location │
|
|--------|--------|
|
||||||
├──────────────────────────────────────────────────────────┼───────────────────┤
|
| Found | Read, parse, display summary |
|
||||||
│ .baoyu-skills/baoyu-article-illustrator/EXTEND.md │ Project directory │
|
| Not found | Ask with AskUserQuestion (see references/config/first-time-setup.md) |
|
||||||
├──────────────────────────────────────────────────────────┼───────────────────┤
|
|
||||||
│ $HOME/.baoyu-skills/baoyu-article-illustrator/EXTEND.md │ User home │
|
|
||||||
└──────────────────────────────────────────────────────────┴───────────────────┘
|
|
||||||
|
|
||||||
┌───────────┬───────────────────────────────────────────────────────────────────────────┐
|
**Supports**: Watermark | Preferred type/style | Custom styles | Language | Output directory
|
||||||
│ Result │ Action │
|
|
||||||
├───────────┼───────────────────────────────────────────────────────────────────────────┤
|
|
||||||
│ Found │ Read, parse, display summary │
|
|
||||||
├───────────┼───────────────────────────────────────────────────────────────────────────┤
|
|
||||||
│ Not found │ Ask user with AskUserQuestion (see references/config/first-time-setup.md) │
|
|
||||||
└───────────┴───────────────────────────────────────────────────────────────────────────┘
|
|
||||||
|
|
||||||
**EXTEND.md Supports**: Watermark | Preferred type/style | Custom style definitions | Language preference
|
---
|
||||||
|
|
||||||
Schema: `references/config/preferences-schema.md`
|
### Step 2: Setup & Analyze
|
||||||
|
|
||||||
**1.2 Analyze Content**
|
**2.1 Analyze Content**
|
||||||
|
|
||||||
Read article, detect language, classify content.
|
|
||||||
|
|
||||||
| Analysis | Description |
|
| Analysis | Description |
|
||||||
|----------|-------------|
|
|----------|-------------|
|
||||||
| Content type | Technical / Tutorial / Methodology / Narrative |
|
| Content type | Technical / Tutorial / Methodology / Narrative |
|
||||||
| Core arguments | 2-5 main points that MUST be visualized |
|
| Core arguments | 2-5 main points to visualize |
|
||||||
| Visual opportunities | Positions where illustrations add value |
|
| Visual opportunities | Positions where illustrations add value |
|
||||||
| Recommended type | Based on content signals |
|
| Recommended type | Based on content signals |
|
||||||
| Recommended density | Based on article length and complexity |
|
| Recommended density | Based on length and complexity |
|
||||||
|
|
||||||
**1.3 Extract Core Arguments**
|
**2.2 Extract Core Arguments**
|
||||||
|
|
||||||
Extract 2-5 core arguments that MUST be visualized:
|
|
||||||
- Main thesis
|
- Main thesis
|
||||||
- Key concepts reader needs
|
- Key concepts reader needs
|
||||||
- Comparisons/contrasts being made
|
- Comparisons/contrasts
|
||||||
- Framework/model proposed
|
- Framework/model proposed
|
||||||
|
|
||||||
**CRITICAL**: If article uses metaphors (e.g., "电锯切西瓜"), do NOT illustrate literally. Visualize the **underlying concept** instead.
|
**CRITICAL**: If article uses metaphors (e.g., "电锯切西瓜"), do NOT illustrate literally. Visualize the **underlying concept**.
|
||||||
|
|
||||||
**1.4 Identify Positions**
|
**2.3 Identify Positions**
|
||||||
|
|
||||||
**What to Illustrate**:
|
**Illustrate**:
|
||||||
- Core arguments (REQUIRED)
|
- Core arguments (REQUIRED)
|
||||||
- Abstract concepts needing visualization
|
- Abstract concepts
|
||||||
- Data comparisons, metrics
|
- Data comparisons
|
||||||
- Processes, workflows
|
- Processes, workflows
|
||||||
|
|
||||||
**What NOT to Illustrate**:
|
**Do NOT Illustrate**:
|
||||||
- Metaphors literally
|
- Metaphors literally
|
||||||
- Decorative scenes without information
|
- Decorative scenes
|
||||||
- Generic illustrations
|
- Generic illustrations
|
||||||
|
|
||||||
### Step 2: Confirm Settings ⚠️
|
---
|
||||||
|
|
||||||
|
### Step 3: Confirm Settings ⚠️
|
||||||
|
|
||||||
**Do NOT skip.** Use AskUserQuestion with 3-4 questions in ONE call.
|
**Do NOT skip.** Use AskUserQuestion with 3-4 questions in ONE call.
|
||||||
|
|
||||||
**Question 1: Illustration Type**
|
**Q1: Illustration Type**
|
||||||
|
- [Recommended based on analysis] (Recommended)
|
||||||
|
- infographic / scene / flowchart / comparison / framework / timeline / mixed
|
||||||
|
|
||||||
Based on content analysis, recommend type:
|
**Q2: Density**
|
||||||
- [Recommended type based on signals] (Recommended)
|
- minimal (1-2) - Core concepts only
|
||||||
- infographic - Data visualization, charts
|
- balanced (3-5) (Recommended) - Major sections
|
||||||
- scene - Atmospheric, mood rendering
|
- rich (6+) - Comprehensive support
|
||||||
- flowchart - Process, steps
|
|
||||||
- comparison - Side-by-side contrast
|
|
||||||
- framework - Concept relationships
|
|
||||||
- timeline - Chronological progression
|
|
||||||
- mixed - Combine multiple types
|
|
||||||
|
|
||||||
**Question 2: Density**
|
**Q3: Style**
|
||||||
|
Based on Type, suggest compatible styles from matrix:
|
||||||
|
- [Best compatible] (Recommended)
|
||||||
|
- [Other ✓✓ styles]
|
||||||
|
- [Other ✓ styles]
|
||||||
|
|
||||||
- minimal (1-2 images) - Core concepts only
|
**Q4** (only if source ≠ user language):
|
||||||
- balanced (3-5 images) (Recommended) - Major sections
|
- Language: Source / User language
|
||||||
- rich (6+ images) - Comprehensive visual support
|
|
||||||
|
|
||||||
**Question 3: Style**
|
---
|
||||||
|
|
||||||
Based on recommended Type, suggest compatible styles (see Type × Style Compatibility matrix):
|
### Step 4: Generate Outline
|
||||||
- [Best compatible style for recommended type] (Recommended)
|
|
||||||
- [Other highly compatible styles: ✓✓ from matrix]
|
|
||||||
- [Compatible styles: ✓ from matrix]
|
|
||||||
|
|
||||||
**Question 4** (only if source ≠ user language):
|
Save as `outline.md`:
|
||||||
- Language: Source language / User language
|
|
||||||
|
|
||||||
### Step 3: Generate Outline
|
|
||||||
|
|
||||||
Based on confirmed Type + Density + Style, generate illustration outline.
|
|
||||||
|
|
||||||
**Outline Format** (`outline.md`):
|
|
||||||
|
|
||||||
```yaml
|
```yaml
|
||||||
---
|
---
|
||||||
@@ -249,44 +201,48 @@ image_count: 4
|
|||||||
## Illustration 1
|
## Illustration 1
|
||||||
|
|
||||||
**Position**: [section] / [paragraph]
|
**Position**: [section] / [paragraph]
|
||||||
**Purpose**: [why this illustration helps]
|
**Purpose**: [why this helps]
|
||||||
**Visual Content**: [what to show]
|
**Visual Content**: [what to show]
|
||||||
**Type Application**: [how type applies here]
|
**Type Application**: [how type applies]
|
||||||
**Filename**: 01-infographic-concept-name.png
|
**Filename**: 01-infographic-concept-name.png
|
||||||
|
|
||||||
## Illustration 2
|
## Illustration 2
|
||||||
...
|
...
|
||||||
```
|
```
|
||||||
|
|
||||||
**Outline Requirements**:
|
**Requirements**:
|
||||||
- Each illustration position justified by content needs
|
- Each position justified by content needs
|
||||||
- Type applied consistently across all illustrations
|
- Type applied consistently
|
||||||
- Style characteristics reflected in visual descriptions
|
- Style reflected in descriptions
|
||||||
- Count matches density selection
|
- Count matches density
|
||||||
|
|
||||||
### Step 4: Generate Images
|
---
|
||||||
|
|
||||||
**4.1 Create Prompts**
|
### Step 5: Generate Images
|
||||||
|
|
||||||
Follow Prompt Construction principles below. Save each to `prompts/illustration-{slug}.md`.
|
**5.1 Create Prompts**
|
||||||
|
|
||||||
**4.2 Select Generation Skill**
|
Follow [references/prompt-construction.md](references/prompt-construction.md). Save to `prompts/illustration-{slug}.md`.
|
||||||
|
|
||||||
Check available image generation skills. If multiple, ask user to choose.
|
**5.2 Select Generation Skill**
|
||||||
|
|
||||||
**4.3 Apply Watermark** (if enabled in preferences)
|
Check available skills. If multiple, ask user.
|
||||||
|
|
||||||
Add to prompt: `Include a subtle watermark "[content]" positioned at [position] with approximately [opacity*100]% visibility.`
|
**5.3 Apply Watermark** (if enabled)
|
||||||
|
|
||||||
**4.4 Generate**
|
Add: `Include a subtle watermark "[content]" at [position].`
|
||||||
|
|
||||||
|
**5.4 Generate**
|
||||||
|
|
||||||
1. Generate sequentially
|
1. Generate sequentially
|
||||||
2. After each: "Generated X/N"
|
2. After each: "Generated X/N"
|
||||||
3. On failure: auto-retry once, then log and continue
|
3. On failure: retry once, then log and continue
|
||||||
|
|
||||||
### Step 5: Finalize
|
---
|
||||||
|
|
||||||
**5.1 Update Article**
|
### Step 6: Finalize
|
||||||
|
|
||||||
|
**6.1 Update Article**
|
||||||
|
|
||||||
Insert after corresponding paragraph:
|
Insert after corresponding paragraph:
|
||||||
```markdown
|
```markdown
|
||||||
@@ -295,158 +251,60 @@ Insert after corresponding paragraph:
|
|||||||
|
|
||||||
Alt text: concise description in article's language.
|
Alt text: concise description in article's language.
|
||||||
|
|
||||||
**5.2 Output Summary**
|
**6.2 Output Summary**
|
||||||
|
|
||||||
```
|
```
|
||||||
Article Illustration Complete!
|
Article Illustration Complete!
|
||||||
|
|
||||||
Article: [path]
|
Article: [path]
|
||||||
Type: [type name]
|
Type: [type] | Density: [level] | Style: [style]
|
||||||
Density: [minimal/balanced/rich]
|
Location: [directory]
|
||||||
Style: [style name]
|
|
||||||
Location: [directory path]
|
|
||||||
Images: X/N generated
|
Images: X/N generated
|
||||||
|
|
||||||
Positions:
|
Positions:
|
||||||
- 01-infographic-xxx.png → After "[Section]"
|
- 01-xxx.png → After "[Section]"
|
||||||
- 02-infographic-yyy.png → After "[Section]"
|
- 02-yyy.png → After "[Section]"
|
||||||
|
|
||||||
[If failures]
|
[If failures]
|
||||||
Failed:
|
Failed:
|
||||||
- NN-type-zzz.png: [reason]
|
- NN-zzz.png: [reason]
|
||||||
```
|
```
|
||||||
|
|
||||||
## Prompt Construction
|
---
|
||||||
|
|
||||||
### Principles
|
## Output Directory
|
||||||
|
|
||||||
Good prompts must include:
|
|
||||||
|
|
||||||
1. **Layout Structure First**: Describe composition, zones, flow direction
|
|
||||||
2. **Specific Data/Labels**: Use actual numbers, terms from article
|
|
||||||
3. **Visual Relationships**: How elements connect
|
|
||||||
4. **Semantic Colors**: Meaning-based color choices (red=warning, green=efficient)
|
|
||||||
5. **Style Characteristics**: Line treatment, texture, mood
|
|
||||||
6. **Aspect Ratio**: End with ratio and complexity level
|
|
||||||
|
|
||||||
### Type-Specific Prompts
|
|
||||||
|
|
||||||
**Infographic**:
|
|
||||||
```
|
```
|
||||||
[Title] - Data Visualization
|
illustrations/{topic-slug}/
|
||||||
|
├── source-{slug}.{ext}
|
||||||
Layout: [grid/radial/hierarchical]
|
├── outline.md
|
||||||
|
├── prompts/
|
||||||
ZONES:
|
│ └── illustration-{slug}.md
|
||||||
- Zone 1: [data point with specific values]
|
└── NN-{type}-{slug}.png
|
||||||
- Zone 2: [comparison with metrics]
|
|
||||||
- Zone 3: [summary/conclusion]
|
|
||||||
|
|
||||||
LABELS: [specific numbers, percentages, terms from article]
|
|
||||||
COLORS: [semantic color mapping]
|
|
||||||
STYLE: [style characteristics]
|
|
||||||
ASPECT: 16:9
|
|
||||||
```
|
```
|
||||||
|
|
||||||
**Scene**:
|
**Slug**: 2-4 word topic in kebab-case.
|
||||||
```
|
**Conflict**: Append `-YYYYMMDD-HHMMSS` if exists.
|
||||||
[Title] - Atmospheric Scene
|
|
||||||
|
|
||||||
FOCAL POINT: [main subject]
|
|
||||||
ATMOSPHERE: [lighting, mood, environment]
|
|
||||||
MOOD: [emotion to convey]
|
|
||||||
COLOR TEMPERATURE: [warm/cool/neutral]
|
|
||||||
STYLE: [style characteristics]
|
|
||||||
ASPECT: 16:9
|
|
||||||
```
|
|
||||||
|
|
||||||
**Flowchart**:
|
|
||||||
```
|
|
||||||
[Title] - Process Flow
|
|
||||||
|
|
||||||
Layout: [left-right/top-down/circular]
|
|
||||||
|
|
||||||
STEPS:
|
|
||||||
1. [Step name] - [brief description]
|
|
||||||
2. [Step name] - [brief description]
|
|
||||||
...
|
|
||||||
|
|
||||||
CONNECTIONS: [arrow types, decision points]
|
|
||||||
STYLE: [style characteristics]
|
|
||||||
ASPECT: 16:9
|
|
||||||
```
|
|
||||||
|
|
||||||
**Comparison**:
|
|
||||||
```
|
|
||||||
[Title] - Comparison View
|
|
||||||
|
|
||||||
LEFT SIDE - [Option A]:
|
|
||||||
- [Point 1]
|
|
||||||
- [Point 2]
|
|
||||||
|
|
||||||
RIGHT SIDE - [Option B]:
|
|
||||||
- [Point 1]
|
|
||||||
- [Point 2]
|
|
||||||
|
|
||||||
DIVIDER: [visual separator]
|
|
||||||
STYLE: [style characteristics]
|
|
||||||
ASPECT: 16:9
|
|
||||||
```
|
|
||||||
|
|
||||||
**Framework**:
|
|
||||||
```
|
|
||||||
[Title] - Conceptual Framework
|
|
||||||
|
|
||||||
STRUCTURE: [hierarchical/network/matrix]
|
|
||||||
|
|
||||||
NODES:
|
|
||||||
- [Concept 1] - [role]
|
|
||||||
- [Concept 2] - [role]
|
|
||||||
|
|
||||||
RELATIONSHIPS: [how nodes connect]
|
|
||||||
STYLE: [style characteristics]
|
|
||||||
ASPECT: 16:9
|
|
||||||
```
|
|
||||||
|
|
||||||
**Timeline**:
|
|
||||||
```
|
|
||||||
[Title] - Chronological View
|
|
||||||
|
|
||||||
DIRECTION: [horizontal/vertical]
|
|
||||||
|
|
||||||
EVENTS:
|
|
||||||
- [Date/Period 1]: [milestone]
|
|
||||||
- [Date/Period 2]: [milestone]
|
|
||||||
|
|
||||||
MARKERS: [visual indicators]
|
|
||||||
STYLE: [style characteristics]
|
|
||||||
ASPECT: 16:9
|
|
||||||
```
|
|
||||||
|
|
||||||
### What to Avoid
|
|
||||||
|
|
||||||
- Vague descriptions ("a nice image")
|
|
||||||
- Literal metaphor illustrations
|
|
||||||
- Missing concrete labels/annotations
|
|
||||||
- Generic decorative elements
|
|
||||||
|
|
||||||
## Modification
|
## Modification
|
||||||
|
|
||||||
| Action | Steps |
|
| Action | Steps |
|
||||||
|--------|-------|
|
|--------|-------|
|
||||||
| **Edit** | Update prompt → Regenerate → Update reference |
|
| **Edit** | Update prompt → Regenerate → Update reference |
|
||||||
| **Add** | Identify position → Create prompt → Generate → Update outline → Insert reference |
|
| **Add** | Identify position → Create prompt → Generate → Update outline → Insert |
|
||||||
| **Delete** | Delete files → Remove reference → Update outline |
|
| **Delete** | Delete files → Remove reference → Update outline |
|
||||||
|
|
||||||
## References
|
## References
|
||||||
|
|
||||||
| File | Content |
|
| File | Content |
|
||||||
|------|---------|
|
|------|---------|
|
||||||
| [references/styles.md](references/styles.md) | Style gallery & compatibility matrix |
|
| [references/usage.md](references/usage.md) | Command syntax and options |
|
||||||
|
| [references/styles.md](references/styles.md) | Style gallery & compatibility |
|
||||||
|
| [references/prompt-construction.md](references/prompt-construction.md) | Prompt templates |
|
||||||
| `references/styles/<style>.md` | Full style specifications |
|
| `references/styles/<style>.md` | Full style specifications |
|
||||||
| `references/config/preferences-schema.md` | EXTEND.md schema |
|
| `references/config/preferences-schema.md` | EXTEND.md schema |
|
||||||
| `references/config/first-time-setup.md` | First-time setup flow |
|
| `references/config/first-time-setup.md` | First-time setup flow |
|
||||||
|
|
||||||
## Extension Support
|
## Extension Support
|
||||||
|
|
||||||
Custom configurations via EXTEND.md. See **Step 1.1** for paths and supported options.
|
Custom configurations via EXTEND.md. See **Step 1.5** for paths and supported options.
|
||||||
|
|||||||
@@ -15,7 +15,6 @@ watermark:
|
|||||||
enabled: false
|
enabled: false
|
||||||
content: ""
|
content: ""
|
||||||
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
||||||
opacity: 0.7 # 0.1-1.0
|
|
||||||
|
|
||||||
preferred_style:
|
preferred_style:
|
||||||
name: null # Built-in or custom style name
|
name: null # Built-in or custom style name
|
||||||
@@ -23,6 +22,8 @@ preferred_style:
|
|||||||
|
|
||||||
language: null # zh|en|ja|ko|auto
|
language: null # zh|en|ja|ko|auto
|
||||||
|
|
||||||
|
default_output_dir: null # same-dir|illustrations-subdir|independent
|
||||||
|
|
||||||
custom_styles:
|
custom_styles:
|
||||||
- name: my-style
|
- name: my-style
|
||||||
description: "Style description"
|
description: "Style description"
|
||||||
@@ -44,10 +45,10 @@ custom_styles:
|
|||||||
| `watermark.enabled` | bool | false | Enable watermark |
|
| `watermark.enabled` | bool | false | Enable watermark |
|
||||||
| `watermark.content` | string | "" | Watermark text (@username or custom) |
|
| `watermark.content` | string | "" | Watermark text (@username or custom) |
|
||||||
| `watermark.position` | enum | bottom-right | Position on image |
|
| `watermark.position` | enum | bottom-right | Position on image |
|
||||||
| `watermark.opacity` | float | 0.7 | Transparency (0.1-1.0) |
|
|
||||||
| `preferred_style.name` | string | null | Style name or null |
|
| `preferred_style.name` | string | null | Style name or null |
|
||||||
| `preferred_style.description` | string | "" | Custom notes/override |
|
| `preferred_style.description` | string | "" | Custom notes/override |
|
||||||
| `language` | string | null | Output language (null = auto-detect) |
|
| `language` | string | null | Output language (null = auto-detect) |
|
||||||
|
| `default_output_dir` | enum | null | Output directory preference (null = ask each time) |
|
||||||
| `custom_styles` | array | [] | User-defined styles |
|
| `custom_styles` | array | [] | User-defined styles |
|
||||||
|
|
||||||
## Position Options
|
## Position Options
|
||||||
@@ -59,6 +60,14 @@ custom_styles:
|
|||||||
| `bottom-center` | Bottom center |
|
| `bottom-center` | Bottom center |
|
||||||
| `top-right` | Upper right corner |
|
| `top-right` | Upper right corner |
|
||||||
|
|
||||||
|
## Output Directory Options
|
||||||
|
|
||||||
|
| Value | Description |
|
||||||
|
|-------|-------------|
|
||||||
|
| `same-dir` | Same directory as article |
|
||||||
|
| `illustrations-subdir` | `{article-dir}/illustrations/` subdirectory |
|
||||||
|
| `independent` | `illustrations/{topic-slug}/` in working directory |
|
||||||
|
|
||||||
## Custom Style Fields
|
## Custom Style Fields
|
||||||
|
|
||||||
| Field | Required | Description |
|
| Field | Required | Description |
|
||||||
@@ -94,7 +103,6 @@ watermark:
|
|||||||
enabled: true
|
enabled: true
|
||||||
content: "@myaccount"
|
content: "@myaccount"
|
||||||
position: bottom-right
|
position: bottom-right
|
||||||
opacity: 0.5
|
|
||||||
|
|
||||||
preferred_style:
|
preferred_style:
|
||||||
name: notion
|
name: notion
|
||||||
|
|||||||
@@ -0,0 +1,127 @@
|
|||||||
|
# Prompt Construction
|
||||||
|
|
||||||
|
## Principles
|
||||||
|
|
||||||
|
Good prompts must include:
|
||||||
|
|
||||||
|
1. **Layout Structure First**: Describe composition, zones, flow direction
|
||||||
|
2. **Specific Data/Labels**: Use actual numbers, terms from article
|
||||||
|
3. **Visual Relationships**: How elements connect
|
||||||
|
4. **Semantic Colors**: Meaning-based color choices (red=warning, green=efficient)
|
||||||
|
5. **Style Characteristics**: Line treatment, texture, mood
|
||||||
|
6. **Aspect Ratio**: End with ratio and complexity level
|
||||||
|
|
||||||
|
## Type-Specific Templates
|
||||||
|
|
||||||
|
### Infographic
|
||||||
|
|
||||||
|
```
|
||||||
|
[Title] - Data Visualization
|
||||||
|
|
||||||
|
Layout: [grid/radial/hierarchical]
|
||||||
|
|
||||||
|
ZONES:
|
||||||
|
- Zone 1: [data point with specific values]
|
||||||
|
- Zone 2: [comparison with metrics]
|
||||||
|
- Zone 3: [summary/conclusion]
|
||||||
|
|
||||||
|
LABELS: [specific numbers, percentages, terms from article]
|
||||||
|
COLORS: [semantic color mapping]
|
||||||
|
STYLE: [style characteristics]
|
||||||
|
ASPECT: 16:9
|
||||||
|
```
|
||||||
|
|
||||||
|
### Scene
|
||||||
|
|
||||||
|
```
|
||||||
|
[Title] - Atmospheric Scene
|
||||||
|
|
||||||
|
FOCAL POINT: [main subject]
|
||||||
|
ATMOSPHERE: [lighting, mood, environment]
|
||||||
|
MOOD: [emotion to convey]
|
||||||
|
COLOR TEMPERATURE: [warm/cool/neutral]
|
||||||
|
STYLE: [style characteristics]
|
||||||
|
ASPECT: 16:9
|
||||||
|
```
|
||||||
|
|
||||||
|
### Flowchart
|
||||||
|
|
||||||
|
```
|
||||||
|
[Title] - Process Flow
|
||||||
|
|
||||||
|
Layout: [left-right/top-down/circular]
|
||||||
|
|
||||||
|
STEPS:
|
||||||
|
1. [Step name] - [brief description]
|
||||||
|
2. [Step name] - [brief description]
|
||||||
|
...
|
||||||
|
|
||||||
|
CONNECTIONS: [arrow types, decision points]
|
||||||
|
STYLE: [style characteristics]
|
||||||
|
ASPECT: 16:9
|
||||||
|
```
|
||||||
|
|
||||||
|
### Comparison
|
||||||
|
|
||||||
|
```
|
||||||
|
[Title] - Comparison View
|
||||||
|
|
||||||
|
LEFT SIDE - [Option A]:
|
||||||
|
- [Point 1]
|
||||||
|
- [Point 2]
|
||||||
|
|
||||||
|
RIGHT SIDE - [Option B]:
|
||||||
|
- [Point 1]
|
||||||
|
- [Point 2]
|
||||||
|
|
||||||
|
DIVIDER: [visual separator]
|
||||||
|
STYLE: [style characteristics]
|
||||||
|
ASPECT: 16:9
|
||||||
|
```
|
||||||
|
|
||||||
|
### Framework
|
||||||
|
|
||||||
|
```
|
||||||
|
[Title] - Conceptual Framework
|
||||||
|
|
||||||
|
STRUCTURE: [hierarchical/network/matrix]
|
||||||
|
|
||||||
|
NODES:
|
||||||
|
- [Concept 1] - [role]
|
||||||
|
- [Concept 2] - [role]
|
||||||
|
|
||||||
|
RELATIONSHIPS: [how nodes connect]
|
||||||
|
STYLE: [style characteristics]
|
||||||
|
ASPECT: 16:9
|
||||||
|
```
|
||||||
|
|
||||||
|
### Timeline
|
||||||
|
|
||||||
|
```
|
||||||
|
[Title] - Chronological View
|
||||||
|
|
||||||
|
DIRECTION: [horizontal/vertical]
|
||||||
|
|
||||||
|
EVENTS:
|
||||||
|
- [Date/Period 1]: [milestone]
|
||||||
|
- [Date/Period 2]: [milestone]
|
||||||
|
|
||||||
|
MARKERS: [visual indicators]
|
||||||
|
STYLE: [style characteristics]
|
||||||
|
ASPECT: 16:9
|
||||||
|
```
|
||||||
|
|
||||||
|
## What to Avoid
|
||||||
|
|
||||||
|
- Vague descriptions ("a nice image")
|
||||||
|
- Literal metaphor illustrations
|
||||||
|
- Missing concrete labels/annotations
|
||||||
|
- Generic decorative elements
|
||||||
|
|
||||||
|
## Watermark Integration
|
||||||
|
|
||||||
|
If watermark enabled in preferences, append:
|
||||||
|
|
||||||
|
```
|
||||||
|
Include a subtle watermark "[content]" positioned at [position] with approximately [opacity*100]% visibility.
|
||||||
|
```
|
||||||
@@ -0,0 +1,66 @@
|
|||||||
|
# Usage
|
||||||
|
|
||||||
|
## Command Syntax
|
||||||
|
|
||||||
|
```bash
|
||||||
|
# Auto-select type and style based on content
|
||||||
|
/baoyu-article-illustrator path/to/article.md
|
||||||
|
|
||||||
|
# Specify type
|
||||||
|
/baoyu-article-illustrator path/to/article.md --type infographic
|
||||||
|
|
||||||
|
# Specify style
|
||||||
|
/baoyu-article-illustrator path/to/article.md --style blueprint
|
||||||
|
|
||||||
|
# Combine type and style
|
||||||
|
/baoyu-article-illustrator path/to/article.md --type flowchart --style notion
|
||||||
|
|
||||||
|
# Specify density
|
||||||
|
/baoyu-article-illustrator path/to/article.md --density rich
|
||||||
|
|
||||||
|
# Direct content input (paste mode)
|
||||||
|
/baoyu-article-illustrator
|
||||||
|
[paste content]
|
||||||
|
```
|
||||||
|
|
||||||
|
## Options
|
||||||
|
|
||||||
|
| Option | Description |
|
||||||
|
|--------|-------------|
|
||||||
|
| `--type <name>` | Illustration type (see Type Gallery in SKILL.md) |
|
||||||
|
| `--style <name>` | Visual style (see references/styles.md) |
|
||||||
|
| `--density <level>` | Image count: minimal / balanced / rich |
|
||||||
|
|
||||||
|
## Input Modes
|
||||||
|
|
||||||
|
| Mode | Trigger | Output Directory |
|
||||||
|
|------|---------|------------------|
|
||||||
|
| File path | `path/to/article.md` | Use `default_output_dir` preference, or ask if not set |
|
||||||
|
| Paste content | No path argument | `illustrations/{topic-slug}/` |
|
||||||
|
|
||||||
|
## Output Directory Options
|
||||||
|
|
||||||
|
| Value | Path |
|
||||||
|
|-------|------|
|
||||||
|
| `same-dir` | `{article-dir}/` |
|
||||||
|
| `illustrations-subdir` | `{article-dir}/illustrations/` |
|
||||||
|
| `independent` | `illustrations/{topic-slug}/` |
|
||||||
|
|
||||||
|
Configure in EXTEND.md: `default_output_dir: illustrations-subdir`
|
||||||
|
|
||||||
|
## Examples
|
||||||
|
|
||||||
|
**Technical article with data**:
|
||||||
|
```bash
|
||||||
|
/baoyu-article-illustrator api-design.md --type infographic --style blueprint
|
||||||
|
```
|
||||||
|
|
||||||
|
**Personal story**:
|
||||||
|
```bash
|
||||||
|
/baoyu-article-illustrator journey.md --type scene --style warm
|
||||||
|
```
|
||||||
|
|
||||||
|
**Tutorial with steps**:
|
||||||
|
```bash
|
||||||
|
/baoyu-article-illustrator how-to-deploy.md --type flowchart --density rich
|
||||||
|
```
|
||||||
@@ -15,7 +15,6 @@ watermark:
|
|||||||
enabled: false
|
enabled: false
|
||||||
content: ""
|
content: ""
|
||||||
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
||||||
opacity: 0.5 # 0.1-1.0 (lower default for comics)
|
|
||||||
|
|
||||||
preferred_art: null # ligne-claire|manga|realistic|ink-brush|chalk
|
preferred_art: null # ligne-claire|manga|realistic|ink-brush|chalk
|
||||||
preferred_tone: null # neutral|warm|dramatic|romantic|energetic|vintage|action
|
preferred_tone: null # neutral|warm|dramatic|romantic|energetic|vintage|action
|
||||||
@@ -42,7 +41,6 @@ character_presets:
|
|||||||
| `watermark.enabled` | bool | false | Enable watermark |
|
| `watermark.enabled` | bool | false | Enable watermark |
|
||||||
| `watermark.content` | string | "" | Watermark text (@username or custom) |
|
| `watermark.content` | string | "" | Watermark text (@username or custom) |
|
||||||
| `watermark.position` | enum | bottom-right | Position on image |
|
| `watermark.position` | enum | bottom-right | Position on image |
|
||||||
| `watermark.opacity` | float | 0.5 | Transparency (0.1-1.0, lower for comics) |
|
|
||||||
| `preferred_art` | string | null | Art style (ligne-claire, manga, realistic, ink-brush, chalk) |
|
| `preferred_art` | string | null | Art style (ligne-claire, manga, realistic, ink-brush, chalk) |
|
||||||
| `preferred_tone` | string | null | Tone (neutral, warm, dramatic, romantic, energetic, vintage, action) |
|
| `preferred_tone` | string | null | Tone (neutral, warm, dramatic, romantic, energetic, vintage, action) |
|
||||||
| `preferred_layout` | string | null | Layout preference or null |
|
| `preferred_layout` | string | null | Layout preference or null |
|
||||||
@@ -113,7 +111,6 @@ watermark:
|
|||||||
enabled: true
|
enabled: true
|
||||||
content: "@comicstudio"
|
content: "@comicstudio"
|
||||||
position: bottom-right
|
position: bottom-right
|
||||||
opacity: 0.4
|
|
||||||
|
|
||||||
preferred_art: manga
|
preferred_art: manga
|
||||||
preferred_tone: neutral
|
preferred_tone: neutral
|
||||||
|
|||||||
@@ -28,19 +28,6 @@ description: Watermark configuration guide for baoyu-comic
|
|||||||
| `bottom-center` | Webtoon vertical scroll, centered designs | Text-heavy bottom area |
|
| `bottom-center` | Webtoon vertical scroll, centered designs | Text-heavy bottom area |
|
||||||
| `top-right` | **Not recommended for comics** | Always - conflicts with page numbers |
|
| `top-right` | **Not recommended for comics** | Always - conflicts with page numbers |
|
||||||
|
|
||||||
## Opacity for Comics
|
|
||||||
|
|
||||||
Comics typically use lower opacity than infographics to avoid disrupting panel flow:
|
|
||||||
|
|
||||||
| Opacity | Visual Effect | Use Case |
|
|
||||||
|---------|---------------|----------|
|
|
||||||
| 0.3 | Very subtle, barely visible | **Recommended for comics** |
|
|
||||||
| 0.4 | Light presence | Balance of visibility and subtlety |
|
|
||||||
| 0.5 | Noticeable | Standard comics default |
|
|
||||||
| 0.6+ | Strong presence | Not recommended (distracting) |
|
|
||||||
|
|
||||||
**Default**: 0.5 (compared to 0.7 for infographics)
|
|
||||||
|
|
||||||
## Content Format
|
## Content Format
|
||||||
|
|
||||||
| Format | Example | Style |
|
| Format | Example | Style |
|
||||||
@@ -63,10 +50,9 @@ Comics typically use lower opacity than infographics to avoid disrupting panel f
|
|||||||
When watermark is enabled, add to image generation prompt:
|
When watermark is enabled, add to image generation prompt:
|
||||||
|
|
||||||
```
|
```
|
||||||
Include a subtle watermark "[content]" positioned at [position]
|
Include a subtle watermark "[content]" positioned at [position].
|
||||||
with approximately [opacity*100]% visibility. The watermark should
|
The watermark should be legible but not distracting from the comic panels
|
||||||
be legible but not distracting from the comic panels and storytelling.
|
and storytelling. Ensure watermark does not overlap speech bubbles or key action.
|
||||||
Ensure watermark does not overlap speech bubbles or key action.
|
|
||||||
```
|
```
|
||||||
|
|
||||||
## Common Issues
|
## Common Issues
|
||||||
@@ -76,5 +62,5 @@ Ensure watermark does not overlap speech bubbles or key action.
|
|||||||
| Watermark invisible on dark panels | Adjust contrast or add subtle outline |
|
| Watermark invisible on dark panels | Adjust contrast or add subtle outline |
|
||||||
| Watermark overlaps speech bubble | Change position or lower on page |
|
| Watermark overlaps speech bubble | Change position or lower on page |
|
||||||
| Watermark inconsistent across pages | Use session ID for consistency |
|
| Watermark inconsistent across pages | Use session ID for consistency |
|
||||||
| Watermark too prominent | Decrease opacity (0.3-0.4 for comics) |
|
| Watermark too prominent | Change position or reduce size |
|
||||||
| Conflicts with page number | Never use top-right position |
|
| Conflicts with page number | Never use top-right position |
|
||||||
|
|||||||
@@ -615,9 +615,8 @@ Style notes: [key characteristics from style definition]
|
|||||||
**Watermark Application** (if enabled in preferences):
|
**Watermark Application** (if enabled in preferences):
|
||||||
Add to prompt:
|
Add to prompt:
|
||||||
```
|
```
|
||||||
Include a subtle watermark "[content]" positioned at [position]
|
Include a subtle watermark "[content]" positioned at [position].
|
||||||
with approximately [opacity*100]% visibility. The watermark should
|
The watermark should be legible but not distracting from the main content.
|
||||||
be legible but not distracting from the main content.
|
|
||||||
```
|
```
|
||||||
Reference: `references/config/watermark-guide.md`
|
Reference: `references/config/watermark-guide.md`
|
||||||
|
|
||||||
|
|||||||
@@ -15,7 +15,6 @@ watermark:
|
|||||||
enabled: false
|
enabled: false
|
||||||
content: ""
|
content: ""
|
||||||
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
||||||
opacity: 0.7 # 0.1-1.0
|
|
||||||
|
|
||||||
preferred_type: null # hero|conceptual|typography|metaphor|scene|minimal or null for auto-select
|
preferred_type: null # hero|conceptual|typography|metaphor|scene|minimal or null for auto-select
|
||||||
|
|
||||||
@@ -52,7 +51,6 @@ custom_styles:
|
|||||||
| `watermark.enabled` | bool | false | Enable watermark |
|
| `watermark.enabled` | bool | false | Enable watermark |
|
||||||
| `watermark.content` | string | "" | Watermark text (@username or custom) |
|
| `watermark.content` | string | "" | Watermark text (@username or custom) |
|
||||||
| `watermark.position` | enum | bottom-right | Position on image |
|
| `watermark.position` | enum | bottom-right | Position on image |
|
||||||
| `watermark.opacity` | float | 0.7 | Transparency (0.1-1.0) |
|
|
||||||
| `preferred_type` | string | null | Type name or null for auto |
|
| `preferred_type` | string | null | Type name or null for auto |
|
||||||
| `preferred_style` | string | null | Style name or null for auto |
|
| `preferred_style` | string | null | Style name or null for auto |
|
||||||
| `preferred_text` | string | title-only | Text density level |
|
| `preferred_text` | string | title-only | Text density level |
|
||||||
@@ -145,7 +143,6 @@ watermark:
|
|||||||
enabled: true
|
enabled: true
|
||||||
content: "myblog.com"
|
content: "myblog.com"
|
||||||
position: bottom-right
|
position: bottom-right
|
||||||
opacity: 0.5
|
|
||||||
|
|
||||||
preferred_type: conceptual
|
preferred_type: conceptual
|
||||||
|
|
||||||
|
|||||||
@@ -28,15 +28,6 @@ description: Watermark configuration guide for baoyu-cover-image
|
|||||||
| `bottom-center` | Centered designs | Text-heavy bottom area |
|
| `bottom-center` | Centered designs | Text-heavy bottom area |
|
||||||
| `top-right` | Bottom-heavy content | Title/header in top-right |
|
| `top-right` | Bottom-heavy content | Title/header in top-right |
|
||||||
|
|
||||||
## Opacity Examples
|
|
||||||
|
|
||||||
| Opacity | Visual Effect | Use Case |
|
|
||||||
|---------|---------------|----------|
|
|
||||||
| 0.3 | Very subtle, barely visible | Clean aesthetic priority |
|
|
||||||
| 0.5 | Balanced, noticeable but not distracting | Default recommendation |
|
|
||||||
| 0.7 | Clearly visible | Brand recognition priority |
|
|
||||||
| 0.9 | Strong presence | Anti-copy protection |
|
|
||||||
|
|
||||||
## Content Format
|
## Content Format
|
||||||
|
|
||||||
| Format | Example | Style |
|
| Format | Example | Style |
|
||||||
@@ -51,16 +42,14 @@ description: Watermark configuration guide for baoyu-cover-image
|
|||||||
1. **Consistency**: Use same watermark across all covers
|
1. **Consistency**: Use same watermark across all covers
|
||||||
2. **Legibility**: Ensure watermark readable on both light/dark areas
|
2. **Legibility**: Ensure watermark readable on both light/dark areas
|
||||||
3. **Size**: Keep subtle - should not distract from content
|
3. **Size**: Keep subtle - should not distract from content
|
||||||
4. **Contrast**: Adjust opacity based on cover background
|
|
||||||
|
|
||||||
## Prompt Integration
|
## Prompt Integration
|
||||||
|
|
||||||
When watermark is enabled, add to image generation prompt:
|
When watermark is enabled, add to image generation prompt:
|
||||||
|
|
||||||
```
|
```
|
||||||
Include a subtle watermark "[content]" positioned at [position]
|
Include a subtle watermark "[content]" positioned at [position].
|
||||||
with approximately [opacity*100]% visibility. The watermark should
|
The watermark should be legible but not distracting from the main content.
|
||||||
be legible but not distracting from the main content.
|
|
||||||
```
|
```
|
||||||
|
|
||||||
## Cover-Specific Considerations
|
## Cover-Specific Considerations
|
||||||
@@ -75,7 +64,6 @@ be legible but not distracting from the main content.
|
|||||||
|
|
||||||
| Issue | Solution |
|
| Issue | Solution |
|
||||||
|-------|----------|
|
|-------|----------|
|
||||||
| Watermark invisible | Increase opacity or adjust position |
|
| Watermark invisible | Adjust position or check contrast |
|
||||||
| Watermark too prominent | Decrease opacity (0.3-0.5) |
|
| Watermark too prominent | Change position or reduce size |
|
||||||
| Watermark overlaps title | Change position or reduce title area |
|
| Watermark overlaps title | Change position or reduce title area |
|
||||||
| Inconsistent appearance | Use fixed opacity/position in preferences |
|
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ import path from 'node:path';
|
|||||||
import { mkdir, writeFile } from 'node:fs/promises';
|
import { mkdir, writeFile } from 'node:fs/promises';
|
||||||
import os from 'node:os';
|
import os from 'node:os';
|
||||||
import { createHash } from 'node:crypto';
|
import { createHash } from 'node:crypto';
|
||||||
|
import { fileURLToPath } from 'node:url';
|
||||||
import https from 'node:https';
|
import https from 'node:https';
|
||||||
import http from 'node:http';
|
import http from 'node:http';
|
||||||
import { spawnSync } from 'node:child_process';
|
import { spawnSync } from 'node:child_process';
|
||||||
@@ -111,17 +112,11 @@ function parseFrontmatter(content: string): { frontmatter: Record<string, string
|
|||||||
return { frontmatter, body: match[2]! };
|
return { frontmatter, body: match[2]! };
|
||||||
}
|
}
|
||||||
|
|
||||||
async function parseMarkdownForWechat(
|
export async function convertMarkdown(markdownPath: string, options?: { title?: string; theme?: string }): Promise<ParsedResult> {
|
||||||
markdownPath: string,
|
|
||||||
options?: { title?: string; theme?: string; tempDir?: string },
|
|
||||||
): Promise<ParsedResult> {
|
|
||||||
const content = fs.readFileSync(markdownPath, 'utf-8');
|
|
||||||
const baseDir = path.dirname(markdownPath);
|
const baseDir = path.dirname(markdownPath);
|
||||||
const tempDir = options?.tempDir ?? path.join(os.tmpdir(), 'wechat-article-images');
|
const content = fs.readFileSync(markdownPath, 'utf-8');
|
||||||
const theme = options?.theme ?? 'default';
|
const theme = options?.theme ?? 'default';
|
||||||
|
|
||||||
await mkdir(tempDir, { recursive: true });
|
|
||||||
|
|
||||||
const { frontmatter, body } = parseFrontmatter(content);
|
const { frontmatter, body } = parseFrontmatter(content);
|
||||||
|
|
||||||
let title = options?.title ?? frontmatter.title ?? '';
|
let title = options?.title ?? frontmatter.title ?? '';
|
||||||
@@ -129,9 +124,9 @@ async function parseMarkdownForWechat(
|
|||||||
const h1Match = body.match(/^#\s+(.+)$/m);
|
const h1Match = body.match(/^#\s+(.+)$/m);
|
||||||
if (h1Match) title = h1Match[1]!;
|
if (h1Match) title = h1Match[1]!;
|
||||||
}
|
}
|
||||||
|
if (!title) title = path.basename(markdownPath, path.extname(markdownPath));
|
||||||
const author = frontmatter.author ?? '';
|
const author = frontmatter.author || '';
|
||||||
let summary = frontmatter.summary ?? frontmatter.description ?? '';
|
let summary = frontmatter.description || frontmatter.summary || '';
|
||||||
|
|
||||||
if (!summary) {
|
if (!summary) {
|
||||||
const lines = body.split('\n');
|
const lines = body.split('\n');
|
||||||
@@ -168,13 +163,16 @@ async function parseMarkdownForWechat(
|
|||||||
|
|
||||||
const modifiedMarkdown = `---\n${Object.entries(frontmatter).map(([k, v]) => `${k}: ${v}`).join('\n')}\n---\n${modifiedBody}`;
|
const modifiedMarkdown = `---\n${Object.entries(frontmatter).map(([k, v]) => `${k}: ${v}`).join('\n')}\n---\n${modifiedBody}`;
|
||||||
|
|
||||||
|
const tempDir = fs.mkdtempSync(path.join(os.tmpdir(), 'wechat-article-images-'));
|
||||||
const tempMdPath = path.join(tempDir, 'temp-article.md');
|
const tempMdPath = path.join(tempDir, 'temp-article.md');
|
||||||
await writeFile(tempMdPath, modifiedMarkdown, 'utf-8');
|
await writeFile(tempMdPath, modifiedMarkdown, 'utf-8');
|
||||||
|
|
||||||
const scriptDir = path.dirname(new URL(import.meta.url).pathname);
|
const __filename = fileURLToPath(import.meta.url);
|
||||||
const renderScript = path.join(scriptDir, 'md', 'render.ts');
|
const __dirname = path.dirname(__filename);
|
||||||
|
const renderScript = path.join(__dirname, 'md', 'render.ts');
|
||||||
|
|
||||||
console.error(`[md-to-wechat] Rendering markdown with theme: ${theme}`);
|
console.error(`[md-to-wechat] Rendering markdown with theme: ${theme}`);
|
||||||
|
|
||||||
const result = spawnSync('npx', ['-y', 'bun', renderScript, tempMdPath, '--theme', theme], {
|
const result = spawnSync('npx', ['-y', 'bun', renderScript, tempMdPath, '--theme', theme], {
|
||||||
stdio: ['inherit', 'pipe', 'pipe'],
|
stdio: ['inherit', 'pipe', 'pipe'],
|
||||||
cwd: baseDir,
|
cwd: baseDir,
|
||||||
@@ -227,7 +225,7 @@ Output JSON format:
|
|||||||
"contentImages": [
|
"contentImages": [
|
||||||
{
|
{
|
||||||
"placeholder": "[[IMAGE_PLACEHOLDER_1]]",
|
"placeholder": "[[IMAGE_PLACEHOLDER_1]]",
|
||||||
"localPath": "/tmp/wechat-article-images/img.png",
|
"localPath": "/tmp/wechat-image/img.png",
|
||||||
"originalPath": "imgs/image.png"
|
"originalPath": "imgs/image.png"
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
@@ -262,7 +260,7 @@ async function main(): Promise<void> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (!markdownPath) {
|
if (!markdownPath) {
|
||||||
console.error('Error: Markdown file path required');
|
console.error('Error: Markdown file path is required');
|
||||||
process.exit(1);
|
process.exit(1);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -271,7 +269,7 @@ async function main(): Promise<void> {
|
|||||||
process.exit(1);
|
process.exit(1);
|
||||||
}
|
}
|
||||||
|
|
||||||
const result = await parseMarkdownForWechat(markdownPath, { title, theme });
|
const result = await convertMarkdown(markdownPath, { title, theme });
|
||||||
console.log(JSON.stringify(result, null, 2));
|
console.log(JSON.stringify(result, null, 2));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ import fs from 'node:fs';
|
|||||||
import path from 'node:path';
|
import path from 'node:path';
|
||||||
import { spawnSync } from 'node:child_process';
|
import { spawnSync } from 'node:child_process';
|
||||||
import process from 'node:process';
|
import process from 'node:process';
|
||||||
|
import { fileURLToPath } from 'node:url';
|
||||||
import { launchChrome, getPageSession, waitForNewTab, clickElement, typeText, evaluate, sleep, type ChromeSession, type CdpConnection } from './cdp.ts';
|
import { launchChrome, getPageSession, waitForNewTab, clickElement, typeText, evaluate, sleep, type ChromeSession, type CdpConnection } from './cdp.ts';
|
||||||
|
|
||||||
const WECHAT_URL = 'https://mp.weixin.qq.com/';
|
const WECHAT_URL = 'https://mp.weixin.qq.com/';
|
||||||
@@ -65,8 +66,9 @@ async function clickMenuByText(session: ChromeSession, text: string): Promise<vo
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function copyImageToClipboard(imagePath: string): Promise<void> {
|
async function copyImageToClipboard(imagePath: string): Promise<void> {
|
||||||
const scriptDir = path.dirname(new URL(import.meta.url).pathname);
|
const __filename = fileURLToPath(import.meta.url);
|
||||||
const copyScript = path.join(scriptDir, './copy-to-clipboard.ts');
|
const __dirname = path.dirname(__filename);
|
||||||
|
const copyScript = path.join(__dirname, './copy-to-clipboard.ts');
|
||||||
const result = spawnSync('npx', ['-y', 'bun', copyScript, 'image', imagePath], { stdio: 'inherit' });
|
const result = spawnSync('npx', ['-y', 'bun', copyScript, 'image', imagePath], { stdio: 'inherit' });
|
||||||
if (result.status !== 0) throw new Error(`Failed to copy image: ${imagePath}`);
|
if (result.status !== 0) throw new Error(`Failed to copy image: ${imagePath}`);
|
||||||
}
|
}
|
||||||
@@ -108,30 +110,54 @@ async function copyHtmlFromBrowser(cdp: CdpConnection, htmlFilePath: string): Pr
|
|||||||
}, { sessionId });
|
}, { sessionId });
|
||||||
await sleep(300);
|
await sleep(300);
|
||||||
|
|
||||||
console.log('[wechat] Copying with system Cmd+C...');
|
console.log('[wechat] Copying with CDP keyboard event...');
|
||||||
if (process.platform === 'darwin') {
|
const modifiers = process.platform === 'darwin' ? 4 : 2;
|
||||||
spawnSync('osascript', ['-e', 'tell application "System Events" to keystroke "c" using command down']);
|
await cdp.send('Input.dispatchKeyEvent', {
|
||||||
} else {
|
type: 'keyDown',
|
||||||
spawnSync('xdotool', ['key', 'ctrl+c']);
|
key: 'c',
|
||||||
}
|
code: 'KeyC',
|
||||||
|
modifiers,
|
||||||
|
windowsVirtualKeyCode: 67
|
||||||
|
}, { sessionId });
|
||||||
|
await sleep(50);
|
||||||
|
await cdp.send('Input.dispatchKeyEvent', {
|
||||||
|
type: 'keyUp',
|
||||||
|
key: 'c',
|
||||||
|
code: 'KeyC',
|
||||||
|
modifiers,
|
||||||
|
windowsVirtualKeyCode: 67
|
||||||
|
}, { sessionId });
|
||||||
await sleep(1000);
|
await sleep(1000);
|
||||||
|
|
||||||
console.log('[wechat] Closing HTML tab...');
|
console.log('[wechat] Closing HTML tab...');
|
||||||
await cdp.send('Target.closeTarget', { targetId });
|
await cdp.send('Target.closeTarget', { targetId });
|
||||||
}
|
}
|
||||||
|
|
||||||
async function pasteFromClipboardInEditor(): Promise<void> {
|
async function pasteFromClipboardInEditor(session: ChromeSession): Promise<void> {
|
||||||
if (process.platform === 'darwin') {
|
console.log('[wechat] Pasting with CDP keyboard event...');
|
||||||
spawnSync('osascript', ['-e', 'tell application "System Events" to keystroke "v" using command down']);
|
const modifiers = process.platform === 'darwin' ? 4 : 2;
|
||||||
} else {
|
await session.cdp.send('Input.dispatchKeyEvent', {
|
||||||
spawnSync('xdotool', ['key', 'ctrl+v']);
|
type: 'keyDown',
|
||||||
}
|
key: 'v',
|
||||||
|
code: 'KeyV',
|
||||||
|
modifiers,
|
||||||
|
windowsVirtualKeyCode: 86
|
||||||
|
}, { sessionId: session.sessionId });
|
||||||
|
await sleep(50);
|
||||||
|
await session.cdp.send('Input.dispatchKeyEvent', {
|
||||||
|
type: 'keyUp',
|
||||||
|
key: 'v',
|
||||||
|
code: 'KeyV',
|
||||||
|
modifiers,
|
||||||
|
windowsVirtualKeyCode: 86
|
||||||
|
}, { sessionId: session.sessionId });
|
||||||
await sleep(1000);
|
await sleep(1000);
|
||||||
}
|
}
|
||||||
|
|
||||||
async function parseMarkdownWithPlaceholders(markdownPath: string, theme?: string): Promise<{ title: string; author: string; summary: string; htmlPath: string; contentImages: ImageInfo[] }> {
|
async function parseMarkdownWithPlaceholders(markdownPath: string, theme?: string): Promise<{ title: string; author: string; summary: string; htmlPath: string; contentImages: ImageInfo[] }> {
|
||||||
const scriptDir = path.dirname(new URL(import.meta.url).pathname);
|
const __filename = fileURLToPath(import.meta.url);
|
||||||
const mdToWechatScript = path.join(scriptDir, 'md-to-wechat.ts');
|
const __dirname = path.dirname(__filename);
|
||||||
|
const mdToWechatScript = path.join(__dirname, 'md-to-wechat.ts');
|
||||||
const args = ['-y', 'bun', mdToWechatScript, markdownPath];
|
const args = ['-y', 'bun', mdToWechatScript, markdownPath];
|
||||||
if (theme) args.push('--theme', theme);
|
if (theme) args.push('--theme', theme);
|
||||||
|
|
||||||
@@ -295,6 +321,10 @@ export async function postArticle(options: ArticleOptions): Promise<void> {
|
|||||||
|
|
||||||
console.log('[wechat] Clicking on editor...');
|
console.log('[wechat] Clicking on editor...');
|
||||||
await clickElement(session, '.ProseMirror');
|
await clickElement(session, '.ProseMirror');
|
||||||
|
await sleep(1000);
|
||||||
|
|
||||||
|
console.log('[wechat] Ensuring editor focus...');
|
||||||
|
await clickElement(session, '.ProseMirror');
|
||||||
await sleep(500);
|
await sleep(500);
|
||||||
|
|
||||||
if (effectiveHtmlFile && fs.existsSync(effectiveHtmlFile)) {
|
if (effectiveHtmlFile && fs.existsSync(effectiveHtmlFile)) {
|
||||||
@@ -302,7 +332,7 @@ export async function postArticle(options: ArticleOptions): Promise<void> {
|
|||||||
await copyHtmlFromBrowser(cdp, effectiveHtmlFile);
|
await copyHtmlFromBrowser(cdp, effectiveHtmlFile);
|
||||||
await sleep(500);
|
await sleep(500);
|
||||||
console.log('[wechat] Pasting into editor...');
|
console.log('[wechat] Pasting into editor...');
|
||||||
await pasteFromClipboardInEditor();
|
await pasteFromClipboardInEditor(session);
|
||||||
await sleep(3000);
|
await sleep(3000);
|
||||||
|
|
||||||
if (contentImages.length > 0) {
|
if (contentImages.length > 0) {
|
||||||
@@ -328,7 +358,7 @@ export async function postArticle(options: ArticleOptions): Promise<void> {
|
|||||||
await sleep(200);
|
await sleep(200);
|
||||||
|
|
||||||
console.log('[wechat] Pasting image...');
|
console.log('[wechat] Pasting image...');
|
||||||
await pasteFromClipboardInEditor();
|
await pasteFromClipboardInEditor(session);
|
||||||
await sleep(3000);
|
await sleep(3000);
|
||||||
}
|
}
|
||||||
console.log('[wechat] All images inserted.');
|
console.log('[wechat] All images inserted.');
|
||||||
|
|||||||
@@ -359,9 +359,8 @@ With confirmed outline + style + layout:
|
|||||||
**Watermark Application** (if enabled in preferences):
|
**Watermark Application** (if enabled in preferences):
|
||||||
Add to each image generation prompt:
|
Add to each image generation prompt:
|
||||||
```
|
```
|
||||||
Include a subtle watermark "[content]" positioned at [position]
|
Include a subtle watermark "[content]" positioned at [position].
|
||||||
with approximately [opacity*100]% visibility. The watermark should
|
The watermark should be legible but not distracting from the main content.
|
||||||
be legible but not distracting from the main content.
|
|
||||||
```
|
```
|
||||||
Reference: `references/config/watermark-guide.md`
|
Reference: `references/config/watermark-guide.md`
|
||||||
|
|
||||||
|
|||||||
@@ -15,7 +15,6 @@ watermark:
|
|||||||
enabled: false
|
enabled: false
|
||||||
content: ""
|
content: ""
|
||||||
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
position: bottom-right # bottom-right|bottom-left|bottom-center|top-right
|
||||||
opacity: 0.7 # 0.1-1.0
|
|
||||||
|
|
||||||
preferred_style:
|
preferred_style:
|
||||||
name: null # Built-in or custom style name
|
name: null # Built-in or custom style name
|
||||||
@@ -46,7 +45,6 @@ custom_styles:
|
|||||||
| `watermark.enabled` | bool | false | Enable watermark |
|
| `watermark.enabled` | bool | false | Enable watermark |
|
||||||
| `watermark.content` | string | "" | Watermark text (@username or custom) |
|
| `watermark.content` | string | "" | Watermark text (@username or custom) |
|
||||||
| `watermark.position` | enum | bottom-right | Position on image |
|
| `watermark.position` | enum | bottom-right | Position on image |
|
||||||
| `watermark.opacity` | float | 0.7 | Transparency (0.1-1.0) |
|
|
||||||
| `preferred_style.name` | string | null | Style name or null |
|
| `preferred_style.name` | string | null | Style name or null |
|
||||||
| `preferred_style.description` | string | "" | Custom notes/override |
|
| `preferred_style.description` | string | "" | Custom notes/override |
|
||||||
| `preferred_layout` | string | null | Layout preference or null |
|
| `preferred_layout` | string | null | Layout preference or null |
|
||||||
@@ -97,7 +95,6 @@ watermark:
|
|||||||
enabled: true
|
enabled: true
|
||||||
content: "@myxhsaccount"
|
content: "@myxhsaccount"
|
||||||
position: bottom-right
|
position: bottom-right
|
||||||
opacity: 0.5
|
|
||||||
|
|
||||||
preferred_style:
|
preferred_style:
|
||||||
name: notion
|
name: notion
|
||||||
|
|||||||
@@ -28,15 +28,6 @@ description: Watermark configuration guide for baoyu-xhs-images
|
|||||||
| `bottom-center` | Centered designs | Text-heavy bottom area |
|
| `bottom-center` | Centered designs | Text-heavy bottom area |
|
||||||
| `top-right` | Bottom-heavy content | Title/header in top-right |
|
| `top-right` | Bottom-heavy content | Title/header in top-right |
|
||||||
|
|
||||||
## Opacity Examples
|
|
||||||
|
|
||||||
| Opacity | Visual Effect | Use Case |
|
|
||||||
|---------|---------------|----------|
|
|
||||||
| 0.3 | Very subtle, barely visible | Clean aesthetic priority |
|
|
||||||
| 0.5 | Balanced, noticeable but not distracting | Default recommendation |
|
|
||||||
| 0.7 | Clearly visible | Brand recognition priority |
|
|
||||||
| 0.9 | Strong presence | Anti-copy protection |
|
|
||||||
|
|
||||||
## Content Format
|
## Content Format
|
||||||
|
|
||||||
| Format | Example | Style |
|
| Format | Example | Style |
|
||||||
@@ -51,23 +42,21 @@ description: Watermark configuration guide for baoyu-xhs-images
|
|||||||
1. **Consistency**: Use same watermark across all images in series
|
1. **Consistency**: Use same watermark across all images in series
|
||||||
2. **Legibility**: Ensure watermark readable on both light/dark areas
|
2. **Legibility**: Ensure watermark readable on both light/dark areas
|
||||||
3. **Size**: Keep subtle - should not distract from content
|
3. **Size**: Keep subtle - should not distract from content
|
||||||
4. **Contrast**: Opacity may need adjustment per image background
|
|
||||||
|
|
||||||
## Prompt Integration
|
## Prompt Integration
|
||||||
|
|
||||||
When watermark is enabled, add to image generation prompt:
|
When watermark is enabled, add to image generation prompt:
|
||||||
|
|
||||||
```
|
```
|
||||||
Include a subtle watermark "[content]" positioned at [position]
|
Include a subtle watermark "[content]" positioned at [position].
|
||||||
with approximately [opacity*100]% visibility. The watermark should
|
The watermark should be legible but not distracting from the main content.
|
||||||
be legible but not distracting from the main content.
|
|
||||||
```
|
```
|
||||||
|
|
||||||
## Common Issues
|
## Common Issues
|
||||||
|
|
||||||
| Issue | Solution |
|
| Issue | Solution |
|
||||||
|-------|----------|
|
|-------|----------|
|
||||||
| Watermark invisible | Increase opacity or adjust position |
|
| Watermark invisible | Adjust position or check contrast |
|
||||||
| Watermark too prominent | Decrease opacity (0.3-0.5) |
|
| Watermark too prominent | Change position or reduce size |
|
||||||
| Watermark overlaps content | Change position |
|
| Watermark overlaps content | Change position |
|
||||||
| Inconsistent across images | Use session ID for consistency |
|
| Inconsistent across images | Use session ID for consistency |
|
||||||
|
|||||||
Reference in New Issue
Block a user