🛡️ 防钓鱼提醒:请核对域名 szb123.com,任何正规平台绝不会私聊索要助记词、密码或验证码。

技能/anatomy

Anatomy:让 AI 画出等距工程插图的技能

给 AI 编程助手用的等距工程插图技能:一句话让 Claude 画出可交互的机器与系统结构图

版本
v1.1.0
更新日期
2026-10-15
许可证
MIT

获取与校验

git clone(推荐)

git clone https://szb123.com/skills/anatomy ~/.claude/skills/anatomy

不要加 --depth(本站是静态托管,不支持浅克隆)。 克隆到 ~/.claude/skills/anatomy。

下载源码包

anatomy-v1.1.0.zip (2.8 MB)· 解压后顶层目录为 anatomy/

SHA256:1281dfbad2f8dca414c052124c67ed693d7a8cf609995fc5d08953f1a008ffc9(本站计算)

# macOS / Linux
shasum -a 256 anatomy-v1.1.0.zip
# Windows PowerShell
Get-FileHash anatomy-v1.1.0.zip -Algorithm SHA256

原作者:wheresryan22 · 许可证:MIT(随包附带完整许可证文本)

这是什么

Anatomy 是一个写给 AI 编程助手用的「技能包」(skill):装好之后,你对 Claude Code 说一句想要什么图,它就按一套固定的工作流,把这个技术概念画成一台有真实感的等距(isometric)小机器——沉重的底座、带刻度的导轨、能转的旋钮、压着指针的仪表盘、一根根走线的电缆。图纸最终是独立的 SVG 和 HTML 文件,双击就能在浏览器里打开,还会带轻微的动画。

它的核心想法用作者自己的话讲就是「物件即解释」:不画方框、箭头和标签,而是把概念映射成一台大家都认识的机器。比如「一个共享的 GPU 上下文服务 16 个画布」被画成一台龙门绘图机,一个打印头轮流访问 16 口井;「缓存键没变就跳过重算」被画成一把弹子锁,所有弹子对齐时锁芯才转动。读者看懂了机器,也就看懂了概念。

这套技能不挑框架:默认用纯 TypeScript/JavaScript 直接生成 SVG 和 HTML,也能在 React/Next 项目里工作;需要的话还可以叠真实的 WebGL 着色器层——火焰、尾焰、水面、灯光——而且着色器被约束在等距视角之内,不会跳出画面。工具自带 8 个完整示例,从最小的指示表(约 300 行代码)到带几何自检的火箭发动机试车台,都是可以逐行学习的成品。

适合谁

  • 写技术文档、博客或产品页的人,想要那种「一眼贵」的说明图,但不想每次从零手画;
  • 已经在用 Claude Code、OpenCode 或 Codex 这类命令行 AI 助手,愿意让 AI 替自己干活的人;
  • 机器上有 Node.js 20.10 以上版本的人——构建示例和跑几何检查都靠它,检查步骤还需要本机的 Chrome 或 Chromium。

反过来,如果你只想找个现成的插图库下载了事,或者电脑上装不了 Node,这个项目帮不上忙。它是「让 AI 替你画」的工具,不是素材包。

怎么用

获取方式见上方「获取与校验」区块:git clone 一条命令,或者下载源码包解压。按这个项目的习惯,文件夹放在 ~/.claude/skills/anatomy,Claude Code 会自动发现技能目录。

装好之后打开一个新会话,直接说需求,比如「用 anatomy 给我画一张解释 CDN 回源机制的等距插图」。技能会先告诉你这张图属于哪一档:Figure(单机构,40–80 个零件,约半小时到一小时半)、Hero(更密的物体或多个 WebGL 层,80–150 个零件,约 2–4 小时)——先报档位再动工,这是它工作流的第一步。

上手有一个被作者反复强调的捷径:自带的 examples/ 示例目录里有 8 个完整示例,开工前先让 AI 打开和你需求最接近的那个读一遍。想自己跑通一个示例,进入示例目录执行 node build.mjs,它会在旁边生成一个独立的 HTML 页面(加 --light 参数得浅色主题);执行 node build.mjs --audit 会让几何自检脚本逐帧验证零件没有互相穿透、每根线都落在真实支点上——这是这个项目最较真的部分,也是它和「随手生成的 SVG」拉开差距的地方。

安全提示

  • 获取渠道要单一:只从本页给出的地址获取,来源不明的转载包不要用;下载源码包的用户先用页面上的 SHA256 核对完整性,再交给 AI 使用。
  • 这类技能包本质是「提示词 + 明文脚本」。kit/、scripts/、examples/ 下的文件都是可以直接读的 JavaScript,不放心就让 AI 先解释每一份文件干什么,或者自己扫一眼。构建过程完全在本地,不需要任何账号。
  • 几何检查那一步会在本机启动 Chrome 或 Chromium 渲染页面,属正常现象;不愿意让它跑浏览器可以跳过检查,只生成静态图。
  • SKILL.md 里提到「按要求把成品发布到社区画廊」——那是联网上传。你不需要它就在指令里明确说「不要发布」,AI 就不会把你的图传出去。
  • 把 AI 助手指向陌生工具前,先自己看一眼里面的文件再决定;这条对所有 skill 都成立,不只是本条目。

站长点评

我收录它有三个理由:理念聪明——「把概念映射成机器」这个约束让 AI 有章可循,成图质量远比「你随便画一张」稳定;例子给得足——8 个示例从入门到高阶分层清楚,火箭发动机那个连几何自检都写了测试;许可干净——MIT,怎么改怎么用都行。

要泼的冷水也有两盆:第一,整套 SKILL.md 和示例注释都是英文,对纯中文用户有阅读门槛,好在实际使用时你只需要用中文提需求;第二,Figure 档就要半小时起步,Hero 档两小时往上,它是「慢工出细活」的工具,别指望秒出图。另外说明一下和本站另一份材料的关系:files 频道里有这个项目的整包文件与单文件合并版,适合网页版 AI 用户直接当附件上传;本页的完整获取方式适合命令行用户——两份内容同源,取一样就行。

版本记录

  • v1.1.0(2026-10-12 发布):本站提供的版本。新版本经核对后更新,届时版本号与校验值会在本页同步更新。

常见问题

clone 报错或卡住? 先确认命令里没有 --depth——本站是静态托管,不支持浅克隆,加了必失败。去掉重试即可。

SHA256 对不上怎么办? 先重新下载一次排除传输截断;再对不上就别用,回到本页重新获取,并联系站长提一下。

它和我在别处见到的 anatomy 整包什么关系? 同一个工具的两种分发形态:本页提供完整文件夹与源码包,均经本站校验;files 频道那份是解包整理版,方便网页版 AI 用户上传。内容同源,完整性以本页的校验信息为准。

必须联网吗? 生成和构建都在本地完成;只有「发布到社区画廊」这一个动作需要联网,不需要就明确拒绝。

来源

本页依据该工具自带的说明文件(SKILL.md、示例文档等)整理,功能与参数以随包文档为准。