# Article Image

> 为文章生成精美的封面图及文中插图。自动分析文章结构，在合适的段落插入相关的手绘风格插图，提升阅读体验。触发词："生成封面及插图"、"为文章配图"、"美化文章"。

- Skill: `gusibi/article-image` (Agent Skill, multi-file: 13 files)
- Install (CLI): `npx skillmds@latest add gusibi/article-image`
- Raw SKILL.md: https://api.skillmd.com/api/skills/gusibi/article-image/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: gusibi (https://skillmd.com/u/gusibi)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/gusibi/article-image

---


# 文章插图生成器

为文章生成手绘风格封面及文中插图，自动上传至 R2 并在合适位置插入链接。

## 使用方式

```bash
# 生成封面及建议的文中插图（默认模式）
/article-image path/to/article.md

# 仅生成封面
/article-image path/to/article.md --only-cover

# 指定风格生成全套图片
/article-image path/to/article.md --style tech

# 直接解析内容并生成建议
/article-image
[粘贴内容]
```

## 选项

| 选项 | 说明 |
|------|------|
| `--style <名称>` | 指定统一的视觉风格 |
| `--only-cover` | 仅生成封面图，不添加文中插图 |
| `--count <数量>` | 限制文中插图的最大数量（默认根据长度自动决定） |
| `--no-title` | 封面图不含标题文字 |
| `--no-upload` | 仅生成本地图片，不上传至 R2 |

## 风格列表

| 风格 | 说明 |
|------|------|
| `elegant`（默认） | 精致、优雅、低调 |
| `tech` | 现代、极简、科技感 |
| `warm` | 温暖、亲切、人文关怀 |
| `bold` | 高对比、吸睛、活力十足 |
| `minimal` | 极简、禅意、专注 |
| `playful` | 有趣、创意、俏皮 |
| `nature` | 自然、平静、质朴 |
| `retro` | 复古、怀旧、经典 |

## 自动风格选择

未指定 `--style` 时，根据内容关键词自动选择：

| 内容特征 | 选择风格 |
|----------|----------|
| AI、编程、技术、算法、数字化 | `tech` |
| 个人故事、情感、成长、生活 | `warm` |
| 争议性、紧急、必读、警告 | `bold` |
| 极简、禅、专注、本质 | `minimal` |
| 有趣、轻松、入门、教程 | `playful` |
| 自然、环保、健康、养生 | `nature` |
| 历史、传统、怀旧、经典 | `retro` |
| 商业、专业、策略、分析 | `elegant` |

## 工作流程

### 步骤 1：深度内容分析

从全篇中提取：
- **核心主题**：用于封面。
- **关键转折/概念点**：识别适合配图的"插图点"（Illustration Points）。
- **视觉风格信号**：确定全系列统一的视觉基调。

### 步骤 2：识别插图点

除非指定 `--only-cover`，否则需找出 1-3 个（视文章长度而定）关键位置：
1. **抽象概念转述处**：需要视觉辅助理解的地方。
2. **长段落分隔处**：转换话题或需要视觉休息的地方。
3. **情感共鸣点**：强调核心观点或金句的地方。

### 步骤 3：生成系列概念

为选定的每个点（含封面）生成独立提示：

**封面**：提炼 8 字以内标题，气势恢宏或极简。
**文中插图**：侧重局部细节、隐喻符号，不含文字，保持视觉一致性。

### 步骤 4：创建提示文件

生成图片生成提示，保存至 `imgs/prompts/` 目录下：

```markdown
# 封面/插图 [名称]
主题：[关键描述]
风格：[风格名称]
类型：[封面/文中插图]
...
```

```markdown
封面主题：[用 2-3 个词描述主题]
风格：[选定的风格名称]

[如包含标题：]
标题文字：[8 个字符以内，使用内容语言]
副标题：[可选，使用内容语言]

视觉构图：
- 主视觉：[符合风格的描述]
- 布局：[根据是否有标题调整]
- 装饰元素：[风格相关的元素]

配色方案：
- 主色：[风格主色调]
- 背景：[风格背景色]
- 强调色：[风格强调色]

风格说明：[需强调的风格特征]

[如无标题：]
注意：纯视觉插图，不含任何文字。
```

### 步骤 5：生成图片

使用 `scripts/generate_image.py` 脚本生成图片：

**API Key 配置**（二选一）：
1. 环境变量：`export MODELSCOPE_API_KEY="your-api-key"`
2. 命令行参数：`--api-key "your-api-key"`

```bash
# 使用环境变量中的 API Key
python scripts/generate_image.py --prompt "提示内容" --output path/to/imgs/cover.png

# 或直接传入 API Key
python scripts/generate_image.py --prompt "提示内容" --output path/to/imgs/cover.png --api-key "ms-xxx"

# 指定图片尺寸（默认 1024×576，16:9比例）
python scripts/generate_image.py --prompt "提示内容" --output cover.png --width 1920 --height 1080
```

**尺寸参数说明**：

| 参数 | 说明 | 默认值 |
|------|------|--------|
| `--width` | 图片宽度（像素） | 1024 |
| `--height` | 图片高度（像素） | 576 |

常用尺寸参考：
- **16:9 宽屏**：`--width 1024 --height 576`（默认）
- **1:1 方形**：`--width 1024 --height 1024`
- **手机竖屏**：`--width 576 --height 1024`

脚本功能：
- 调用 ModelScope API 生成图片
- 支持自定义图片尺寸（默认 1024×576，16:9 比例）
- 支持异步任务模式，自动轮询等待结果
- 自动创建输出目录
- 保存图片到指定路径

### 步骤 6：上传至 R2

除非指定 `--no-upload`，否则自动上传图片：

```bash
# 使用默认端口 38123
python scripts/upload_image.py path/to/imgs/cover.png

# 指定端口
python scripts/upload_image.py path/to/imgs/cover.png --port 8080
```

脚本说明：
- 通过本地代理服务上传（默认端口 38123）
- 自动解析 JSON 响应提取图片 URL
- 返回 R2 存储的公开访问 URL
- 确保代理服务正在运行

**解析返回结果**，提取图片 URL，格式类似：
```
https://your-r2-domain.com/path/to/cover.png
```

### 步骤 7：智能插入文章

1. **封面图**：按原规则插入文章开头。
2. **文中插图**：
   - 插入在选定的"插图点"之前的空行。
   - 使用标准 Markdown 语法：`![插图描述](URL)`。
   - 如果对应段落有小标题，通常插在小标题下方。

### 步骤 8：输出摘要

输出包含所有已生成图片的列表及链接。

```
封面图片已生成！

主题：[主题]
风格：[风格名称]
标题：[封面标题] 或 "无标题 - 纯视觉"
本地路径：[输出路径]
R2 链接：[上传后的 URL]
文章更新：已在 [文章路径] 中插入封面

请预览图片确认效果符合预期。
```

## 文件管理

### 有文章路径时

保存到文章同目录下的 `imgs/` 子目录：

```
path/to/
├── article.md（已更新，包含封面链接）
└── imgs/
    ├── prompts/
    │   └── cover.md
    └── cover.png
```

### 无文章路径时

保存到当前工作目录：

```
./
├── cover-prompt.md
└── cover.png
```

## 注意事项

- 封面在小尺寸预览时应清晰可辨
- 标题（如有）必须清晰醒目
- 视觉隐喻优于直译表达
- 保持风格一致性
- 图片生成通常需要 10-30 秒
- 上传前确保本地代理服务正在运行（端口 38123）
- 标题文字语言应与文章内容语言一致

