sandbox.babylonjs.com
获得徽章 0
- 就不发Tag了……
程序实现上其实没什么难点，Babylon.js引擎基本上提供了WebGL能提供的大部分功能，剩下的大都也只是技巧类的东西。真正难的部分一个是3D整体管线搭建，再一个是PBR流程的掌握还有GLTF的压缩。3D管线这块，因为这次3D部分用的不是3D扫描，而是3D服装+3D人体模型+捏脸+动捕，头发的部分也是后做的，所以整体的难度提升了不止一倍，而且因为新挤进来好几个软件，所以最后能准确输出GLTF格式就很关键，基本项目开始的前半个月都在选型的阶段，最后定的是用Blender作为最后的整合工具，因为Blender作为DCC工具兼容性尚可，另外就是它能直出带有Draco压缩的GLB格式，相比之前的fbx+fbx2gltf来说更加可控。而特别值得一提的是，这次发现了Gestaltor这个东西，虽然不太稳定(也在快速迭代，做项目的时候居然连着更新了两版
)，但它几乎是市面上唯一能直接编辑GLTF/GLB文件的软件，并且唯二是它可以支持普通贴图直转basisu扩展的ETC1S+basisLZ编码压缩……要知道这种编码方式文件小不说(能压缩掉Normal)，还Android+Apple全兼容，算是解决了一个大问题~还有就是对PBR的理解，我觉得做金属或者是类似C4D(偏孟菲斯那种高饱和式的风格)可能相对来讲更容易一点，做布料的材质模拟就很难，感觉起码得熟读迪士尼原则才玩的转(话说上一个项目已经去看动画片了)🤣🤣🤣。。。总之基本就这些东西吧，晚上睡不着随便写写就 展开赞过
评论3 - 发个作品。
5个场景+1个首页(首页是把5个场景的模型bia到一起)，舞蹈用了真人动作捕捉+3D扫描的方式，配乐原创(可能有点燥，耳机音箱预警)。打开应该会弹出到自带浏览器查看，如果看不了可以试试复制网址到微信里(安卓原版系统可能有卡顿和发热现象，表现不如x5)。
主要是网页3D里的PBR材质渲染，引擎选了Babylon.js，用了一点点动态材质(5个场景的水体和第5个场景模型上的贴图)
中间很痛苦的去把PBR入了个门，主要是发现3D那边输出的东西完全用不了。他用maya(Arnold)渲染、然后fbx导出的，导出的时候已经丢了些材质了，再转glb(+draco压缩)加载到引擎里就惨不忍睹……后来没辙，只能拉着美术把原始贴图单独导出，再在 SubstancePainter 里二次加工搞(中间还试过8猴和一个自动生成贴图的东西，都被pass了)，不过后来发现吃透PBR流程的话，其实没那么麻烦……水体和火焰其实没怎么细抠，主要项目工期太赶了。
现在这个版本每个场景用了一个页面实现，主要是向iOS妥协的结果。因为最开始所有场景是做到同一个页面里的，但是发现iOS有的机器能看，有的就反复刷新，而且跟机型和系统版本的关联性也没啥关系，估计就是内存占太大被系统杀(因为安卓中低端，只要不是太老一般都扛的住)。另外中间了解到的一个冷知识是，iOS表现不如安卓，可能跟不支持WebGL2有关，因为WebGL2不够“通用”，所以Google、Moz和Apple已经在提交下一代标准“WebGPU”了(暂定名)，Apple提的方案叫WebMetal，其实主要是用他家的Metal接口。巧的是Babylon.js正好也支持WebGPU渲染，就试了一下，结果test页面iOS设备没一个能跑的起来(估计是标准不合吧)，就放弃了🤣……所以就有了现在这个多页面的版本。
哦对，中间还试过一个纹理格式basis，文件小的令人发指(虽然我也知道是有损吧，但比JPEG还小就有点过分了)，但是也因为iOS不支持就放弃了(准确的说，是iOS支持其编码，但是没开放给WebGL使用)。
Babylon.js就支持GLTF标准里的几种默认灯。一开始觉得挺难用的，后来发现Babylon支持用模型+hdr场景生成一个超级小的env环境光描述文件，效果和原hdr加载环境光是一致的。后边只要微调下个别场景内的组件就行。展开等人赞过 712 - Babylon.js 在线工具大全：
Babylon.js Sandbox [
sandbox.babylonjs.com ]（查模型用）
Babylonjs Playground [www.babylonjs-playground.com ]（写小Demo用）
Babylonjs Editor [editor.babylonjs.com ]（这个可以给TA用，导出场景）
Babylonjs-CYOS [cyos.babylonjs.com ]（写Shader预览用） 展开等人赞过 评论6
