用 Archify 画出评审者可验证的架构图

让 agent 画一张架构图，你通常得到一张图片：没有事实来源，没法核对一条边，也看不出什么变了。Archify，一个 66k 星的 agent skill，走的是另一条路——你的 agent 写 typed JSON，Archify 把它确定性编译成自包含、可交互的 HTML 图，而且在你看到之前就已通过校验。

为什么这个 Skill 重要

两个特性把它区分开。第一，校验是原子的：schema、布局、HTML/SVG、路径、标签与路径间距这些检查必须全部通过，成品才会替换上一份已知良好的输出。失败时返回机器可读的修复回执——稳定的规则码、确切对象、实测证据——而不是一串堆栈。第二，交互保持真实：搜索节点、追溯上下游 reach、探测路径、播放引导式故事，全部复用已编写的节点和关系，不虚构拓扑。

按图要回答的问题选图型：

五种图型、四种视觉预设、深浅两色主题。

安装

npx skills add tt-a1i/archify -g

对 Claude Code 来说，skill 会落到 ~/.claude/skills/（或项目级 .claude/skills/）；Codex CLI 和 OpenCode 也有对应目录。不想安装？先试用：

npx skills use tt-a1i/archify@archify --agent codex

实战：从一段描述画出系统图

不需要代码仓库。在 agent 里说：

Use Archify to draw: Browser -> API -> Redis cache -> PostgreSQL fallback.

agent 生成 typed JSON IR，Archify 校验并渲染，然后你在聊天里继续打磨——加 Redis、把 auth 挪到左边、高亮回滚路径——typed 源文件让每一轮迭代都精确落点。

实战：给真实仓库建图，再评审一次变更

要基于源码的图，先打开仓库再说：

Analyze this repository, then use archify to create a high-level runtime architecture diagram.
Show 8–12 core components, one primary path, external dependencies, and trust boundaries.
Put supporting detail in cards instead of adding more edges.

更重的活交给 CLI：node archify/bin/archify.mjs guide "Show an API request with Redis cache miss" 用一句大白话帮你选图型；validate --json 和 deliver --json 把失败报成修复回执。做设计评审或 PR 评审时，Architecture Delta 会对比两份已校验快照：

node archify/bin/archify.mjs compare architecture base.json head.json architecture-delta.html --json

输出 Before / Delta / After，以机器回执形式列出确切的新增、删除、变更、移动、改道事实——并且按设计，不推断影响、风险或合并安全性。

技巧

• 在源文件里设 "meta": { "locale": "zh-CN" }，页面框架——标题、图例、状态、无障碍标签——会本地化成中文；你自己撰写的内容保持原语言。
• 导出菜单能把 PNG 复制到剪贴板，也能下载 SVG、WebM 和 1200×630 分享卡；route 与 reach 分享卡能把一条已编写的路径或 reach 按原样捕获，不声称运行时影响。
• 查看器里，? 打开图解指南，/ 搜索节点，R 探测路径，L 对比两种角色，P 播放引导式故事。
• 自动解析 Mermaid、通用自动布局、托管分享、所见即所得编辑都被有意排除在范围外——Archify 面向沟通产物，不是自由绘画。

何时不用这个 Skill

如果只是要一张随手即弃的草图或自由插画，白板或绘图工具更快；Archify 的精力花在 typed、已校验、可验证的输出上。它也不是监控工具——README 明确说明其 deployment-ownership 配置绝不探测线上基础设施——所以它描绘的是你编写或从源码读出的系统，而不是生产环境里实际运行的样子。

查看 排行榜 了解更多 skill。