Archify Skill：用自然语言生成可交互架构图的 AI 作图神器

Archify 是一款专为 AI 编码助手打造的架构图生成 Skill，让开发者用自然语言描述系统，即可获得专业级可交互架构图。今日冲上 GitHub Trending 前三，单日新增 stars 超过 4,500，增速位居 Skill 类项目前列。它解决的是技术人日常最头疼的问题之一：把脑子里的系统结构翻译成一张能给别人看的图。传统方案要么拖拽组件、要么手写 Mermaid 代码，而 Archify 把这件事压缩成一句话。

Archify 的核心设计原则是「AI 生成 JSON IR → 确定性渲染引擎 → 零依赖单文件 HTML」。AI 模型只负责理解意图并输出结构化中间表示（JSON IR），实际的布局、校验、渲染全部由专门的 Node.js 渲染器完成。这种职责分离确保了输出质量的稳定性——无论 AI 模型版本如何波动，渲染出来的图都经过类型检查，不会出现错乱的箭头或连线错误。

GitHub 数据显示，截至 2026-08-28，Archify 累计获得约 26,660 个 stars，过去 24 小时内新增超过 4,500 个，fork 数 1,695。TrendingShift 综合热度位居第 3，并在掘金、CSDN、知乎等多个中文技术社区引发讨论。

GitHub 链接：https://github.com/tt-a1i/archify

项目由 GitHub 用户 @tt-a1i 创建和维护，目前版本 v2.16.0-dev.0，MIT 许可证，开源免费使用。

Archify 本质上是一个 Node.js 渲染与校验系统，兼容 Cursor、Claude Code、Codex CLI、OpenCode 等主流 AI 编程助手。安装后在对话中直接用自然语言描述需求，Agent 即可生成五种专业图表：架构图（Blueprint）展示系统模块划分与依赖关系、时序图（Sequence）描述模块间调用顺序与时间线、数据流图（Signal Flow）追踪数据在系统中的流动路径、工作流图（Workflow）呈现业务流程与状态转换、生命周期图（Lifecycle）建模资源或对象从创建到销毁的全过程。

生成产物是一个完全自包含的单文件 HTML，无任何外部依赖，可直接在浏览器打开并分享给他人。内置深色/浅色两套主题，一键切换，满足不同展示场景需求。导出格式支持 PNG（4 倍高清分辨率）、SVG（双主题自适应系统外观）、WebM 动态格式以及 1200×630 社交分享卡片，覆盖了文档、PPT、README、社交媒体等常见分发渠道。

除基础作图外，Archify 还提供了几项差异化能力。变更对比：可生成 Before / Delta / After 三视图，精确列出新增、移除、修改、迁移的组件和连接线，适合 PR review 和架构演进追踪。节点溯源：每个节点带有 SRC 标签，点击可跳转到对应 Git 提交的具体文件和行号，保证图表与代码完全同步，不会出现「图是旧的、代码已变」的漂移问题。路径探测：支持查询上游/下游节点、追踪最短路径、比较不同角色的数据流向，无需手动分析代码即可理解复杂依赖关系。引导演示：可播放有限状态的章节式引导故事，适合在技术分享或 onboarding 时做结构化演示。

安装仅需一条命令：

npx skills add tt-a1i/archify -g

安装后，在 Agent 对话中描述需求即可触发生成：

Use archify to map this repository's runtime architecture.

也可以针对特定场景：

Use archify to draw an architecture diagram: React frontend calls a Node.js API backed by PostgreSQL and Redis, deployed on AWS behind CloudFront.

Use archify to draw a CI/CD workflow: pull request -> tests -> approval gate -> build image -> staging deploy -> smoke test -> production deploy, with rollback on failure.

Archify 主要面向需要频繁进行技术沟通的开发者和技术团队。具体使用场景包括：向非技术人员解释系统架构、做技术方案评审和 PR review、生成 README 或文档中的架构图、做技术演讲或培训的材料、以及在团队 onboarding 时快速理解新项目的结构。对于个人开发者而言，它是替代 draw.io、Excalidraw 等传统工具的高效选择；对于团队而言，它是保证架构图与代码同步的可靠方案。

输入示例：

React 前端通过 Axios 调用 Node.js API，API 连接 PostgreSQL 做持久化存储，Redis 作为缓存层，整体部署在 AWS EC2 上，前端静态资源走 CloudFront CDN。

输出结果：

一张包含 React Frontend、Node.js API、PostgreSQL、Redis、AWS EC2、CloudFront 六个节点及其连接关系的架构图，带深色/浅色主题切换、导出 PNG/SVG/分享卡片功能，节点支持点击溯源到对应代码文件。

整体来看，Archify 踩到了两个需求的交叉点：一是 AI 编程助手快速普及后，「让 AI 画图」成为自然而然的需求；二是工程团队对架构图「与代码保持同步」有强需求。它不只是一个 Mermaid 替代品，而是一个让 AI 真正理解系统结构后输出可验证图表的 Skill 方案。随着 Agent 工作流的成熟，这类「专业输出型」Skill 很可能成为 Skills 生态里增长最快的细分赛道之一。

GitHub: https://github.com/tt-a1i/archify