要画一张 B 端架构图，30 个方块，50 根箭头。
PPT 拖了两小时方框还在打架。Visio 装一半放弃。最后随手在网上找张糊的截下来贴 PPT 里凑数。
这种事一年要经历好多次。
今天老王把自建了大半年的画图 Skill 开源出来。装上之后跟 Claude 说一句话，30 秒拿到一张架构图，原型图，流程图。
下面是什么、能画啥、怎么装、怎么用，挨个说，最后再把安装地址给你。
PART 这玩意儿干啥的
Skill 全名叫 drawio-generator。
它是给 Claude Code 装的一份画图说明书。装上之后跟 Claude 说画一张电商下单链路图，Claude 不会自己瞎拖方块，而是按 Skill 里写好的规则吐出一份 .drawio 文件。方块对齐，箭头不打架，颜色按意思自动分。
不用懂 XML，也不用懂 .drawio 文件长啥样。把 Claude 给你的那个文件用 drawio 软件打开，导出 PNG 就完事。
drawio 是个免费画图软件，专门画那种带方块和箭头的图，比如架构图、流程图、时序图。下载地址在文末。
PART 接看效果
下面三张图全是 drawio-generator 跑出来的真实样品，每张大约 30 秒。
用户登录流程
7 个节点，6 根箭头。蓝色方块是普通动作，黄色菱形是判断分支，绿色走通过，红色走失败。
电商下单核心链路
10 个节点，8 根箭头，三层结构。用户层和业务层用蓝色方块，数据层用绿色圆柱。圆柱是数据库的标准画法，看一眼就知道这块是存数据的。
AI Agent 三大组件
6 个节点，5 根箭头。中间深色方块是 Agent 的大脑，背后跑的是大模型本身。右边三个是 Agent 离不开的三件套，左边是输入，下方是最终回复。
三张图的共同点。方块都对齐，箭头横平竖直走直角，颜色按意思自动分好，中文字也不会糊成一团。
人手拖 PPT 大概 1 小时一张。这套 30 秒一张，效果还更稳。
PART 一句话装好
不用懂 git，不用找目录，不用敲命令。
打开你常用的 AI 工具，Claude Code、CodeDesk、Cursor、Trae、DeepSeek 这种能操作本地文件的都行。把下面这段话原样发给它：
复制这段话发给 AI
帮我装上这个 Skill：https://github.com/pmlaowangba-lab/drawio-generator
把仓库里的 SKILL.md 下载到我本地的 skills 目录，加载好之后告诉我装完了。
AI 自己会下载文件、放到正确位置、加载好。20 秒搞定，过程中你不用动手。
装完它会回你一句已装好。
打开图还需要 drawio 软件，去 github.com/jgraph/drawio-desktop/releases 下一个，或者直接用网页版 app.diagrams.net，两个都免费。
PART 用一次只要 3 步
跟 AI 说一句话
打开你刚才装过 Skill 的那个 AI 工具，用大白话写要画啥。
用 drawio-generator 画一张电商下单链路图。分用户层、业务层、数据层三层。业务层包含购物车、订单、库存、支付四个模块，数据层是订单 DB、库存 DB、支付 DB。
不会写得这么细也没关系。直接说画一张用户登录流程图，AI 自己脑补一个标准版给你。
等 30 秒拿到 .drawio 文件
AI 想一下然后给你一个 .drawio 文件，告诉你它存到了哪里。
这一步不用看文件内容。打开看你会看到几百行像代码一样的东西，看了也没用，drawio 才看得懂。
用 drawio 打开，导出 PNG
双击那个 .drawio 文件，drawio 软件自动接管打开，整张图就出来了。
满意的话点菜单栏 File，选 Export As，选 PNG。挑 1024x768 或者 2 倍高清，保存到桌面。
不满意回去跟 AI 说一句，把数据层颜色改成蓝色、把支付模块挪到最右边、加一个会员中心节点。AI 改一次只要几秒钟，给你新版本。
熟练之后从开始到拿到能直接插进文章的 PNG，1 分钟以内。
PART 能画哪些图
drawio-generator 适合画讲关系的图。架构图、流程图、时序图、E-R 图、状态机、组件图、思维导图，都能画。任何能用方块加箭头描述的东西它都能干。
最常用的几个场景。
公司新业务架构图，30 个组件以内 30 秒搞定。
产品 PRD 里的流程图，分支判断和异常路径都能画进去。
面试讲项目要 demo 的系统架构图，3 张图打底，5 分钟讲完。
学习笔记里的知识结构图，整理 100 页书的思维脉络。
公众号文章配图，省下找设计师的时间。
不适合用它画的，是插画、漫画、封面、海报这种需要审美的图。这类东西让 GPT-Image-2、Midjourney 这种画图模型来更对。
PART 不满意一句话改
Skill 最爽的地方是改起来不要钱。
跟 AI 说话就行：
把背景色改成深色主题。
加一个会员中心模块，连到订单 DB。
把订单 DB 改成红色，突出风险。
把所有箭头加上中文说明。
拆成左右两个子图。
所有方块改成圆角矩形。
每改一次 5 到 10 秒，改到满意为止。
改 100 次的成本跟改 1 次一样。手画做不到这点。
PART 拿去用
老王把 SKILL.md 完整放到 GitHub 公开仓库，MIT 协议，免费拿。
仓库地址：https://github.com/pmlaowangba-lab/drawio-generator
里面有 SKILL.md 主文件、README 安装说明、本文这三张样例的 .drawio 源文件。
clone 走、Fork、改成你自己的版本都行。觉得好用顺手点个 Star，老王后面继续开源更多 Skill。
画出了好玩的图发到评论区给大家看看。下一篇讲怎么用另一个 Skill 给文章配封面图。
……