Appearance
Web 编辑器内容制作指南
写在前面:
- Web 编辑器制作的 GLTF 内容,适用于 ThreeJS 和 XRFrame 框架渲染,无法使用在易现自研渲染引擎
- AR 模型需要通过其他建模软件制作,例如:Blender 、Maya 等
- 制作完成的模型,需导出为 GLB、FBX、OBJ 等格式后在 Web 编辑器中导入。推荐 GLB 格式!
- 建议最终输出的内容资源包(GLTF、GLB)在 10MB 以内
一. 基本使用说明
常见使用功能包括:
1.创建简单模型和光源
2.导入和导出
3.编辑
4.平移旋转缩放
5.调整材质
6.切换编辑器语言
切换后刷新生效
二. 制作桌面级 6DoF 内容
平台直接在线编辑跳转 Web 编辑器
导入一个模型
样例模型:
其他模型素材:
增加一个光源
光源目前仅支持平行光(DirectionalLight)、点光源(PointLight) 因为导出 GLTF 时,会丢失其他光源 如需使用其他光源,可在实际接入时,在代码中添加。
调整模型大小方向
- 需要注意模型的位置,实际体验放置时,会以放置的位置为坐标原点
- 模型朝向 Z 轴正方向摆放,在小程序体验时,模型才会正确面对相机
- 可点击编辑器中右下角坐标轴上的 X Y Z,快速切换视角,方便移动模型
导出
导出 GLTF 或直接发布到平台(推荐)
三. 制作大场景 6DoF 内容
平台直接在线编辑跳转 Web 编辑器
导入用于锚定位置的点云或 Mesh
点击『文件 - 加载地图』,选择地图以及类型(点云或低模任意都可)
导入要摆放的模型
样例模型:
其他模型素材:
调整模型的大小与位置
- 调整模型大小,位置,摆放到实际场景中
- 可点击编辑器中右下角坐标轴上的 X Y Z,快速切换视角,方便移动模型到目标位置
- 注意摆放的过程中,切勿移动点云图层,或者 Mesh 图层,会导致锚定不准确
增加一个光源
光源目前仅支持平行光(DirectionalLight)、点光源(PointLight) 因为导出 GLTF 时,会丢失其他光源 如需使用其他光源,可在实际接入时,在代码中添加。
导出
导出 GLTF 或直接发布到平台(推荐)
四. 制作图片跟踪内容
平台直接在线编辑跳转 Web 编辑器
跳转后会自动在 0 点位置,放置配置的识别图
导入要摆放的模型
基于识别图的位置,摆放模型
样例模型:
其他模型素材:
增加一个光源
光源目前仅支持平行光(DirectionalLight)、点光源(PointLight) 因为导出 GLTF 时,会丢失其他光源 如需使用其他光源,可在实际接入时,在代码中添加。
导出
导出 GLTF 或直接发布到平台(推荐)
五. 制作环绕体验内容
平台直接在线编辑跳转 Web 编辑器
导入要摆放的模型
基于识别图的位置,摆放模型
样例模型:
其他模型素材:
增加一个光源
光源目前仅支持平行光(DirectionalLight)、点光源(PointLight) 因为导出 GLTF 时,会丢失其他光源 如需使用其他光源,可在实际接入时,在代码中添加。
调整模型位置
注意模型的位置,在 Z 为正时,会在环绕体验进入时的正前方
导出
导出 GLTF 或直接发布到平台(推荐)
常见问题
- 导入到内容编辑器的模型效果与建模软件中不一致 Web 编辑器与建模软件不是一样的渲染器,有着不一样的灯光环境,所以您需要在内容编辑器中为模型设置材质和灯光环境。
- 导入到内容编辑器的模型丢失了贴图 模型在转换的过程中存在丢失贴图的情况,你只需要在 Web 编辑器中进行材质调整赋予贴图即可。