第43课 · Next AI Draw.io：对话式生成流程图
本节要点
- Next AI Draw.io 是一个开源项目，在 draw.io 基础上集成了 AI Agent，支持通过对话直接生成流程图
- 安装方式：下载桌面安装包（Mac / Windows / Linux），或配置 MCP Server
- 使用方法：导入一张参考流程图 → 告诉 AI 你要生成什么 → AI 自动模仿样式生成新图
- 适合场景：想边画边调、通过对话迭代优化的用户
- 与上节课 Skill 的区别：Skill 是代码批量生成（更快），Next AI Draw.io 是对话式交互（更直观）
1. Next AI Draw.io 是什么
上节课我们讲了用 Flow Chart Generator Skill 批量生成内控流程图——AI 把流程转成结构化数据，再调用代码出图，效率极高。
但有些同学习惯「边画边改」，想要一个可视化的交互界面，能实时看到 AI 画图的过程。这就是 Next AI Draw.io 的用武之地。
Next AI Draw.io 是一个开源项目，GitHub 地址：
它在 draw.io 的基础上加了一个 AI Agent 面板，你可以：
- 在画布上拖入一张已有的流程图（作为参考样式）
- 在右侧 AI 面板里用自然语言描述你要画的内容
- AI 会模仿你给的参考图样式，自动生成新的流程图
上图就是 Next AI Draw.io 的实际界面——左侧是 draw.io 的标准绘图工具，右侧是 AI 对话面板。我导入了一张「采购计划编制」流程图作为参考，然后让 AI 生成「预算编制管理」的流程图，它就自动画出了泳道图。
2. 安装 Next AI Draw.io
2.1 下载安装包（推荐）
最简单的方式是直接下载桌面安装包。
💡 nigo 已经把安装包（Mac + Windows）放在了百度网盘，直接去网盘下载就行，不用自己去 GitHub 找。
你也可以去 GitHub Releases 页面自己下载：
支持三个平台：
| 平台 | 安装包格式 |
|---|---|
| macOS | .dmg |
| Windows | .exe |
| Linux | .AppImage / .deb |
下载后双击安装即可，和普通软件一样。
2.2 配置 MCP Server（进阶）
如果你已经在用 Claude Code 或其他支持 MCP 的 AI 工具，也可以把 Next AI Draw.io 作为 MCP Server 接入。具体配置方式参考 GitHub 仓库的 README：
3. 实战演示：用对话生成流程图
3.1 配置 AI 模型
第一次打开 Next AI Draw.io，需要先配置 AI 模型：
- 点击右侧面板的 「配置模型」
- 点击 「添加提供商」
- 选择你有的 API 服务商（支持智谱、千问、OpenAI 等）
- 填入 API Key，保存
配置好后，右上角会显示当前使用的模型（比如 qwen3.6-plus）。
3.2 导入参考流程图
Next AI Draw.io 的核心功能是模仿已有样式生成新图。所以第一步是给它一张「参考图」：
- 准备一张已有的流程图文件（
.drawio或.vsdx格式都行） - 直接拖拽到画布上
- draw.io 会自动解析并显示
💡 建议用
.drawio格式的参考图。.vsdx（Visio 格式）虽然也能导入，但解析效果可能不如原生.drawio好。
3.3 用对话生成新图
导入参考图后，在右侧 AI 面板里输入你的需求。比如：
请参考这个采购计划的流程图样式，给我生成下面流程的流程图：
预算制定流程：
- 总经理办公室制定年度/月度预算目标，输出预算目标书
- 各部门编制部门预算，输出部门预算草案
- 财务部汇总各部门预算，编制全面预算，输出全面预算表
点击发送，AI 就会：
- 分析你导入的参考图的样式（配色、形状、布局）
- 理解你的流程描述
- 一步一步在画布上生成新的流程图
整个过程你能实时看到——AI 会逐个添加节点和连线，就像有人在帮你画图一样。
3.4 微调和导出
AI 生成完之后，你可以：
- 手动微调：拖动节点位置、调整连线走向、修改文字
- 继续对话：告诉 AI 哪里不满意，让它重新生成
- 导出文件：文件 → 导出为 PNG / PDF / SVG /
.drawio
4. 和上节课 Skill 的对比
| 维度 | Next AI Draw.io | Flow Chart Generator Skill |
|---|---|---|
| 交互方式 | 可视化对话，实时看到画图过程 | 命令行，批量生成 |
| 生成速度 | 较慢（一步步调用 AI） | 快（代码批量出图） |
| 适合场景 | 画 1-3 张图，想边画边调 | 批量生成几十张图 |
| 样式控制 | 模仿参考图，灵活但不稳定 | 固定内控主题，稳定一致 |
| 学习成本 | 低（拖拽 + 对话） | 中（需要装 Skill） |
nigo 的建议：
- 如果你要批量生成内控流程图（比如一个项目 30 张），用上节课的 Skill——效率高、样式统一
- 如果你只是偶尔画一两张图，或者想通过对话迭代调整，Next AI Draw.io 更直观
两种方式可以搭配用：先用 Skill 批量生成骨架，再用 Next AI Draw.io 做个别图的精细调整。
5. 导入格式说明
Next AI Draw.io 支持导入以下格式：
| 格式 | 说明 |
|---|---|
.drawio | draw.io 原生格式，推荐用这个 |
.vsdx | Visio 格式，可以导入但可能有兼容性问题 |
.svg | 矢量图，可以导入但 AI 可能无法理解结构 |
💡 实测发现，用
.drawio格式作为参考图效果最好。如果用.vsdx，AI 有时「看不懂」里面的结构，生成效果会打折扣。建议先把 Visio 文件转成.drawio再导入。
⚠️ 常见问题
AI 生成的图很乱怎么办？
试试这几个方法：
- 换一张更简单的参考图——太复杂的参考图会干扰 AI 的判断
- 把流程描述写得更清晰——步骤、角色、输出物分开写
- 分步生成——先让 AI 画主干流程，再补充细节
生成速度很慢？
Next AI Draw.io 是一步步调用 AI 生成的，确实比 Skill 批量出图慢。这是交互式工具的正常现象——好处是能实时看到过程、随时调整。
支持哪些 AI 模型？
支持主流的大模型提供商，包括：
- 智谱（GLM 系列）
- 千问（Qwen 系列）
- OpenAI（GPT 系列）
- 其他兼容 OpenAI API 格式的服务
在设置里配置对应的 API Key 就行。
和 draw.io MCP 有什么区别？
draw.io 官方也有一个 MCP Server（上节课提到过），但它是逐个 cell 调用接口的，token 消耗很大。Next AI Draw.io 的 AI Agent 是在客户端本地运行的，token 用量更合理。
关键收获
TIP
Next AI Draw.io 给了我们另一种让 AI 画流程图的方式——对话式交互。
它不像 Skill 那样追求批量效率，而是让你能实时看到 AI 画图的过程，边画边改。适合偶尔画一两张图、或者想通过对话迭代优化的场景。
安装包已经放在百度网盘，下载装好、配个 API Key 就能用。搭配上节课的 Skill，两种方式互补，覆盖你画流程图的所有需求。
参考链接
- Next AI Draw.io GitHub：https://github.com/DayuanJiang/next-ai-draw-io
- Next AI Draw.io Releases（下载页）：https://github.com/DayuanJiang/next-ai-draw-io/releases
- draw.io 官网：https://www.drawio.com/
- 第42课 · 让 AI 替你画内控流程图（Skill 方案）：/lessons/42-flowchart-skill