关于 web-3d-asset-pipeline
面向浏览器 3D 项目的资产制作技能,指导将模型整理为可用于运行时的 GLB 或 glTF 2.0 文件。适合已选定引擎、需要处理资产质量、优化与打包的开发者,不涉及场景代码。
主要功能
- 01GLB 和 glTF 2.0 交付指导
- 02资产清理与变换检查
- 03几何体和纹理优化
- 04碰撞代理与 LOD 规划
- 05引擎无关的运行时资产建议
适用场景
- 01准备适用于浏览器交付的模型
- 02使用 glTF Transform 缩减资产体积
- 03交付前检查枢轴、比例和命名
- 04为场景规划碰撞代理与 LOD
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ openai/ plugins --skill web-3d-asset-pipeline安装后在 Claude Code 中输入/web-3d-asset-pipeline确认已加载。
附带文件agents/openai.yaml
详细介绍
Web 3D 资产管线
概述
这项技能适用于已交付的 3D 资产,而非运行时场景代码。此插件中,浏览器 3D 工作的默认输出格式为 GLB 或 glTF 2.0。目标是获得可预测的运行时资产,而不是直接采用 DCC 工具首次导出的结果。
本指南与引擎无关,可用于 Three.js、React Three Fiber、Babylon.js 或 PlayCanvas。
适用场景
- 任务涉及 GLB 或 glTF 交付格式
- 任务涉及模型清理、纹理打包、压缩、LOD 或碰撞代理
- 运行时技术栈已确定,剩下的问题是资产质量或大小
不适用场景
- 任务涉及场景、摄像机、渲染器或游戏循环结构
- 任务纯粹涉及 React 与原生 Three.js 路由的选择
- 用户仍在决定使用哪种运行时引擎
默认管线
- 使用 Blender 等 DCC 工具制作并清理源资产。
- 导出为 GLB 或 glTF 2.0。
- 使用 glTF Transform 进行优化。
- 验证命名、枢轴、变换、材质复用情况和纹理预算。
- 根据需要添加碰撞代理、LOD 策略和烘焙光照假设。
- 交付优化后的资产,并使用引擎原生的 GLTF 支持加载。
格式规则
- 默认交付格式:GLB 或 glTF 2.0。
- 不要将 FBX、OBJ 或 DCC 原生格式视为长期运行时契约。
- 交付前应用或规范化变换。
- 在整个资产集中保持单位、枢轴和朝向约定一致。
优化规则
- 使用 glTF Transform 进行裁剪、去重、简化和打包。
- 有意识地使用几何压缩。
- 如果解码开销和兼容性适合运行时,Draco 是有效选项。
- Meshopt 通常是 Web 交付的理想默认选项。
- 有计划地压缩纹理。
- 运行时技术栈支持时,使用 KTX2 或 BasisU。
- 在更广泛的资产管线中适用时,使用 WebP 或 AVIF。
- 尽可能复用材质和纹理,以降低内存和绘制调用开销。
面向运行时的资产规则
- 保持模型层级名称稳定且有意义。
- 设置枢轴和原点时,应考虑游戏交互需求,而不只是 DCC 工具的便利性。
- 为物理效果密集的场景制作明确的碰撞代理。
- 在最终导出前,确定采用动态光照、烘焙光照还是混合方式。
- 为大型环境或重复道具规划 LOD。
- 纹理分辨率应与屏幕上的实际用途相称,而非追求源艺术的极致效果。
常见问题
- 未经清理就交付原始 DCC 导出文件
- 唯一材质过多
- 纹理尺寸远超可见需求
- 缺少碰撞代理
- 资产之间的缩放或枢轴不匹配
- 在运行时代码中弥补本应在上游修复的资产问题
参考资料
- Three.js 技术栈:
../../references/threejs-stack.md - React Three Fiber 技术栈:
../../references/react-three-fiber-stack.md - GLB 加载器入门指南:
../../references/gltf-loading-starter.md - Rapier 入门指南:
../../references/rapier-integration-starter.md - 3D 资产管线参考:
../../references/web-3d-asset-pipeline.md - 其他引擎:
../../references/alternative-3d-engines.md
评论
支持 Markdown