写技术文档时，最头疼的是画图。
架构图、流程图、时序图... 用传统工具画出来的图，线条僵硬、方方正正，看着就很"正式"，但少了点灵气。
用 Excalidraw 画手绘风格的图？好看是好看，但得自己一笔一笔画，太费时间。
今天介绍的 Excalidraw Diagram Generator，就是来解决这个问题的。
GitHub：
一句话介绍
这是 Awesome Copilot 中的一个技能，让 GitHub Copilot 能自动生成手绘风格的图表。
你只需要描述你想要的图，Copilot 就帮你生成 .excalidraw 文件，直接在 Excalidraw 中打开就能编辑。
什么是 Excalidraw
如果你还没用过 Excalidraw，强烈推荐试试。
它是一个开源的在线白板工具，最大的特点是：生成的图表看起来像手绘的。
线条不是完美的直线，而是略带抖动的自然线条。方框不是完美的矩形，而是有点歪斜的手绘风格。文字也可以用手写字体。
效果非常自然，就像你在白板上随手画的草图，但比草图整洁、可编辑。
Excalidraw 支持：
- 在线使用，无需安装
- 实时协作编辑
- 导出 PNG、SVG、PDF
- 丰富的图形库
这个技能能做什么
Excalidraw Diagram Generator 让 Copilot 具备了自然语言生成图表的能力。
场景一：生成架构图
你在写技术方案，需要一张系统架构图。
传统做法：打开画图工具，拖拖拽拽，调整对齐，半小时过去了。
用这个技能：直接告诉 Copilot：
"生成一个微服务架构图，包含 API Gateway、User Service、Order Service、Payment Service 和 Database"
Copilot 自动生成 .excalidraw 文件，你在 Excalidraw 中打开，就是一张手绘风格的架构图，各个服务之间的连接线都已经画好。
场景二：基于代码生成流程图
你写了一个复杂的函数，想画个流程图帮助理解。
传统做法：自己分析代码逻辑，手动画图。
用这个技能：Copilot 直接读取代码，生成对应的流程图。
场景三：时序图
需要展示多个系统之间的交互时序。
告诉 Copilot：
"生成一个用户登录的时序图，包含 Frontend、Auth Service、User Database"
Copilot 自动生成时序图，各个组件之间的消息流向清晰可见。
为什么用手绘风格
你可能会问：为什么要用手绘风格？用传统的规整图表不是更专业吗？
手绘风格有几个优势：
看起来更自然 —— 不像机器生成的，有温度感
降低阅读门槛 —— 手绘风格让复杂的架构图看起来更亲切
适合技术分享 —— 演讲、博客、文档中用手绘风格，观众更容易接受
可编辑 —— 虽然是生成的，但可以在 Excalidraw 中继续调整
怎么使用
第一步：安装技能
Excalidraw Diagram Generator 是 Awesome Copilot 中的一个技能。
如果你已经配置了 Awesome Copilot，直接在 Copilot 中使用 /skill excalidraw-diagram-generator 即可。
第二步：描述你的图表
用自然语言描述你想要的图表：
生成一个电商系统的架构图，包含：
- 前端（React）
- API Gateway（Nginx）
- 用户服务（Node.js）
- 订单服务（Java）
- 支付服务（Python）
- MySQL 数据库
- Redis 缓存
第三步：获取 .excalidraw 文件
Copilot 会生成 .excalidraw 文件，你可以：
- 直接在 VS Code 中预览
- 在 Excalidraw 官网打开编辑
- 导出为 PNG/SVG 插入文档
使用技巧
描述越详细，图表越准确
不要只说"生成一个架构图"，要说明：
- 有哪些组件
- 组件之间的关系
- 数据流向
生成后可以手动调整
Copilot 生成的是基础框架，你可以在 Excalidraw 中：
- 调整位置
- 修改颜色
- 添加注释
- 更换字体
结合代码使用
如果你有代码文件，可以让 Copilot 基于代码生成图表：
基于 @file:src/app.js 生成一个流程图
适合什么场景
技术文档 —— 架构图、流程图让文档更直观
技术分享 —— 演讲 PPT 中用手绘风格图表，更有亲和力
代码审查 —— 生成流程图帮助理解复杂逻辑
团队协作 —— 在 Excalidraw 中实时协作编辑图表
博客写作 —— 技术博客中插入手绘风格图表，提升阅读体验
和其他图表工具的对比
| 工具 | 风格 | 生成方式 | 可编辑性 |
|---|---|---|---|
| Draw.io | 规整 | 手动 | 高 |
| PlantUML | 代码生成 | 代码 | 中 |
| Mermaid | 代码生成 | 代码 | 中 |
| Excalidraw | 手绘 | 自然语言 | 高 |
Excalidraw 的优势在于手绘风格 + 自然语言生成，既美观又高效。 GitHub：
写在最后
Excalidraw Diagram Generator 是一个小而美的技能。
它解决了一个很具体的问题：让 Copilot 帮你画手绘风格的图表。
不需要学习复杂的图表语法，不需要手动拖拽图形，用自然语言描述，就能得到一张美观的架构图。
对于经常需要画图的开发者来说，这个技能能节省大量时间。
如果你也在用 Copilot，也在为画图发愁，试试这个技能。
关注
如果这篇文章对你有帮助，欢迎点赞、收藏、转发。我会持续分享实用的 Copilot 技能和 AI 编程工具，关注我，一起用 AI 更高效地工作。
