@ianneo_ai: 我的天!我的 Skill 在 GitHub 本周排第二啦! 刚刷到藏师傅项目冲到第一,我点进去一看,笑死,我这个也在榜上,排第二 就是这个中文小黑怪诞正文配图生成 Skill: http://github.com/helloianneo/…
摘要
作者发布了一个名为 Ian Xiaohei Illustrations 的 Codex Skill,用于指导 AI Agent 为中文文章生成 16:9 白底手绘怪诞配图,该仓库在 GitHub 周榜排名第二。
查看缓存全文
缓存时间: 2026/05/31 09:04
我的天!我的 Skill 在 GitHub 本周排第二啦! 刚刷到藏师傅项目冲到第一,我点进去一看,笑死,我这个也在榜上,排第二 就是这个中文小黑怪诞正文配图生成 Skill: http://github.com/helloianneo/ian-xiaohei-illustrations… 本来只是给自己做 notion 文档配图用的,16:9 白底手绘,少量红橙蓝批注,没想到也被顶上来了
helloianneo/ian-xiaohei-illustrations
Source: https://github.com/helloianneo/ian-xiaohei-illustrations
Ian Xiaohei Illustrations
把中文文章里的判断、流程、状态和隐喻,变成一张张白底、手绘、怪诞但清爽的正文配图。
16:9 横版 | 小黑 IP | 纯白手绘 | 少量红橙蓝中文批注 | Codex Skill
这个仓库是什么
Ian Xiaohei Illustrations 是一个 Codex Skill,用来指导 AI Agent 为中文文章、帖子、博客、Notion 文档和方法论内容生成正文配图。
它不是通用插画 prompt,也不是 PPT 信息图模板。它的核心目标是:先理解文章里的认知锚点,再把其中一个判断、流程、结构、状态或隐喻,变成一张有记忆点的 16:9 手绘解释图。
默认视觉 IP 是“小黑”:一个黑色实心、白点眼、细腿、空表情的小角色。小黑不是吉祥物,不是贴纸,也不是站在角落里的装饰物,而是正在认真参与系统运转的荒诞工作者。
一句话:让 AI 不只是“配一张图”,而是把文章里的一个关键认知动作画出来。
适合谁用
特别适合:
- 写中文文章,需要正文配图和文章插图的人
- 做知识型内容、方法论内容、AI 工作流内容的人
- 想把抽象判断画成具体隐喻的人
- 想要一种比 PPT 信息图更轻、更怪、更有个人识别度的配图风格的人
- 用 Codex 做内容生产,希望稳定复用一套视觉语言的人
不适合:
- 想要商业插画、品牌 KV 或精致扁平插画的人
- 想要传统 PPT 信息图、复杂架构图或流程图的人
- 想要儿童卡通、可爱 IP、表情包风格的人
- 想把大量正文、长段解释或完整课程页塞进一张图里的人
- 需要严格可编辑矢量源文件的人
它会产出什么
默认输出:
- 16:9 横版正文配图
- 一篇文章的 4-8 张 shot list
- 每张图的主题、核心意思、结构类型、小黑动作和中文标注建议
- 最终 PNG 图片,保存到 workspace 的
assets/<article-slug>-illustrations/
默认不输出:
- PPTX / PDF / Keynote
- SVG / HTML / Canvas 可编辑图
- 商业海报或封面 KV
- 大段文字型信息图
视觉风格
这个 skill 默认使用 Ian 的“小黑怪诞正文配图”风格:
- 纯白背景,不要纸纹、米色、阴影、渐变
- 黑色手绘线稿,细线,轻微抖动
- 大量留白,主体只占画面约 40%-60%
- 少量红色、橙色、蓝色中文手写批注
- 一张图只表达一个核心动作、结构、状态或隐喻
- 小黑必须参与核心动作,不能只是装饰
- 怪诞、有创意、清爽,但不幼稚、不卖萌
示例效果
两个断点

按目的分拣

一鱼多吃

承接路径

信息井

想法压机

内容发酵

信任桥

这些图片是风格校准样例,不是构图模板。使用时应该从当前文章重新发明隐喻,不要照抄旧案例的物件和构图。
安装
克隆仓库:
git clone https://github.com/helloianneo/ian-xiaohei-illustrations.git
cd ian-xiaohei-illustrations
复制 skill 到 Codex skills 目录:
mkdir -p "${CODEX_HOME:-$HOME/.codex}/skills"
cp -R ./ian-xiaohei-illustrations "${CODEX_HOME:-$HOME/.codex}/skills/"
安装后,在 Codex 里使用:
Use $ian-xiaohei-illustrations 为这篇中文文章设计并生成 5 张小黑怪诞正文配图。
怎么用
只做配图规划
Use $ian-xiaohei-illustrations 先不要生图。
请分析下面这篇文章哪里值得配图,输出 5 张左右的 shot list。
每张图写清楚:放在哪段后、主题、核心意思、结构类型、小黑在做什么、建议中文标注词。
<粘贴文章>
直接生成正文配图
Use $ian-xiaohei-illustrations 把下面这篇文章生成 4 张小黑怪诞正文配图。
要求:16:9 横版、纯白背景、黑色手绘线稿、少量红橙蓝中文手写批注。
<粘贴文章>
为单个概念生成一张图
Use $ian-xiaohei-illustrations 为“信任不是喊出来的,而是一块证据一块证据铺过去”生成一张正文配图。
画面要怪诞但清爽,小黑必须承担核心动作。
去掉图里的标题或错误文字
Use $ian-xiaohei-illustrations 帮我编辑这张图,去掉左上角的“流程图”标题,其他内容保持不变。
更多示例见 examples/prompts.md。
工作流程
这个 skill 的流程是:
- 读取文章、Markdown、Notion 内容、截图或用户给的主题
- 提炼核心观点、认知转折、流程结构和适合视觉化的段落
- 先输出 shot list:每张图只选一个认知锚点
- 为每张图选择结构类型:Workflow、系统局部、前后对比、角色状态、概念隐喻、方法分层、地图路线或小漫画分镜
- 重新发明一个低科技、怪诞但成立的物理隐喻
- 让小黑承担核心动作
- 每张图单独调用图像模型生成
- 按 QA checklist 检查:白底、留白、小黑动作、中文标注、非 PPT 感、非旧案例复刻
- 保存最终 PNG,并报告用途和路径
目录结构
.
├── README.md
├── LICENSE
├── NOTICE.md
├── assets/
│ └── ian-wechat-qr.jpg
├── examples/
│ ├── images/
│ │ ├── 01-two-breakpoints.png
│ │ ├── 02-sort-by-purpose.png
│ │ └── ...
│ └── prompts.md
└── 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
真正需要安装到 Codex 的是子目录:
ian-xiaohei-illustrations/
根目录的 README、LICENSE、NOTICE 和 examples 是 GitHub 分享文档。
注意事项
- 图片里的中文文字越短越稳定。
- 每张图只讲一个核心结构,不要把文章做成说明书。
- 小黑必须承担核心动作;如果去掉小黑画面仍然完全成立,说明小黑太装饰了。
- 示例图只用于校准线条密度、留白、颜色克制和小黑参与方式,不要复刻构图。
- AI 图像模型可能出现错字、幻觉标签、风格漂移或多余标题,生成后需要检查。
- 如果中文错字严重,优先减少标注词并重生成。
相关项目
- Ian Handdrawn PPT — 中文手绘技术 PPT-style 页面图生成 Skill
- Awesome Claude Code Skills — Claude Code Skills / Agents / Plugins 精选合集
- Obsidian + Claude AI Second Brain — Obsidian + Claude AI 个人知识库搭建指南
关于作者
Ian (伊恩) — 产品设计师 / 一人公司实践者 / AI Builder
用 AI 团队打造一人公司。
- GitHub: helloianneo
- X/Twitter: @ianneo_ai
- 网站: ianneo.xyz
- 微信:
ianneoxyz - 邮箱: [email protected]
继续探索
这套小黑配图 Skill,只是我用 AI 搭建个人生产系统里的一个小工具。
如果你也在用 AI 做内容、知识库、工作流或产品化,可以继续看我的网站:ianneo.xyz。
只想先观察,可以关注我的 X/Twitter。
想了解 Indie Builders Club,加微信:ianneoxyz,备注「OPC」。
不方便扫码也可以搜索微信:ianneoxyz。
License
MIT License. See LICENSE.
相似文章
@op7418: 我去,太牛批了! 我的 Skill 冲到 GitHub 本周新建项目 Star 排名第一了! 就是这个社交媒体卡片 Skill (guizang-social-card-skill) 还是刚才一个群友让他的 Agent 找项目的时候发现的…
开发者@op7418的社交媒体卡片项目guizang-social-card-skill在GitHub本周新建项目Star排名中夺得第一。
@Moting284: https://x.com/Moting284/status/2065292889207558556
介绍一款名为“小黑配图”的Codex skill,用于生成符合文章正文的手绘风格配图,解决AI配图空洞或PPT化的问题。文章详细说明skill的安装、使用方法和最佳实践,强调认知锚点提取和生成后质检。
@axichuhai: https://x.com/axichuhai/status/2062146611472400461
分享8个精选的AI Skill(技能),涵盖基础配置、产品开发和内容创作,帮助提升AI生产力,适用于Claude Code和CodeX等Agent。
@axichuhai: 卧槽,有个编程大神把自己的工程经验蒸馏成了一个开源项目 GitHub 热榜第一,Star数直接冲上了9万 + 作者是前 Vercel 工程师 Mat,参与过 Next.js 早期开发,以把复杂技术讲得通俗易懂著称。 他把日常和 Claud…
介绍一个登顶GitHub热榜的开源项目hello-agents,它系统整理了AI和Agent从理论到实践的课程,涵盖Agentic RL、SFT、GRPO等技能,由前Vercel工程师Mat参与,将工程经验蒸馏为16个skill,如Grim提示词技巧和红绿循环测试方法。
@GitTrend0x: 今天 GitHub Agent & AI 工具继续霸榜 5 个星标暴增最狠的项目,专业拆解+实用场景,一文看懂! 1. anthropics/financial-services Anthropic 官方推出的金融服务智能体框架!支持复杂…
文章盘点 GitHub 上近期星标增长最快的五个 AI Agent 项目,重点介绍了 Anthropic 的金融服务智能体框架、字节跳动的 UI-TARS 桌面端以及各类编码 Agent 工具。