HermesWorkspace Playground 可选 3D NPC 模型替换指南:基于 GLB 的 Voxel 身体升级方案

📅 发布时间:2026/10/9 4:46:31
HermesWorkspace Playground 可选 3D NPC 模型替换指南:基于 GLB 的 Voxel 身体升级方案
【免费下载链接】hermes-workspaceNative web workspace for Hermes Agent — chat, terminal, memory, skills, inspector.项目地址https://gitcode.com/gh_mirrors/he/hermes-workspace点击查看免费下载本文依据仓库 public/avatars-3d/README.md 编写并对照 HermesWorkspace 前端 3D 世界源码展开。该文档定义了一套「可选 GLB 换装」机制你只需按 NPC id 命名一个 GLB 模型并放入指定目录Playground 场景中对应的 voxel体素角色身体就会被自动替换为精细的 3D 模型而角色名牌portrait-chip nameplate保持不变。读完本文你将掌握受支持的 NPC id 清单、Meshy 等工具的 Text-to-3D 生成管线、GLB 的放置/加载路径、尺寸对齐方法、性能预算约束以及模型缺失时的自动降级行为。机制总览从 Voxel 身体到 GLB 模型的「零侵入」替换HermesWorkspace 的 Playground 是一个基于 Three.js / react-three-fiber 构建的 3D 世界其角色默认由低多边形体素网格legs / feet / torso 等 boxGeometry 组合组成。GLB 换装机制的本质是只要对应 id 的 GLB 文件存在渲染路径就切换到 GLB 模型文件不存在则继续渲染 voxel 身体不会报错、不会出现坏状态。从 playground-world-3d.tsx 的 NPC 渲染逻辑可以看到这个分支const glbId npcId || avatar const hasGlb useGlbAvailable(glbId, isNear || highlight) // ... {hasGlb ? ( // GLB body replaces voxel meshes when /avatars-3d/id.glb is present. PlaygroundNpcGlb avatar{glbId} / ) : ( {/* legs */} mesh position{[0.13, 0.22, 0]} castShadow.../mesh {/* feet */} mesh position{[0.13, 0.04, 0]} castShadow.../mesh {/* torso (robe) — colored per NPC */} mesh position{[0, 0.7, 0]} castShadow.../mesh ... / )}也就是说useGlbAvailable()返回true时渲染PlaygroundNpcGlbGLB 身体否则渲染默认的体素角色。整个流程对玩家Player同样适用——playground-player-glb.tsx 实现了同构的玩家 GLB 替换默认 id 为player-adventurerscale{0.92}。受支持的 NPC id 清单文档明确规定了可被识别的 NPC id 全集共 15 个分为两组奥林匹斯神系8 个id角色设定athena智慧女神雅典娜apollo太阳神阿波罗iris彩虹女神伊里斯nike胜利女神尼姬pan牧神潘chronos时间化身hermes商业与信使之神赫尔墨斯eros爱神厄洛斯村庄职业角色7 个tavernkeeper酒馆老板、banker银行家、trainer训练师、innkeeper旅店老板、apothecary药剂师、recruiter招募官、shopkeeper店主。从源码实现看id 在进入 URL 构造前会经过一次清洗playground-npc-glb.tsx 中的candidateUrls()使用id.replace(/[^a-z0-9_-]/gi, )剔除非法字符空结果回退到villager-common。这意味着 id 命名应遵循小写 kebab-case与 public/assets/hermesworld/characters/README.md 中「lowercase kebab-case ids」的命名规则一致同时这也对运行时探测到的任意字符串提供了安全兜底。GLB 生成管线Text-to-3D原文档给出了一套面向 Meshy.ai 的完整生成流程适用于免费额度场景打开 https://www.meshy.ai/免费档200 credits/月约 15 次生成。使用Text-to-3D功能。按角色填写提示词prompt。文档为 8 位神系角色各提供了一条可直接复用的建议 prompt均要求 stylized low-poly 游戏角色、T-pose、全身、中性光照athena.glb— Greek goddess Athena, owl helmet, robed, holding a scroll, stylized low-poly game character, T-pose, full body, neutral lightingapollo.glb— Greek god Apollo, laurel crown, holding a lyre, golden robe, stylized low-poly game character, T-pose, full bodyiris.glb— Greek goddess Iris with rainbow-colored wings, courier outfit, stylized low-poly game character, T-pose, full bodynike.glb— Greek goddess Nike of victory, winged warrior, bronze armor, stylized low-poly game character, T-pose, full bodypan.glb— Greek god Pan, satyr legs, panpipes, leather smith apron, stylized low-poly game character, T-pose, full bodychronos.glb— Personification of time as a Greek archivist, hourglass robe, long beard, stylized low-poly game character, T-pose, full bodyhermes.glb— Greek god Hermes, winged sandals, winged helmet, caduceus, traveler robe, stylized low-poly game character, T-pose, full bodyeros.glb— Greek god Eros as an apothecary, bow on back, robe with vials, stylized low-poly game character, T-pose, full body将风格细化到 Stylized 或 Realistic 之一——推荐整套 8 个角色使用同一种风格保证整体视觉一致性。下载 → Download Model → 选择 GLB 格式8K 纹理可用。将文件放入public/avatars-3d/id.glb刷新页面即可生效。补充说明仓库同时维护了另一条规范路径 —— public/assets/hermesworld/characters/README.md 定义角色资产应放在/public/assets/hermesworld/characters/id.glb例如player-adventurer.glb、guard-knight.glb、villager-common.glb其推荐管线为 Ready Player Me 人体基底 → Mixamo 动画剪辑 → GLB 导出 → 浏览器端优化并列出首批需要支持的动画idle、walk、run、talk、inspect、use。这两条路径目前同时有效从 playground-npc-glb.tsx 的候选 URL 数组可以看出加载时会先探测/assets/hermesworld/characters/id.glb再回退探测/avatars-3d/id.glblegacy 路径因此新资产建议放规范路径旧资产无需迁移。运行时加载机制HEAD 探测 接近触发懒加载GLB 的加载不是无脑全量拉取而是经过了精心设计的探测与懒加载HEAD 探测playground-glb-body.tsx 中的useGlbProbe()对 URL 发起fetch(url, { method: HEAD })并校验响应状态与 Content-Type要求r.ok且不是text/htmlContent-Type 需命中octet-stream/gltf/binary/ 空串 /application/之一否则视为缺失。探测结果缓存在模块级probeCacheMap 中避免重复请求。接近触发playground-world-3d.tsx 的useGlbAvailable(id, enabled)只有在enabledisNear || highlight即玩家靠近 NPC 或该 NPC 被高亮为真时才发起探测请求结果同样缓存在模块级_glbPresence。NPC 的「靠近」判定阈值约 2.6 个单位距离见同文件dist 2.6的邻近检测逻辑。错误兜底GLB 挂载外层包裹了GlbErrorBoundary捕获渲染错误并标记为 missing和Suspense fallback{null}加载期间不渲染任何内容因此即使 GLB 文件损坏或加载失败也不会拖垮整个 3D 场景。尺寸与对齐让 GLB 与体素角色站在同一坐标系Playground 的体素身体高度约为1.6 个世界单位脚底位于 y0。若导入的 GLB 过高或悬浮在空中需要调整缩放与垂直偏移。原文档指出在playground-world-3d.tsx中修改PlaygroundNpcGlb scale{...} yOffset{...}的调用参数默认值为scale1, yOffset0。对照当前仓库源码需要说明两点实际差异渲染管线中真正承载这两个参数的是OptionalGlbBodyplayground-glb-body.tsx它把scale/yOffset透传给GlbInner最终体现为group position{[0, yOffset, 0]} scale{scale}当前代码里 playground-npc-glb.tsx 实际传入的是scale{0.95} yOffset{0}玩家 GLB 为scale{0.92}这是针对多数生成器输出尺寸的经验校准值。因此如果你的 GLB 落地后偏高或偏矮可以调整PlaygroundNpcGlb/PlaygroundPlayerGlb传入的scale若模型底部未贴地则增大yOffset的负值方向或直接调scale。Meshy / Tripo 等工具生成的 GLB 大多已预缩放到接近 1.6 米通常无需额外调整。性能预算每个 GLB 的硬性约束为避免 3D 场景在低端设备上掉帧文档给出了明确的资源预算这也是仓库资产的硬性验收标准单文件体积压缩gzip后 2 MB三角面数每个角色约10k 三角形足够更多属于浪费纹理避免 4K最高使用 1024 或 2048。除此之外源码在运行时还会对 GLB 做一轮降本优化见 playground-glb-body.tsx 的GlbInner克隆场景后遍历所有网格开启frustumCulled视锥剔除、关闭castShadow/receiveShadow阴影投射/接收将raycast置为空函数NPC 点击事件由外层group的onPointerDown处理模型自身不参与射线检测将贴图anisotropy设为 2兼顾斜视角清晰度与采样开销。这些处理说明即使放入了高面数的模型运行时也会自动关闭阴影等重开销特性配合约 10k 三角面的预算约束可以稳定跑在浏览器端。缺失与混合搭配优雅降级是默认行为该机制的最后一个设计要点是容错。原文档明确如果 GLB 缺失voxel 身体会自动显示——无报错、无坏状态。混搭完全没问题只有 Athena 的 GLB那就只有 Athena 获得升级。这与前文分析的代码路径完全吻合useGlbAvailable()返回false时走体素分支useGlbProbe()的模块级缓存会在首次探测后记住结果重复进入场景不会重复请求缺失资源。因此你可以按需逐步为角色追加 GLB而不是一次性补齐 15 个——每一次追加都独立生效且不会影响其他仍使用 voxel 身体的 NPC。小结一条从资源生产到运行时渲染的完整链路整体来看这套可选 GLB 换装机制是一条清晰的可落地链路Meshy Text-to-3D 生成 → GLB 导出 → 按 NPC id 命名放入public/avatars-3d/id.glb或规范路径public/assets/hermesworld/characters/id.glb→ 前端 HEAD 探测 接近触发懒加载 → scale/yOffset 微调 → 体积/面数/纹理预算把关 → voxel 自动降级。它既保证了零代码侵入的资产接入体验又在运行时提供了缓存、错误边界与性能优化适合在 HermesWorkspace 的 Playground 中持续推进角色视觉升级。赞分享【免费下载链接】hermes-workspaceNative web workspace for Hermes Agent — chat, terminal, memory, skills, inspector.项目地址https://gitcode.com/gh_mirrors/he/hermes-workspace点击查看免费下载相关推荐ChatterBot 自定义 Statement 与 Tag 模型完全指南基于 Django AUTH_USER_MODEL 模式实现模型可替换ChatterBot 自定义 Statement 与 Tag 模型完全指南基于 Django AUTH_USER_MODEL 模式实现模型可替换 本指南面向在人工智能NLP交互助手MAS 激活 Windows 和 Office 完整教程3 步免费激活无需密钥MAS 激活 Windows 和 Office 完整教程3 步免费激活无需密钥 MASMicrosoft Activation Scripts是一款开源操作系统替身文题材模板深度解析基于 webnovel-writer 的替身文创作体系与工程化落地指南替身文题材模板深度解析基于 webnovel writer 的替身文创作体系与工程化落地指南 导读 本文围绕开源仓库 webnovel writer 的 替身人工智能AI 应用AI 写作RAGAI 插件AI 技能上一篇CoffeeScript 1.6.2 发布说明深度解析Source Maps 行映射、Literate 项目支持与 fork 机制修复下一篇Doom Emacs插件开发API利用Doom-lib编写模块创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考