无论你是需要绘制软件架构图、梳理业务流程,还是仅仅想在头脑风暴时随手画画草稿,传统的流程图软件往往显得过于正式且死板。今天推荐的 Excalidraw 是一款极具特色的开源在线白板工具,它主打轻松的手绘涂鸦风格,让你在绘制专业图表的同时,找回在真实白板上挥洒创意的顺畅感。
Excalidraw 是一款基于 Web 技术的开源虚拟白板工具,专门用于绘制具有手绘排版风格的图表。
在线即用地址: https://excalidraw.com/
GitHub 源码: github.com/excalidraw/excalidraw
打开网站后,顶部正中就是非常直观的工具栏。包含矩形、菱形、椭圆、箭头、自由画笔和文字等基础工具。强烈建议使用快捷键(如 R 代表矩形,T 代表文本,A 代表箭头)来切换工具,习惯后作图速度会成倍提升。
当你使用“箭头”工具连接两个图形时,Excalidraw 会自动识别图形的边缘中心并进行吸附。之后无论你怎么拖拽、缩放这些图形,它们之间的连接线都会智能跟随并保持自然弯曲,省去了手动重新对齐的烦恼。
完成创作后,点击左上角的三横杠菜单,你可以将画板一键导出为背景透明的 PNG 图片,或是支持无损放大的 SVG 矢量图。如果是暂未完成的草图,可以保存为专用的 .excalidraw 本地文件,下次直接拖入网页即可恢复编辑状态。
进阶技巧:海量第三方素材库与 VS Code 深度集成
如果你觉得基础图形不够用,点击顶部工具栏右侧的书本图标“素材库(Library)”,点击“浏览更多”,即可一键导入全球开发者分享的丰富图库:涵盖云计算架构图、网页 UI 组件、甚至手绘风的小电脑和小人物图标。
对于开发者来说,最极致的体验是直接在 VS Code 插件市场搜索并安装“Excalidraw”官方插件。安装后,你可以在写代码的 IDE 里直接新建白板文件,一边看代码一边画架构草图,将视觉灵感完美无缝地融入开发工作流!