AI Tools
next-ai-draw-io:用自然語言生成可編輯圖表,而不是只生一張漂亮圖片
next-ai-draw-io 是 Apache-2.0 的 Next.js + draw.io AI 圖表工具,能以自然語言建立、修改與增強 diagrams;重點在可編輯結構化圖表,適合架構圖、流程圖、心智圖與規格討論。
2026年5月28日1 分鐘閱讀👁 6
Diagramming / AI-assisted visualization
next-ai-draw-io 的價值:AI 先畫草稿,人再接手編輯結構
Threads 強調一句話生成架構圖、流程圖與心智圖。GitHub README 確認它是整合 AI capability 與 draw.io diagrams 的 Next.js web app,可透過自然語言建立、修改與增強圖表,並提供 live demo;授權為 Apache-2.0。
不是圖像生成器
它的核心不是把 prompt 變成不可編輯圖片,而是生成可在 draw.io 語境中繼續調整的 diagram。
最適場景
系統架構草圖、流程圖、資料流、onboarding 說明、技術文件插圖、產品規格共編。
技術定位
Next.js 16 / React 19 的 web app;適合當團隊內部 diagram playground 或文件產線輔助。
驗證重點:社群貼文提到 29k stars,GitHub 查核時約 30k stars;star 數會變,真正該評估的是輸出圖表是否可維護、可版本化、可放進技術文件。
| 用法 | 產出 | 注意事項 |
|---|---|---|
| 自然語言生成 | 快速產生第一版架構圖 | prompt 要明確列出節點、資料流、邊界 |
| 草圖轉圖表 | 把白板/手繪概念轉成正式圖 | 仍需人工校對箭頭方向與命名 |
| 文件補圖 | 讓 README / PRD / ADR 更易讀 | 避免圖比文字更新慢造成誤導 |
| 團隊協作 | AI 先做 70% 草稿,人修最後 30% | 建立圖表命名與版本規則 |
Sources
Threads: https://www.threads.com/@kikitataysi/post/DY1lgkuiTJy
GitHub: https://github.com/DayuanJiang/next-ai-draw-io
Demo: https://next-ai-drawio.jiang.jp/
Threads: https://www.threads.com/@kikitataysi/post/DY1lgkuiTJy
GitHub: https://github.com/DayuanJiang/next-ai-draw-io
Demo: https://next-ai-drawio.jiang.jp/