首页 / 资讯中心 / 文章详情

Anatomy Atelier:一个开发者用 AI「手搓」的 3D 人体解剖网站,到底能怎么玩?

Anatomy Atelier:一个开发者用 AI「手搓」的 3D 人体解剖网站,到底能怎么玩? ★ FEATURED ARTICLE
Anatomy Atelier一个开发者用 AI「手搓」的 3D 人体解剖网站到底能怎么玩项目地址https://github.com/thebuggeddev/anatomy本文所有截图均为该项目实际运行效果本地部署实测截取。最近 GitHub 上有个项目火得很快Anatomy Atelier解剖工作室。2026 年 8 月 2 日才公开一个多月就收获了 3300 Star 和近 900 个 Fork连 OpenAI 总裁 Greg Brockman 都转发评价它是「用于构建交互式教育工具的 ChatGPT」。它最出圈的点不是「又一个医学网站」而是它的出身整个项目几乎由一名开发者X 上的 thebuggeddev指挥 AI 工具链完成——设计图由 GPT Image 生成器官 3D 模型由 TripoAI 从图片转换而来代码则由 OpenAI Codex 编写和优化。所以这篇文章我分三部分讲清楚它是什么、怎么用、能不能在它的基础上二次创作。一、这是个什么项目Anatomy Atelier 是一个基于 Three.js 的交互式 3D 人体解剖学习网站用浏览器打开就能用不需要安装任何医学软件。目前收录了9 个器官心脏、大脑、肺、肝脏、肾脏、眼、肠、胰腺、皮肤。界面布局很像一座「数字博物馆」中间是 3D 标本展台器官缓慢自转可以拖动旋转、滚轮缩放左侧是器官库Organ Library点一下就能切换器官模型按需加载右侧是知识卡片给出器官的大小、重量、位置、供血方式、主要功能以及「医学意义」和「你知道吗」这类冷知识底部还有显微组织视图、器官对比、功能动画、常见疾病和人体系统位置图。以心脏为例模型上分布着可点击的热点圆点——主动脉、左/右心房、左/右心室、二尖瓣点上去会显示该结构的名称和作用。左侧工具栏还提供了一排「实验操作」旋转、缩放、单独显示Isolate、剖面Cross-section、分层Layers、对比Compare、重置。下面是剖面功能的实际效果——心脏被沿矢状面切开可以直接观察内部腔室对中文用户很友好的一点是网站内置了包括中文在内的 12 种语言右上角一键切换界面和解剖内容都会跟着翻译。顶部导航还有 Systems系统、Lessons课程、Library资料库、Notes笔记几个入口。课程模式是「引导式探索」——比如「心脏内部」这节课会带你跟随高亮结构旋转标本把形态和功能联系起来学此外每个器官还配有部位识别小测验Quiz整体形态已经接近一个轻量级的数字解剖学习平台。二、它是怎么做出来的这个项目的制作过程本身比成品更有启发性几乎就是一条标准的「AI 原生开发流水线」GPT Image生成整体设计风格图再逐个生成每个器官的参考图TripoAI把每张器官图片转换成 3D 网格模型跳过了手工建模OpenAI Codex拿到设计图、主提示词和全部 3D 模型搭建出 Three.js 应用的第一个可用版本之后还是由 Codex 做「脏活累活」把单个器官模型从 120–150MB 压缩到 2–5.5MB总体积从约 900MB 降到 28.6MB并实现了器官按需加载——帧率从没法看的 16fps 救回到可用水平。技术栈上这是一个Next.js React TypeScript的单页应用Three.js 负责渲染GLB 模型走 Draco 压缩配合 Tailwind CSS 和 GSAP 动画部署在 Vercel 上。三、我们怎么使用方式一在线体验最省事官方演示站部署在 Vercel仓库主页有链接。需要提醒的是截至本文测试时2026 年 9 月底官方 Vercel 演示站处于「Deployment Paused」暂停状态暂时无法直接访问。如果你看到站点恢复了直接打开即可无需注册。方式二本地跑起来本文截图就是这么来的项目结构很标准本地部署只要几步gitclone https://github.com/thebuggeddev/anatomy.gitcdanatomynpminstallnpmrun dev# 官方脚本vinext要求 Node.js 22.13几个实测注意事项package.json要求Node.js ≥ 22.13。我的测试环境只有 Node 20npm run dev的 vinext 脚手架跑不起来但改用npx next dev项目内置了完整的 Next.js 配置可以正常启动本文所有截图均来自这种运行方式首次编译需要十几秒每个器官的 GLB 模型按需加载切换器官时会有一两秒的「正在准备 xx」进度提示桌面端 Chrome/Edge 体验最佳手机浏览器能开但 3D 交互还是大屏幕舒服。适合谁用医学生/生物学习者建立器官的空间结构概念课前预习、课后复习艺术生、插画师项目名称 Atelier画室就是点题——像对着石膏像写生一样观察人体结构科普内容创作者直观的人体结构演示素材前端/3D 开发者一个现成的 Three.js AI 工作流学习样本。不适合的场景也要说清楚模型和知识内容未经过医学专业审校公示不能替代专业解剖图谱更不能用于临床诊断参考纯网页应用离线不可用。四、能不能在它的基础上二次创作这是很多人关心的问题答案需要分两面说技术上完全可以而且很好改代码全部公开结构是标准的 Next.js Three.js模型文件就放在public/models/目录9 个 GLB总共约 34MB想替换器官、换皮肤、加新器官都有明确的入口多语言文案集中在app/i18n/目录改文案、加语言都很方便项目本身就是「一个人 AI 工具链」的产物代码里没有黑盒二次开发门槛低。895 个 Fork 也说明不少人已经在这么干了。法律上有一个重要前提要注意截至本文写作时该仓库没有添加任何开源许可证GitHub API 的 license 字段为空仓库内也没有 LICENSE 文件README 也还是脚手架模板的默认内容未做项目化维护。这意味着在 GitHub 上查看、Fork、本地运行、学习研究属于平台服务条款允许的范围没有问题但「没有许可证」在法律上等同于作者保留所有权利——把代码复制到自己的产品里、二次发布、尤其是商用都存在法律模糊地带稳妥做法是先通过 GitHub Issue 或 X 联系作者 thebuggeddev 获得明确授权同样地器官模型是 AI 生成的美术资产用于出版、课程售卖等场景前也建议确认授权。另外两个小提醒一是项目非常年轻2026 年 8 月创建迭代持续性有待观察二是 AI 生成代码占比高二次开发前建议自己过一遍代码质量。五、小结Anatomy Atelier 的价值有两层对学习者来说它是一个免费、免安装、支持中文的 3D 人体解剖探索器把课本上的平面剖面图变成了可以旋转、剖切、点击的立体标本。对开发者来说它更有象征意义——一个solo开发者用「GPT Image 出图 → TripoAI 转 3D → Codex 写代码并优化」的流水线做出了教具级的产品。AI 负责快速成型而真正把 demo 变成可用产品的是后面那一轮把 900MB 压到 28.6MB 的「不性感」的优化工作。这大概就是 2026 年个人开发者的新常态。相关链接GitHub 仓库https://github.com/thebuggeddev/anatomy官方演示站https://anatomyatelier.vercel.app测试时暂停服务可收藏后等待恢复作者 X 账号https://x.com/thebuggeddev本文基于 2026 年 9 月对仓库 main 分支的本地实测撰写截图来自本地运行环境的真实渲染效果。
阅读完成 · 觉得有帮助?
咨询建站