让 AI Agent 自动给中文文章画「小黑手绘配图」

写文章这件事，现在经常是正文先出来，配图最后卡住。

尤其是技术文章、AI 教程和工作流复盘。随手补一张“蓝紫色未来科技感”的图，版面是填满了，但读者看完并不会更理解这一段。真正有用的正文配图，应该帮人抓住一个判断、一个流程，或者一个容易卡住的地方。

https://github.com/helloianneo/ian-xiaohei-illustrations 是一个给 Codex 用的 Skill。它的目标不是做海报，而是把中文文章里值得被画出来的部分，做成白底、手绘、带一点怪诞感的小黑配图。

它到底在做什么

这个项目有一个固定角色，叫“小黑”：黑色实心身体、白点眼睛、细腿，表情很淡定。关键不在角色长相，而在于它得亲自干活。

比如文章讲“信息从输入到输出会经过筛选”，小黑不能站在角落卖萌；它应该在筛选这件事里承担动作。这样一张图才是在解释内容，而不是往正文旁边贴贴纸。

它的工作方式大致是这样：

文章
  ↓
找出值得画出来的认知锚点
  ↓
先给出 shot list（配图清单）
  ↓
为每张图设计一个新的视觉隐喻
  ↓
让小黑承担核心动作
  ↓
逐张生成、检查并保存 PNG

仓库默认产出的是 16:9 横版正文配图：纯白背景、黑色手绘线稿，配少量红、橙、蓝色中文批注。每张图只讲一个核心意思。它不适合拿来做商业 KV、复杂架构图、PPT 信息图，或者一张塞满整篇文章内容的“知识海报”。

它和普通图片 Prompt 有什么区别

普通 Prompt 更像：

这一次，请按我的要求画。

Skill 更像：

以后遇到这一类任务，都先按这套方法判断，再动手做。

Ian Xiaohei Illustrations 不是把“帮我画小黑人”保存成一句话。它把风格、角色、小黑该做什么、构图怎么避坑、生图提示词模板和验收规则放在了一起。Agent 读到这些资料后，能少走一点“画得挺好看，但和文章没关系”的弯路。

Skill 目录里有什么

仓库根目录里有说明文档、示例和真正需要安装的 Skill。安装目标是下面这个子目录，而不是整个仓库：

ian-xiaohei-illustrations/
├── SKILL.md
├── agents/
│   └── openai.yaml
├── assets/
│   └── examples/
└── references/
    ├── style-dna.md
    ├── xiaohei-ip.md
    ├── composition-patterns.md
    ├── prompt-template.md
    └── qa-checklist.md

其中 `SKILL.md` 写的是工作流；`agents/openai.yaml` 提供了在 Codex 里的展示名称、默认提示词和隐式调用设置；`references/` 负责约束风格、构图和检查标准；`assets/examples/` 只用来低频校准画风，别把它当模板库来抄。

怎么安装到 Codex

下面是仓库 README 给出的安装方式。建议在你放代码或工具的目录执行。

1. 克隆仓库

git clone https://github.com/helloianneo/ian-xiaohei-illustrations.git
cd ian-xiaohei-illustrations

第一行把 GitHub 仓库下载到本地；第二行进入刚下载的仓库目录。此时你看到的是项目根目录，里面既有 README，也有真正的 Skill 子目录。

2. 复制真正的 Skill 目录

mkdir -p "${CODEX_HOME:-$HOME/.codex}/skills"
cp -R ./ian-xiaohei-illustrations "${CODEX_HOME:-$HOME/.codex}/skills/"

第一行确保 Codex 的 `skills` 目录存在。`{CODEX_HOME:-HOME/.codex}` 的意思是：如果你配置了 `CODEX_HOME`，就用它；没有配置时，就使用默认的 `~/.codex`。

第二行把仓库内的 `ian-xiaohei-illustrations/` 子目录完整复制进去。不要误把仓库根目录整体复制过去，否则 Codex 的 Skill 目录会多套一层不必要的文档和示例。

安装完成后，重开 Codex 或新开一个会话，再调用这个 Skill。

能不能把 GitHub 地址直接扔给 Agent，让它自己装？

可以，但别只发一个链接然后默认它什么都做对。更稳妥的方式是明确让它阅读仓库 README，并把子目录安装到 Codex 的 Skills 目录。

你可以这样说：

请阅读 https://github.com/helloianneo/ian-xiaohei-illustrations 的 README，
按仓库当前说明安装 ian-xiaohei-illustrations 这个 Codex Skill。
安装前先确认目标目录，安装后告诉我最终路径。

这段话的重点有两个：让 Agent 以仓库当前 README 为准；强调安装的是 `ian-xiaohei-illustrations/` 子目录。执行安装会改动本机文件，因此 Agent 正常情况下会请求权限。你确认前，最好看一眼它要写入的路径是不是自己的 Codex 配置目录。

如果你想自己掌控每一步，还是直接用上一节的两组命令更省心。

安装后怎么用

最简单的用法，是把一篇文章贴给 Codex，让它直接产图：

Use $ian-xiaohei-illustrations 把下面这篇文章生成 4 张小黑怪诞正文配图。
要求：16:9 横版、纯白背景、黑色手绘线稿、少量红橙蓝中文手写批注。
每张图只讲一个核心结构，不要做 PPT 信息图，不要可爱卡通。

<粘贴文章>

这里的 `$ian-xiaohei-illustrations` 是在指定要用哪个已安装的 Skill。后面的要求没有重复整套风格规范，而是告诉 Agent 这次要生成几张图，以及保留哪些边界。

不过我更喜欢先做配图规划。长文直接生四五张图，容易把不值得画的段落也画进去。

Use $ian-xiaohei-illustrations 先不要生图。
请分析下面这篇文章哪里值得配图，输出 5 张左右的 shot list。
每张图写清楚：
- 放在哪个段落后
- 图的主题
- 核心意思
- 结构类型
- 小黑在图里做什么
- 建议元素
- 建议中文标注词

<粘贴文章>

这次要求输出的是 shot list，也就是配图方案。你先看选点是否合理，再决定生成哪些图。仓库的默认建议是 4 到 8 张；短文章少一点，够用就行。

如果你只有一句想法，也能只做一张：

Use $ian-xiaohei-illustrations 为这个观点生成一张 16:9 正文配图：

信任不是喊出来的，而是一块证据一块证据铺过去。

画面要怪诞但清爽，小黑必须承担核心动作。
中文标注最多 5 个，短一点。

这条指令把抽象观点交给 Skill。它会尽量把观点换成一个看得懂的物理动作，而不是画一张写满解释文字的图。

图已经生成了，怎么改

图片模型偶尔会多写标题，或者小黑站得太边缘。这也是为什么 Skill 里带了 QA 规则。

要去掉左上角多余标题，可以这样写：

Use $ian-xiaohei-illustrations 帮我编辑这张图。
去掉左上角的“Workflow / 流程图”标题和下划线，其他内容保持不变。
不要新增任何文字或物件。

这条提示只授权修改左上角标题，避免模型顺手改掉人物、路径和整体构图。

如果画面方向对了，但小黑只是一个装饰角色，可以这样要求重生成：

Use $ian-xiaohei-illustrations 这张图方向对，但小黑有点像装饰。
请保持核心意思不变，重生成一版：让小黑成为真正推动结构运转的人。
画面更怪一点，但仍然纯白、清爽、少字。

生成后看这几件事

不用把验收搞得很复杂。看一眼下面几项就够了：

• 是不是 16:9 白底图，且留白足够；

• 小黑是否在做核心动作，而不是站在旁边；

• 一张图是否只说清一个东西；

• 中文标注是否短、少、读得出来；

• 画面是否像一张手绘草图，而不是 PPT、复杂流程图或儿童卡通。

还有几条很实用的细节，直接来自这个 Skill 的约束：

• 中文字越少越稳。尽量把标注压到 2 到 8 个字，整张图控制在 5 到 8 处以内。

• 主体别占满画面。大约 40% 到 60% 就够，白底留出来，图才有呼吸感。

• 颜色要有分工：黑色负责主体；橙色画主路径和箭头；红色只用在问题、提醒或结果；蓝色用于补充说明或系统状态。

• 不要默认照抄仓库案例。相同主题也该换一个物件和动作，比如用纸箱、抽屉、旧机器、闸门或梯子，重新想一个低科技的隐喻。

• 如果错字很多，先减少标注再重生成；如果画面太像 PPT，就删掉标题、整齐网格和过多箭头。

仓库建议把最终 PNG 放到当前 workspace 的下面这个目录：

assets/<article-slug>-illustrations/

例如文章 slug 是 `my-ai-workflow`，图片目录就可以是：

assets/my-ai-workflow-illustrations/

写在最后

Ian Xiaohei Illustrations 最有意思的地方，是它把“给文章配图”从一个很随意的生图动作，变成了一套有判断的工作流。

它不会保证每一张都一次命中。中文错字、额外标题、构图太满，仍然是图像模型常见的问题。但如果你一直在写中文知识内容、AI 工作流或产品方法论，这个 Skill 至少给了你一套可复用的起点：先找文章真正的认知锚点，再让图片去帮读者理解它。

项目地址：https://github.com/helloianneo/ian-xiaohei-illustrations