开源非常漂亮文章配图Skill

最近完成了一个颇有创意的项目。

起初只是想为 Claude 的一篇文章配上几张 3:4 的社交媒体配图，手边正好有一套自己制作的社交媒体素材 Skills，于是让 Codex 调用 GPT-Image 2.0 尝试生成。结果出乎意料地好。

干净的白色背景、克制的 3D 材质物件、中文标签直接嵌入在图片里。远看像杂志内页，近看细节也经得起推敲。发到群里和社交媒体后，好几个人追问制作方法。

既然效果已经验证，不如把这套方案做成一个正式的 Skill 分享出来。于是就有了 guizang-material-illustration（github.com/op7418/guizang-material-illustration）。

不过，从一段“能跑”的提示词，到一个别人拿过去也能稳定产出好图的 Skill，中间需要补充的功课远比想象中多。

它解决什么问题

写文章、做周报、发社交媒体、准备 PPT，都离不开配图。

封面倒不难，用模板就能搞定。

真正的痛点在于那种需要把一个概念、一套流程、一组数据讲清楚的配图。要么是直接把密密麻麻的截图贴上去，要么是 AI 画了一张很漂亮但谁看了都一头雾水的插画。

这套 Skill 要做的事很简单：把你的文章、笔记、数据或产品说明，变成一张带中文标签的解释图。

图里有箭头和标注，有清晰的空间关系。读者扫一眼，就能抓住你在说什么。

它不负责小红书的卡片排版，也不管 PPT 页面设计。只负责中心那张图，生成完直接放进其他工具里使用。

从随手写的提示词到正式 Skill

最初的提示词只能在特定场景下跑通。要让别人也能稳定使用，每个环节都得单独适配和打磨。

场景适配与统一视觉风格

最开始只能处理简单的流程图。但现实中需要配图的场景太杂了：

工作汇报与产品说明：进展、风险、决策、路线图，用流程和层级图来呈现。

数据图表——花时间最多的部分。AI 领域的测评图表普遍显得死板，千篇一律的柱状图和折线图。为此专门做了图表的材质化表达，让柱状图、甘特图、桑基图、热力图都带上 3D 质感。

教育解释图：小学的杠杆原理、中学的电磁感应，每个部件、力的方向、反应过程，位置都得标对。好看不够，必须准确。

人文配图：丝绸之路的商路、古诗里的月光意象、哲学概念的抽象关系。这类图最难，要在“有氛围”和“讲明白”之间找到平衡。

这些风格迥异的场景，最终被统一在同一套视觉语言下：白底工作室光线、克制的 3D 材质物件、一个鲜明的点缀色（默认 IKB 蓝）、图内嵌入短中文标签。看起来像是一套实体模型摆在白色桌面上拍出来的照片。

冷门概念与 Logo 的参考检索

测试过程中遇到了一个很实际的问题。

你让 AI 画一个 PKCE 流程图，或者画一个 Zettelkasten 卡片系统，它大概率不知道这些东西长什么样。更别说一些新产品的 Logo、特定的科学装置、历史文化物件。

解决方案是加一套判断逻辑：Agent 在生成之前先评估这个概念是否足够常见。如果判断是冷门的——比如一个管理学框架、一个生物实验器材、一个小众 AI 模型的标识——它就会先去检索参考信息和参考图片，提取视觉线索（轮廓、配色惯例、标志性形状），再统一转化成歸藏材质插画风格。

关键原则是：参考只用来理解事物本身长什么样，不用来复制画风。最终所有图都必须回到统一的视觉体系里。

让模型老老实实在图里写字

GPT-Image 2.0 的中文文字生成能力其实不错，但 AI Agent 有时候会“自作聪明”。它知道图像模型生成文字可能出错，干脆就不放文字，转而用 HTML 在图片外面贴标签。结果你拿到的是一张漂亮但什么都没标注的装饰图，外面围着一圈割裂的文字。

对解释图来说，图内标签就是内容本身。“用户提示”、“AI 执行”、“结果检查”这些短标签如果不在图里，读者就得来回对照，解释力直接打折。

在提示词层面反复纠正这个行为：要求标签必须生成在图片内部，限制每个标签 2-5 个汉字，指定空间位置（左上、右下、居中等），并要求放在干净的白色区域或标注板上。调了很多轮，现在标签的准确率已经稳定下来了。

图表不截图换皮，从数据重画

最直觉的做法是把原始图表截图扔给模型，让它“美化”一下。但这里有一个大坑：原始图表如果排版很差——密密麻麻的坐标、模糊的颜色、挤在一起的数据点——模型会继承这些糟糕的视觉特征。换了层皮，骨子里还是那张丑图。

最终采用的方案是“语义抽取”。Agent 先从图表截图或原始数据中提取真正重要的信息，包括图表类型、标题、结论、横纵坐标、数据值、单位、类别顺序、需要强调的极值或异常点。然后把这些纯语义信息交给 GPT-Image 2.0，让它从零画一张全新的材质化图表。

最终的图表可以有更大的标题区域、更清晰的数据呈现，旁边还能加入小场景和图标来辅助理解。再次强调，这不是换皮，而是从语义层面重新设计一张信息图。

反模式纠正与交付前审核

AI 配图有一些反复出现的坑，不专门防范就一定会踩。常见的问题包括：图里没有任何文字，明明要解释概念，结果画了一张纯氛围图；图里塞了一大段文字，把整段说明都挤进图片里，根本读不了；中文标签出错，写了错字、出现乱码、或者标签指向了错误的位置；提示词泄露，把生成时用的提示词内容直接显示在了成品图里；参考图照搬，模型把参考图里的水印、低画质背景、甚至原有的 UI 元素都一起复制了。

针对这些问题，在 Skill 的最后阶段加了一道 QA 审核。Agent 在交付之前逐项检查：标签对不对、数据对不对、画面有没有被裁切、有没有意外的水印或乱码。发现问题直接重新生成，不靠外部打补丁。

能做什么，不能做什么

熟悉 Skills 的人都知道，文章里一般会写清楚什么东西适合用这个做，什么东西不适合用这个做。没有什么是全能的，Skills 也做不到包揽所有事情。

适合的场景：

• 文章配图、知识解释图、概念拆解图
• 工作汇报配图、项目状态图
• 产品机制图、系统架构图
• 数据图表美化（柱状图、折线图、甘特图、桑基图、热力图、漏斗图）
• 教学材料配图（小学科学、中学物理化学生物）
• 人文观点配图（历史、哲学、文学意象）
• 社交卡片的中心图、PPT 的主视觉

不适合的：完整的小红书卡片排版（那是其他 Skill 的工作）、PPT 结构设计、真实摄影修图、人像写真、长文海报排版。

安装和使用

跟你的 Codex 说（其他 Agent 也行，但这套提示词没有在其他图像模型上测试过）：

帮我安装这个 Skill：npx skills add https://github.com/op7418/guizang-material-illustration --skill guizang-material-illustration

装好之后对 Agent 说自然语言就行，比如：

“用歸藏的材质插画 Skill，帮我把这段产品说明做成一张带中文标签的机制图”

“把这篇文章挑 3 个核心概念，各生成一张带字配图”

不用选模式、不用指定参数，Agent 会根据材料自动判断该生成什么类型的图。也可以跟其他相关的 Skill 配合，生成更丰富的内容。

这又是一个模型涌现的典型案例。今早为那篇文章生成测试图片时，其实并没有指定图像风格和类型，但模型自己挑选了一个非常合适的风格，而且颜色也和原来的主题色保持了一致。

很多时候，提供给 AI 的上下文真的很重要。一旦提供了足够丰富的上下文，它自己就会靠着审美和内容去达成统一、一致与和谐。

你是一名 AI 行业编辑，请围绕下面这条热点输出一份资讯解读：
热点：开源非常漂亮文章配图Skill要求：
1. 先用一句话解释这条热点在讲什么
2. 再总结它为什么重要
3. 说明会影响哪些 AI 产品或内容方向
4. 最后给出 3 个适合资讯站使用的标题