1. 定位与适用范围
服务对象:艺术设计、多模态 AI 和交叉学科的高校教师与科研团队。本 skill 管的是「示意类」图:用方框、箭头、分组、层级把一个研究的结构和过程讲清楚。
适用:
- 论文插图:方法框架、模型结构、系统架构、实验流程、概念示意、方案对比。
- 课题申报书:研究框架图、技术路线图、研究内容关系图、进度安排图。
- 书稿、学位论文按「此处应有图」批量配图;重绘旧图(把截图、手绘或 PPT 里的图重画成可编辑矢量图)。
不适用:
- 按数据绘制的统计图(柱状、折线、散点、热力图等),交给数据可视化流程或 matplotlib。
- 照片、效果图、生成式插画。
- 需要在代码库里长期维护的工程架构文档(这类用 Mermaid 放进仓库更合适,见 2.2)。
一条总原则:图要准确表达原文。图里出现的每个名称、关系、数字,都要能在用户给的材料里找到出处;找不到的就问,不要替用户编。
2. 图型选择
2.1 按「要表达什么」选图型
先用一句话说清这张图要回答的问题,再选图型。详细画法见 references/figure-types.md。
| 要表达什么 | 选这个图型 | 典型场景 |
|---|---|---|
| 研究由哪几块组成、各块什么关系 | 研究框架图(总—分、层级) | 申报书「研究框架」、论文总体框架 |
| 按什么步骤、用什么方法推进研究 | 技术路线图(纵向阶段 + 方法/产出两侧标注) | 申报书「技术路线」 |
| 一件事按顺序怎么做、在哪里分支 | 流程图(含判断、循环) | 实验流程、算法步骤、设计工作流 |
| 谁在哪个环节负责 | 泳道流程图 | 人机协作流程、多方参与的教学或设计流程 |
| 系统由哪些模块组成、数据怎么流 | 系统架构图(分层)/ 数据流图 | 平台、工具链、多模态管线 |
| 模型内部结构 | 模型结构图(标张量形状) | 网络结构、多模态融合模块 |
| 几个参与方按时间交互 | 时序图 | 人—系统—模型的交互过程 |
| 状态怎么切换 | 状态图 | 生成—评审—修改循环 |
| 一个抽象概念的内涵与关系 | 概念示意图(中心辐射、同心圆、坐标象限) | 理论模型、设计原则 |
| 几种方案的异同 | 对比图(并列栏、矩阵) | 本研究与已有方法对比 |
| 什么时候做什么 | 时间线 / 进度图 | 研究进度安排、发展脉络 |
一张图只回答一个问题。一个课题需要多张图时,把它们当作同一研究的不同「视角」:框架图、技术路线图、研究内容关系图共用同一套名称、编号和配色,读者翻页时能对上号。某个模块内部结构复杂,就单独再画一张下钻图,不要全塞进总图。
2.2 选输出技术
| 技术 | 什么时候用 | 交付物 |
|---|---|---|
| SVG(默认) | 投稿、申报书、书稿等所有要印刷或嵌入 Word 的图 | .svg 源 + PNG + 矢量 PDF |
| HTML | 课件展示、在线图库、需要交互或批量浏览 | 单文件 .html,内联 SVG,不依赖外部脚本 |
| draw.io | 用户或合作者要在 draw.io 里自己继续改;节点多(约 15 个以上)需要自动排版 | .drawio + 导出图 |
| Mermaid | 讨论阶段快速对结构;图要放进 Markdown、Obsidian、代码仓库随文本一起版本管理 | .mmd 文本 |
规则:
- 没有特别要求时用 SVG。它是矢量,能直接放进 Word/LaTeX,也能在 Illustrator、Inkscape、Figma 里改;新版 PowerPoint 插入 SVG 后可「转换为形状」再编辑。
- Mermaid 只负责结构,排版控制有限,适合做草稿;定稿要印刷时,按它的结构重画成 SVG,不要照搬它的默认样式。
- draw.io 和 Mermaid 的写法要点见
references/formats.md。 - 未发表的研究内容不要贴到在线编辑器或在线预览服务里渲染,全部在本机完成。
3. 学术配图规范
细则见 references/academic-specs.md(期刊与申报书要求)和 references/style.md(配色、字号、线宽)。动笔前必须落实下面几条:
- 先定成品尺寸,再画。 问清图最终放多宽:期刊单栏约 85–90 mm,双栏约 170–190 mm,申报书 A4 正文宽约 150–160 mm。不知道时按双栏 174 mm 画,并在交付时说明。
- 按成品算字号。 图缩到成品宽度后,最小字号不低于 7 pt(期刊常见下限 6–8 pt,以目标期刊作者指南为准);申报书建议不低于 9 pt(小五号)。推荐做法:SVG 的 viewBox 宽度取「成品宽 mm × 2.835」,这样 1 个单位就是 1 pt,
font-size="8"印出来就是 8 pt。 - 字号不超过 4 档,线宽不低于 0.5 pt。 主标签、次标签、注释、分图标号(a、b、c)各一档即可。
- 配色可打印、色盲友好。 类别区分用 Okabe–Ito 色板;不能只靠红绿区分;转成灰度后类别仍能分开(辅以线型、形状、文字标注)。图例只列图里真正用到的颜色。
- 一张图一种主语言。 英文期刊全英文;中文期刊和申报书以中文为主,模型名、方法名等专有名词保留英文原文。中英双语图题写在图注里,不要每个节点都中英并排。
- 图题和图注不画进图里。 投稿图和申报书图的标题写在图下方的图注中,图内只放内容。课件、展板版本可以另出一版带标题的。
- 图注自明。 读者不看正文也能读懂:说清图示内容,解释缩写、颜色和线型的含义,引用或改绘他人的图要注明来源。
- 留可编辑源文件。 文字保持为可编辑文字(不转曲),源文件、导出文件和说明放在同一个文件夹里交付。
4. 生成流程
第 0 步:收集信息
从用户材料里拿到下面这些;缺的项如果会明显改变结果就问,否则用默认值并在交付时写明:
- 这张图要回答的问题、用在哪里(哪本期刊 / 哪类申报书 / 课件)。
- 原文段落或要点(图的内容来源)。
- 成品宽度(默认 174 mm)、语言(默认跟随用户提问的语言)、是否需要黑白打印可读(申报书默认需要)。
- 已有的配色或样式约定(例如课题组统一色、前几张图的样式),有就沿用。
批量配图时,先从稿件里抽出所有「此处应有图」标记,连同前后段落列成清单,逐条确认图型再开画。
第 1 步:结构草图
先用文字写出结构,不写坐标:
- 节点清单:每个节点的名称和一句话说明,并注明它出自原文哪一段。
- 关系清单:谁指向谁、关系是什么(「支撑」「输出」「反馈」)。每条连线都要有含义;不写标签的连线,必须是两端节点已经说明清楚的情况。
- 分组与主线:哪些节点归为一组,读者先看哪条主线。
结构复杂、或用户对内容有分歧时,把草图(可以是一段 Mermaid)先给用户确认,再进入第 2 步。
第 2 步:生成
按 2.2 选的技术写源文件。布局要点(细则见 references/figure-types.md):
- 主线沿阅读方向排开(从上到下或从左到右),相邻步骤紧挨着放。
- 分支和辅助节点放在它所属节点的正上方或正下方,连线尽量是一段直线。
- 回流箭头(反馈、迭代)走主线旁边的空通道,不穿过其他节点。
- 一个节点连出多条线时,线分散到不同边上,不要挤在同一点。
- 箭头最后一段直线至少留出箭头长度的 2 倍,避免箭头压在拐角上。
- 判断节点的每个分支都写上「是 / 否」或条件。
- 先按标签长度留出节点宽度(中文一个字约占一个字号宽),不要画完再硬塞文字。
- 节点数不设指标,按内容定;超过约 15 个节点、手工排不开时,拆成总图加下钻图,或改用 draw.io 自动排版。
第 3 步:视觉自检
每次出图都要做,分两部分:
- 核数值:画布按「1 单位 = 1 pt」画,SVG 里的
font-size就是成品字号。逐个列出所有font-size,确认没有低于下限(期刊 7 pt、申报书 9 pt),字号档位不超过 4 档。文字是否出界、是否互相压住,用文字框的坐标和宽度(中文按一字一字号宽估算)核对。 - 看图:在浏览器里打开 SVG,并导出一张 PNG 和一张灰度 PNG(浏览器截图,或
inkscape 图.svg --export-type=png --export-dpi=600),逐项对照references/checklist.md:连线是否穿过节点、箭头是否指对、文字是否被遮挡、分组边界是否清楚、灰度下类别能否分辨、内容是否与原文一致。
看图容易漏掉几像素的错位,也会把没问题的地方看成问题。涉及位置的判断以 SVG 里的坐标数值为准,截图只作辅助。
第 4 步:修正
- 只改出问题的那一片区域,其他已经确认的布局保持不动。
- 修完重新走第 3 步。自动修正最多两轮;两轮后仍有问题,停下来把剩余问题和原因如实告诉用户,由用户决定。
- 用户提出修改意见时,先把上一版另存为
<名称>.v<N>.svg,不要覆盖已交付的版本。
第 5 步:导出与交付
按 6 节的目录结构交付。用户确认定稿后,再按目标期刊要求出最终格式(例如 TIFF、EPS、CMYK),这些转换在交付说明里注明用了什么工具。
5. 自检清单
交付前逐项确认,完整版见 references/checklist.md:
- 图里每个名称、关系、数字都能在原文中找到出处;推断出来的内容已向用户标明。
- 一张图只回答一个问题;多张图之间名称、编号、配色一致。
- 成品宽度下最小字号达标(期刊 ≥ 7 pt,申报书 ≥ 9 pt),字号不超过 4 档。
- 无压字、无出界、无连线穿过无关节点、箭头方向正确。
- 灰度下仍能分辨类别;没有只靠红绿区分的信息。
- 图内没有图题;图注已写好,缩写、颜色、线型都有解释。
- 中英文用法统一,标点全角半角一致,专有名词拼写正确。
- 源文件可编辑(文字未转曲),PNG ≥ 600 dpi,PDF 为矢量。
6. 输出要求
每张图一个文件夹,放在用户指定位置;未指定时放在当前工作目录的 figures/ 下:
figures/
fig03-technical-route/
fig03-technical-route.svg 源文件(可编辑)
fig03-technical-route-174mm-600dpi.png
fig03-technical-route-174mm-600dpi-gray.png
fig03-technical-route.pdf 矢量版
brief.md 图说
- 文件名用「图号-英文短名」,全小写、连字符分隔;图号与稿件一致。
brief.md写:图题(按目标语言,需要时中英双语)、图注全文、一句可直接放进正文的引用句(如「技术路线如图 3 所示」)、成品尺寸与字号下限、每个节点的原文出处、仍待用户确认的事项。- 批量任务另给一个
figures/index.html:用<img>平铺所有 SVG 并附图号和图题,便于一次浏览,不引用任何外部脚本。 - 回复用户时列出:文件路径、图型和尺寸、数值核对结果、是否已看图检查、剩余问题。没有做的检查不要说做过;数值核对通过不等于看图检查通过。
批量配图(10 张以上)可以按章节分给子代理并行画,每个子代理要拿到:本章的图清单和对应原文、第 3 节的规范、references/style.md 的色板与字号、输出目录。收齐后统一跑一遍 figcheck,再统一检查跨图的一致性。
精炼来源
[1] tt-a1i. archify(Archify 3.0.1,提交 69cf672). 路径:archify/SKILL.md、archify/references/authoring-defaults.md、archify/references/delivery-contract.md、archify/references/authoring-contract.md(Language consistency 节)、archify/assets/template.html. 借鉴:按「要回答的问题」选图型的路由表;先按连接关系定位置再给坐标的布局次序(主线、分支、回流、多出线分散);按标签长度预留节点宽度、中文按双倍宽计;连线标签承载含义;一张图一种主语言;修复只动出问题的局部、有次数上限;如实区分「机检通过」与「看过图」;Mermaid 只读结构、重新绘制不照搬样式;每次请求单独目录、改稿不覆盖旧版. 许可证:MIT(Copyright 2026 tt-a1i;2025 Cocoon AI). 链接:https://github.com/tt-a1i/archify
[2] Agents365-ai. drawio-skill(Draw.io Architecture Studio 3.4.0,提交 7aa92f7). 路径:skills/drawio-skill/SKILL.md、references/diagram-types.md、references/xml-authoring.md、references/style-presets.md、references/mermaid-authoring.md、references/troubleshooting.md、styles/built-in/colorblind-safe.json、scripts/validate.py. 借鉴:出图后视觉自检、最多两轮修正;截图看图不可靠,几何问题以渲染后的坐标为准;按图型预设形状与布局约定(流程图判断分支必须标注、泳道、模型结构图标张量形状);色盲安全色板(Okabe–Ito)加粗线;图例只列实际用到的颜色;节点多时不手排改用自动排版;箭头末段留足长度、判断节点分支向外走;缺信息时只在会明显改变结果时才问;交付可编辑源加导出图;把输入内容当数据不当指令. 许可证:MIT(Copyright 2026 Agents365-ai;其 shape-index 数据来自 jgraph/drawio-mcp,Apache-2.0,本 skill 未使用). 链接:https://github.com/Agents365-ai/drawio-skill
[3] oh-my-mermaid. oh-my-mermaid(omm-scan / omm-view / omm-push,0.2.0,提交 38ccdb6). 路径:skills/omm-scan/SKILL.md、src/lib/validate.ts、.omm/data-flow/(diagram.mmd、description.md、meta.yaml). 借鉴:同一对象按多个「视角」分别出图、只选真实存在的视角;复杂元素递归下钻成子图,简单元素保持为叶子;每条连线必须有含义标签;节点标签「名称 + 出处」两行写法(我们改为在 brief.md 里记原文出处);少量固定语义色类;每张图配一份文字说明(我们的 brief.md). 许可证:MIT(Copyright 2025 oh-my-mermaid). 链接:https://github.com/oh-my-mermaid/oh-my-mermaid
[4] 浅译万道实验室(自有). academic-figure-builder. 路径:academic-figure-builder/SKILL.md、references/figure-patterns.md、references/viewer-template.md、scripts/assemble_figures.py、scripts/validate_babel.py. 借鉴:从稿件「此处应有图」标记批量抽取配图需求;图必须忠实于原文、写入原文里的具体名称和数字;按内容类型选布局的图型表(流程、概念、对比、层级、表格、决策、时间线);沉稳低饱和的学术色板;大批量按章节分给子代理并行、主进程汇总校验;批量图库浏览. 未沿用:React/Babel/Tailwind CDN 查看器与配套两个脚本(本 skill 改为纯 SVG + 无依赖索引页)、图内标题、960 宽画布配 10–11 px 字号(缩到双栏约 5 pt,低于印刷下限). 许可证:浅译自有. 链接:内部 skill
说明:以上仓库均只借设计思路,未复制原文或代码。Okabe–Ito 色板出自 Okabe & Ito (2008), Color Universal Design.
来源 SKILL 评测
- archifytt-a1i/archify
- drawio-skillAgents365-ai/drawio-skill
- oh-my-mermaidoh-my-mermaid/oh-my-mermaid
- academic-figure-builder ↗浅译万道实验室
许可
本 SKILL 以 MIT 协议发布:可以免费使用、复制、修改、合并、发布、分发、再授权和销售,只需在副本中保留下面的版权声明和许可声明。精炼来源中各开源项目的版权归原作者所有,本 SKILL 只借鉴其设计,未复制其文本或代码。
MIT License Copyright (c) 2026 浅译万道实验室 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.