流程图架构图以及装逼文章配图的这些生图工具已经有很多了，但真的做好的几乎没有。
比如半年多前的各种 draw.io+agent 或 llm 的组合。
看着很牛逼，用起来很难受。总结下两个问题：
- 让 agent 直接生图或者直接做 html ，输出很好，但很难编辑（让你拖拽加个元素就加不动）
- 让 agent 直接去生成 draw.io 类似工具的图，输出非常不稳定，而且很丑，连线不知道连哪去了
这个究极难题，目前应该严重打击了很多人的信心，所以很多人估计看到标题已经不想点进来，怕被骗。
但我想说，这次是真的想把 Agent 生图这件事做好，不是搞个噱头，我相信我们可以在工程中尽量减少抽卡次数，尽量能做到尽可能高的稳定的输出，以及提供可复现的设计能力。
Github 地址： https://github.com/chenhg5/agentdraw
下面这个图是一次 prompt 生成，无任何调整：
关于 AgentDraw
AgentDraw 是一个让 cc/codex 等 agent 帮你画专业图表的本地工具+skill 。你只要告诉 agent 想画什么，比如流程图、架构图、产品路线图、分析报告图、会议总结图，它就能生成一张可编辑的画板。
内置 44 种设计主题，既有正式商务风、技术架构风，也有复古手册风、深色故障分析风、活泼产品风等。你不用懂设计，也不用自己调颜色、排版和字体，就能得到更像样、更统一的图。
选择 AgentDraw 的核心原因是：它不是只给你一张死图片，而是生成后还能在浏览器里继续改。文字、方框、连线、布局都可以手动调整，也可以导出成 SVG 或 PNG ，用在文章、文档、PPT 、项目汇报里。对于想用 AI 快速做图，又希望结果好看、可控、能继续修改的人来说，AgentDraw 会更省心。
How
设计语言 Design.md
这个概念应该很多人都熟知了，已经出来几个月了。之前我们可能对设计都是在抽卡，实际上设计本身也是类似于 c 语言，java ，js 一样的结构性的可解释的一种语言，只要我们能把这些能结构化的，可解释的东西能约束清楚，我们就能尽量减少 agent 抽卡的次数。比如人总是喜欢黄金分割比例，我们可以对这些间距颜色甚至一些交互进行约束，这样就能把每种设计风格变成规则，只要我们在一定的规则下去干活，那总会得到不算太差的结果。
svg first
这个算是黑魔法了。目前直接让 agent 去操作面板，得出的结果都是糟糕的。因为 agent 在训练的时候不认识画板语言。他更熟悉 html ，svg 。因此他可以在 html 上表现非常好，但 html 很难转化成我们要的画板数据。而 svg 则是更接近的。当然 mermaid 也可以，但 mermaid 不思进取，目前还是太局限了，对很多情况表达有欠缺。而 svg 则不一样，他的表达上限很高，可以画很多的图，因此让 agent 去画 svg ，再渲染画板数据就可以保证输出的稳定同时，也能得到好的编辑效果。
校验，测试与评估
如果设计不是一个可测试与评估的事情，那么设计本身就没法被约束和被优化。agentDraw 提供了一套校验的能力，让 agent 知道自己的输出是否符合要求，是否能达到一定的质量。当他知道哪里有问题的时候，他可以去自动优化和改进。不再需要沉浸在“五彩斑斓的黑”的无尽循环中了。
最后
感兴趣的朋友可以试试呀！花 5 分钟即可安装一个。
开源不易，如果对您有帮助，欢迎点赞👏🏻
Select Language