使用Blender\Verge3d\ThreeJs 开发Web3d应用
在这块已经摸索有一小段时间了，很遗憾一直没有很正式的项目把整个工作流程跑起来，可能本身的工作流程就是很冗长复杂，所以需要这么多岗位拆分成这么多的环节，公司的产品也是一层一层的封装，架构比较复杂。然而对于想了解全貌的我来说，能基于公司的框架去拼搭积木还不够，所以我想找一套适合自己的，轻巧又相对完善的套路，把Web3D玩起来。
从最早的看Threejs/BabylonJs的examples，到网上的一些小页面（真的是粗糙简单），再到一些小的h5 3d小游戏，到后面接触到一些cg软件包括渲染器，再到到处找模型资源以及一些插件。因为本身比较庞杂，又没在专业的公司，所以挺麻烦的。最后找到一套比较合适的工作流程，至少适合于当前的自我需求
Verge3D是老牌的Blend4web核心团队开发的，专门来桥接 CG软件到Web的解决方案，他可以非常方便的把完整的场景以及渲染效果等搬到Web上（当然还有动画、物理）等效果，非常适合小团队解决Web上编辑器弱，渲染效果有差异等各路问题，而且是基于ThreeJs的，不会带来新的学习投入，非常方便
开发Web3d应用
- 通过 Blender 完成模型资源本身的编辑
- 通过 Verge3d 完成 Blender场景布置以及渲染预览 到 WebGl应用发布
- 通过 Verge3d(基于Threejs) 程序API进行Web层面的开发改造完成应用
开发Web3d编辑器以及服务端高清渲染
- 基于ThreeJs在web端完成编辑器的开发，主要起场景编辑的作用，真的模型资源等通常都是直接导入资源
- 基于Web的粗布预览，确定 相机 参数
- 将场景信息（空间信息）和 相机 参数 传递到后端
- 后端解析数据，带入更丰富的场景数据，调用 Blender Python Api 生成 .blend 主文件
- 使用Blender命令行参数 后台执行渲染操作，并保存成文件
- 将文件传递回前端
因为自己不是美术出身，计算机图形学也是较浅的自学，所以渲染效果完全谈不上精致和美感，不过长期的程序开发习惯也发现了一些问题，最主要就是建模或者调整材质等都是靠手工拖拽或者插件的协助（此处赞一下Blender的交互设计以及庞大的插件生态圈），但是对于体量稍大的资源来说，需要耗费很多精力。也许是出于技术人比较好奇但并无太多精力耐心去雕琢一个产品，另外建模、材质、着色等其实也是程序生成和处理的，所以能很方便的开发调试成品也非常重要。因此又总结了一些小资源
辅助资源与经验总结
- 建模（几何结构）层面分为多边形建模（计算机记录点、线、面结构）和隐式建模（计算机记录参数方程等数学中的关键信息，再由0-1离散化成可视的 点、线、面）。
- 多边形建模 可以在Blender2.92以上（个人使用Blender3.1 alpha）中使用几何节点进行处理，个人感觉对程序员非常友好，都是熟悉的味道
- 隐式建模 又分为 显示函数方程（y=f(x))和参数方程(x=fx(u,v),y=fy(u,v))，当然曲面就更复杂了，这里写了一个小工具可以供大家参考（当然也有很多其他更优秀的工具，哈哈）：传送门
- UV可以直接在Blender中进行编辑好，程序上不用做处理，至于法线，正常来说都是模型资源里的法线贴图决定了，程序上也不用太多处理
- 至于完整的模型（包含材质、贴图）等，建议还是直接网上找吧，这里有个不错的：传送门，里面有完整的 hdr环境贴图、各种材质包、以及完整的模型，对于学习使用已经足够了，如果需要某些更具体的，可以直接万能的淘宝
- 关于Shading，Blender中已经有很方便的工具，但是需要较强的图形学功底，同时要对常规的数学函数有很深的理解，可以参考我前面写的工具，如果要锻炼 glsl本身，那么推荐 传送门 和 传送门至于用 节点工具还是coding，看大家喜欢咯，个人还是偏向在代码模板内直接coding，更快。但是因为没法调试，所以在考虑自己写一个工具，或者使用 blender，把每次的值存储一下展示，还在思考尝试当中。另外最近ThreeJs官方也推出了一个第三方库可以访问：MaterialNode
个人目前的思考是，既然是程序出身而不是美术出身，可能会更多考虑使用程序打造工具去做一些串联工作，目前比较看好的是 Blender的插件机制和使用Blender Python Api开发一些有趣的东西，一直也在做可视化的工作，找到一个大佬的 用Blender当可视化工具玩，感觉还不错，推荐给大家：传送门 / 传送门