这是苍何的第 597 篇原创!
大家好,我是苍何。
最近,我想给自己的个人网站换个玩法。
之前的网站比较常规,点开页面、浏览内容,看完就走了。
![]()
我花了一些时间,把个人网站变成了一颗可以到处逛的 3D 小星球,里面住着小精灵,还藏着等你发现的宝物。我给它起了个名字叫「苍何的小宇宙」,哈哈哈。
![]()
这个小宇宙的代码由 Codex 完成,主角和小精灵的 3D 模型则通过 Hyper3D MCP 生成,再由 Codex 接入网站。
先带大家逛一圈。进入这个小宇宙后,你可以操控「苍何」在星球上自由探索。
如果不知道往哪走,还可以呼叫小精灵,让它带你前往不同的房间。和它们互动,还能收到专属明信片。
![]()
每到达一个地标,你还能解锁一件对应的宝物,把探索路上的小收获装进口袋。
![]()
这些角色和道具是怎么做出来、又怎么放进网站的?下面展开讲讲。
1. 为什么接 Hyper3D MCP
做这个网站,我想把自己的形象和之前设计的小宠物都放进去。
参考图是有了,还得把它们做成能放进场景里的 3D 模型。
Hyper3D 也是我个人一直在使用的 AI 3D工具,生成质量十分在线,所以我第一时间想到可以使用 Hyper3D,刚好他们最近还推出了MCP,可以直接在 Codex 中使用,,十分方便。
而且经过我的对比,GPT-6 在制作 3D 人物角色模型上效果很难达到要求,接上 Hyper3D Rodin 这样的专业 3D 生成就很有必要,一方面可以快速批量生成可用的 3D 资产,另一方面还能接上大量的 token。
![]()
这样,做网站的过程中需要哪个角色,就能接着把它做出来、放进去,少了自己在几个工具之间来回搬模型的步骤。
有些模型还需要拆开处理,我也用到了 Hyper3D 的 BANG 拆件功能。后面做角色和收藏品时,再展开讲这一步。
2. 先把 Hyper3D MCP 接进 Codex
这次我用的是 Codex,模型选的是 GPT-6 Astra。
登录 /hyper3d.ai/workspace/rodin,右上角就能找到 MCP 入口。
![]()
点开后,复制弹窗里的配置提示词。
![]()
把这段提示词发给 Codex,让它完成配置,并按提示在浏览器里登录 Hyper3D、选择工作空间和完成 OAuth 授权。
● ● ●Please configure Hyper3DMCP in the client I am using (Codex or ClaudeCode): server name hyper3d,StreamableHTTPURL https://api.hyper3d.com/api/mcp,withOAuth. Usethis client's configuration method, preserve other settings, and reuse or update any existing entry. Guide me through browser authorization, then verify the connection and list available tools. Tell me if a restart is needed.
配置完成后,我让 Codex 检查连接、列出可用工具。下面能看到生成模型、查询状态、获取结果和拆件等工具已经加载。
![]()
我按提示新开了一个会话,先用一个头盔测试:生成一个写实的中古骑士头盔,带磨损金属材质,用于游戏资产。
![]()
任务完成后,Codex 返回了模型结果页和 GLB 文件。点开看看,金属表面的划痕和磨损都做出来了。
![]()
到这里,从 Codex 发起生成、再取回模型的流程就跑通了。接下来,把它用到自己的小宇宙里。
3. 把「苍何」做成 3D 角色,再接进网站
网站原型这边,我先把个人介绍、作品和想展示的内容交给 Codex,让它规划星球和地标,搭出能移动、能触发互动的版本。
下面是接入正式模型前的效果。交互已经能跑,但人物还是基础占位模型。
要把里面的主角换成「苍何」,先准备好角色形象。
我把自己的形象图交给 Codex,让它整理成适合这个小宇宙的低多边形 Q 版风格。下面这一步得到的是参考图片,后面再用它生成 3D 模型。
![]()
有了参考图,再让 Codex 通过 Hyper3D MCP 调用 Rodin,生成对应的 3D 角色。
第一版模型出来后,整体形象已经对上了,但眼神有点呆,少了一些灵动感。转一圈看看效果:
![]()
我直接把问题告诉 Codex,让它继续调用 Hyper3D 调整,保留原来的造型和配色,把眼神优化一下。
![]()
第二版明显顺眼多了。下面是调整后的模型预览,可以和前面那版对照着看。
![]()
确认效果后,我让 Codex 把新版模型接进网站,替换原来的主角。
刚才还在模型预览里转圈的「苍何」,这就站到自己的小星球上了。
![]()
4. 批量生成小精灵,让它们住进不同区域
小精灵用的也是这套流程。它们的参考形象,来自我之前在 WeSight 里设计的小宠物。
先看准备好的参考图,机器人、水滴、火焰和小木箱,各有各的样子。
![]()
我把参考图和风格要求一起交给 Codex,让它通过 Hyper3D MCP 连续提交生成任务、查询进度,再把模型结果取回来。
生成后,还要逐个看看造型和画风是否协调。下面这段视频,就是这批小精灵的模型效果。
确认效果后,我让 Codex 把模型下载为 GLB 格式,再接入对应区域,配上靠近、对话和带路等互动。
为了实现最好的效果,我干脆将房屋建筑这些元素,也用 Hyper3D Rodin 重新生成更换了进去,给星球做了个整体升级。这样一来,小精灵就真正住进了这个小宇宙。下面能看到接入后的样子:
![]()
5. 用 BANG 拆件,继续处理模型
模型放进网站以后,还有一些细节需要处理。比如「苍何」刚接入时,移动起来像幽灵一样在星球表面漂移,脚底没有真实的行走动作。
这次我想把角色的不同部件分开处理,就用到了 Hyper3D 的 BANG 拆件功能。
BANG 可以把一个完整模型拆成多个独立部件,方便后续单独编辑、重组或使用。
我让 Codex 先通过 Hyper3D MCP 完成拆件,再把部件交给 Blender,进行骨骼绑定和行走动画制作。下面这段对话里,也能看到这两步的分工。
![]()
拆件后,头、躯干和四肢等部件可以分开处理。接着在 Blender 中完成绑定和动画,处理过程是这样的:
这一套处理下来,角色终于能贴着星球表面正常走路,不再一路漂移。
拆出来的部件也可以用到别的玩法里。这次我还用 BANG 的拆件能力制作了收藏品,把它们放进八个地标,让访客边逛边收集。
下面是收藏品和收集互动的效果:
最后再补上配乐和一些交互细节,这个小宇宙就慢慢完整了。
最后,从一个模型开始
这次做完,我觉得挺顺手的一段,就是把参考图交给 Codex,通过 Hyper3D 生成角色,再把模型接进网站。
眼神不满意,就提要求再改;需要一批小精灵,就按参考图继续生成;模型还要进一步处理,就拆件后接着编辑。
从想法到模型,再到网页里的角色,这条流程就这样一步步跑通了。
想试试,可以从一个模型开始:进入 Hyper 3D 工作台的 MCP 入口,复制配置提示词到 Codex,按提示完成授权,再生成你的第一个角色或道具。
目前我看 Hyper3D MCP 活动还有福利:免费领取 10 个 Credits,以及 1 美元体验 Creator 创作者会员首月。 具体领取资格与续费价格,以活动页面显示为准。
![]()
如果觉得有用,点个「赞」和「在看」支持一下。
特别声明:以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布,本平台仅提供信息存储服务。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.