⭐⭐⭐ Spring Boot 项目实战 ⭐⭐⭐ Spring Cloud 项目实战
《Dubbo 实现原理与源码解析 —— 精品合集》 《Netty 实现原理与源码解析 —— 精品合集》
《Spring 实现原理与源码解析 —— 精品合集》 《MyBatis 实现原理与源码解析 —— 精品合集》
《Spring MVC 实现原理与源码解析 —— 精品合集》 《数据库实体设计合集》
《Spring Boot 实现原理与源码解析 —— 精品合集》 《Java 面试题 + Java 学习指南》

摘要: 原创出处 http://www.iocoder.cn/Fight/3dcellforge-ai-workbench/ 「芋道源码」欢迎转载,保留摘要,谢谢!


🙂🙂🙂关注微信公众号:【芋道源码】有福利:

  1. RocketMQ / MyCAT / Sharding-JDBC 所有源码分析文章列表
  2. RocketMQ / MyCAT / Sharding-JDBC 中文注释源码 GitHub 地址
  3. 您对于源码的疑问每条留言都将得到认真回复。甚至不知道如何读源码也可以请教噢。
  4. 新的源码解析文章实时收到通知。每周更新一篇左右。
  5. 认真的源码交流微信群。

这周在 GitHub 上看到 3DCellForge,把一张参考图传上去,能转成可以在浏览器里旋转缩放的 3D 模型。作者说以前三天做出来的效果,现在几分钟能出个雏形。

不配一个 Key 也能先玩起来

来源文章的仓库页面

来源文章的工作台界面

官方测试截图中的三栏布局,模型区为占位画面

它是一个开源的 3D 模型工作台,技术栈是 React 加 Three.js,整个跑在浏览器里。装好之后界面顶部显示的名字是 3D Mo,和仓库名不太一样,这个不用在意。

名字里带 Cell、演示素材也全是细胞模型,容易让人以为是个生物专用工具。其实它是通用的图片转 3D 工作台,车辆、飞机、舰船、产品、标本都能识别。MIT 协议开源,目前两千六百多 Star。

huangserva/3DCellForge 仓库首页

它和常见的图片转 3D 演示站不太一样。那些站点一般是上传、等待、下载三步走完就结束,它想把生成出来的模型留在工作台里,接着检查、对比、做演示。

六种生成模式,从兜底到云端

生成模式与模型对比面板

来源文章的仓库页面

上传面板里给了六种模式,这一段我觉得做得比较实在。

Hyper3D 和 Tripo 走云端生成,效果上限高一些,需要对应平台的 Key。Fal.ai 也是云端队列生成,里面还能选具体模型,Hunyuan3D v2、TRELLIS、TripoSR 这些都在设置里切换。

Hunyuan3D 本地模式是给已经在本机部署了混元 3D 服务的人准备的,数据不出本机。JS Depth 则是纯浏览器端的图片深度浮雕,不需要任何 Key,属于随时能用的兜底方案,效果比不上正经生成。最后一种是 Local GLB,直接导入现成的 .glb 或 .gltf 模型。

还有一个 Auto 模式,按 Hyper3D、Tripo、Fal、Hunyuan、JS Depth 的顺序依次尝试,前面失败了自动换下一个,最后总能出一个结果。

对只想先玩玩看的人来说,重点在后面几种。不配置任何 Key,项目照样能跑起来,仓库里自带了一批缓存好的演示模型,打开就能转着看,生成这一步可以先不跑。

生成完先看一张质量卡

模型质量卡

生成完一个 GLB,主舞台上会浮出一张质量卡片,显示文件大小、三角面数、贴图数量,还有一个综合的演示可用性评分。

质量卡这一处的价值在于把验收动作前移了。

这个设计解决的是一个很实际的麻烦。以前拿到生成的 3D 模型,想知道能不能用,得先导进 Blender 里看面数和贴图。现在在页面上扫一眼评分就大概有数了,官方也建议在录屏演示之前先看这个分。

它把模型留在了工作台里

来源文章的 Demo 演示画面

来源文章的工作台界面

官方测试截图中的模型库抽屉,缩略图为占位画面

界面是三栏布局。左边是模型库,生成过和导入过的模型都在这里,当前在用的那个固定显示,更早的收在 Saved Assets 里默认折叠起来。中间是 WebGL 主舞台,可以直接拖拽旋转。左下还有一个生成队列,上传和生成和导入进行到哪一步都能看见,失败的任务可以直接重试。

Demo 模式下的演示画面

Demo 模式值得单独说。点一下顶部导航,左右两边的面板全部收起,只留一个干净的演示画面。运镜这里做了区分,会跟着模型类型变。汽车走低机位推进,飞机走飞行掠过,舰船走侧向巡航,细胞这类有机标本走工作室环绕。

部件详情抽屉

除此之外还有一批外围功能。点 Info 或 Inspect 能打开部件详情抽屉,模型按什么来源生成、用的哪个 Provider、材质重点是什么,都有记录。模型笔记、对比面板、图库操作、日志、项目保存也都有,单看每一个都不复杂,但该给的都给了。

有两个细节值得一提。所有 API Key 只放在服务端的 .env.local 文件里,不会打进前端包,这个文件默认被 git 忽略,只要自己别手动提交它就安全。生成过的 GLB 会被本地 Node 后端缓存到 .generated-models 目录,再看的时候直接读本地副本,不会重复扣云端额度。

装起来两组命令

有 Node 环境的话,前端两行命令就够了。

npm install
npm run dev

装完打开终端里显示的 Vite 地址,工作台就出来了。到这一步不需要任何 Key,仓库自带演示模型,直接就能转着看。

有一点提前说一下,界面目前是英文的,有中文切换选项,但切了之后只有顶部菜单变中文,其他地方没跟着变,这点处理得不够好。

想体验真正的图片转 3D 生成,要再开一个本地后端。

cp .env.example .env.local
npm run dev:api

后端默认跑在 127.0.0.1:8787。走云端路径的话,把对应平台的 Key 填进 .env.local 就行,手上有哪个填哪个,没有也不影响前面那些本地玩法。

作者自己的使用顺序很值得参考,也顺带说明了这六种模式的边界。先什么都不配,拿自带的演示模型把界面摸熟;然后挑一张植物细胞的渲染图,走 JS Depth 模式试试浏览器端的兜底效果;最后才接上云端 Key 做正经生成。先摸界面再花钱,这个顺序比一上来就配一堆 Key 稳妥得多。

原型阶段,但够折腾一阵

用下来的感觉是,它还处于原型阶段,完成度不低,但离成熟的商业软件还有距离。你得会自己跑 npm 命令,想要最好的生成效果也得自己配 Key。仓库最近一次提交在八月底,更新节奏不算快。

不过它的定位挺清楚,不跟云端生成服务抢效果上限,而是把生成完之后的检查、评分、对比、演示这几件事补齐。手上有平面素材想变成立体的,可以装一个玩玩,不配 Key 也够折腾一阵子了。

顺手说一句它现在的边界。它能出模型,但出不了工业级精度,做概念稿、做演示素材、做电商主图这类用途够用,真要交付生产件还是得回专业建模软件里重做一遍。这一点在试用的时候最好先有预期。

仓库在 https://github.com/huangserva/3DCellForge

选模式这一步决定了后面要不要花钱,先把边界看清楚再动手比较稳。

文章目录
  1. 1. 不配一个 Key 也能先玩起来
  2. 2. 六种生成模式,从兜底到云端
  3. 3. 生成完先看一张质量卡
  4. 4. 它把模型留在了工作台里
  5. 5. 装起来两组命令
  6. 6. 原型阶段,但够折腾一阵