Anatomy翻译站点

Anatomy 是一套给 AI 编程助手使用的 Agent Skill。你提出一个需要解释的原理，它会尝试把概念做成可操作的等距插画。比如用机械部件的运动说明限流、缓存或仪器的工作过程。它更适合技术文档、课程和产品说明中需要读者亲手观察的图解。

项目的官网提供可直接操作的示例，GitHub 仓库提供安装说明和源码。先看看示例是否接近你想做的内容，再决定要不要安装。

它能做出什么

核心产物是 SVG 等距图，可以作为独立 HTML 页面、单个 SVG 文件，或 React、Next.js 组件交付。图中的部件能响应操作，数值读数跟随同一套模型变化。下图是仓库中的测量仪器示例，适合观察它怎样把一个物件的结构和交互放进同一张图。

如果主题需要火焰、水流或灯光，Anatomy 也能给 SVG 加入 WebGL 效果。仓库里的火箭发动机示例展示了这类组合。3D 转动功能目前仍被项目标为测试阶段，做正式项目时更适合先从 SVG 方案开始。

怎样开始使用

先准备一个支持 Agent Skills 的 AI 编程助手，以及 Node.js 20.10 或更新版本。项目列出了 Claude Code、Antigravity、OpenCode、Codex 和 MiniMax Code。它需要在本地运行命令与构建代码，第一次接触命令行的读者会有一些上手成本。

1. 在终端运行 npx skills add wheresryan22/anatomy -g，按提示选择正在使用的助手。只给 Codex 安装时，可以运行 npx skills add wheresryan22/anatomy -g -a codex。
2. 在 Codex 中输入 $anatomy，写清想解释的原理、需要出现的真实数值，以及要交付独立 HTML、SVG 还是 React 组件。例如可以要求它制作一个展示令牌桶限流过程的交互图。
3. 打开生成的页面，检查部件运动、数值和说明是否与原理一致。仓库还提供几何审计与浏览器截图检查工具；正式使用前应亲自复核内容。

它擅长机器、仪器、工具及家具一类有明确结构和运动关系的对象。项目明确说它不是通用图表库，不负责坐标轴、数据序列，也不适合人物或精确地图。复杂图的制作和校验需要时间，WebGL 效果还取决于浏览器支持。

费用与适合人群

仓库采用 MIT 许可证，绘图工具包使用 Node.js 内置模块，不要求为它另配 API 密钥。实际使用仍需要你已有的 AI 编程助手及其可用额度。经常制作技术解释图、课程互动插画或产品机制展示的人，值得先在官网试几个示例；如果只想几秒钟做一张普通配图，Anatomy 的构建与检查流程可能显得太重。