《Trifox》中的遮挡处理和溶解着色器技术（下）
发表于2017-02-18
上篇回顾
在上篇文章中，提出了一个有待解决的特殊问题：如何在游戏过程中处理遮挡住镜头视野的物体？我们提出了适用于该游戏的解决方案，考察了一些常用的着色器技术，比如:世界空间贴图和基于纹理的溶解着色器。效果如下：
本篇内容
由于基于纹理的溶解着色器存在一些瑕疵，让我们不得不考虑完全摈弃纹理，而程序3D噪声方法会是一个比较好的选择。换句话说，我们可以使用数学过程由程序来生成3D噪音，以世界空间坐标为主要的输入参数，使用一个由包含0到1之间变化值的渐变体组成的3D纹理。
鸟瞰视角例子：Arrow Head的《Helldivers》
下面一起来看看使用纹理和使用程序生成3D噪声这两种方案的对比。
基于纹理的溶解着色器的效果
基于程序3D噪声的溶解着色器效果
很神奇吧，全程序化技术与纹理技术相比的平滑度差别有多么大，再加上一个自发光边缘，就会看到有趣的魔幻破碎效果。
这是因为使用程序生成的3D噪音可以任意缩放而不损失质量。并且由于不需要UV坐标，无论物体之间方向如何，溶解过程同样也会无缝衔接。不过，这个问题解决之后，还需要思考一下：如何使用这个技术动态地处理镜头遮挡问题？
引入屏幕空间坐标系 － 动态处理镜头遮挡问题
上篇文章在谈到如何处理遮挡问题时，我们提到过玩家应当能够感受到被隐藏的障碍物的存在。如果可能的话，在不影响视野的前提下，我们仍然希望能够看见隐藏物体的一部分。为了实现这一点，我们在着色器中引入了屏幕空间坐标系。用这种方法，可以在屏幕空间中根据将要渲染的表面离屏幕中心的距离来决定是否移除它。
通常屏幕空间坐标系是用来做后期特效的，但在这里用于影响物体的基本着色。添加下面的着色器输入结构体来访问屏幕空间位置：float4 screenPos;这样就能够像访问世界坐标一样，访问屏幕坐标。
用这样的方法，我们计算出一个简单的屏幕空间辐射渐变，并应用到场景中的物体上。值得注意的一点是，这并不是覆盖效果，而是屏幕坐标直接影响了渲染的几何体的色彩值。如下图，最终画面结果感觉就像用一个聚光灯照射在屏幕中心一样。
一个完全未改变的辐射渐变
经过了压缩调整的辐射渐变
经过压缩调整的辐射渐变可以符合屏幕的形状，并给出最终需要的遮罩。这个生成的遮罩能够帮我们判断出哪些部分需要溶解。但仍有一个重要的问题需要解决：如果就这样使用该遮罩，可能会为整个场景从相机位置开始打一个无限远的洞，如果玩家站在了一个可被溶解的遮挡物前，会怎样呢？我们希望确保那些物体保持完全可见，或至少把溶解效果控制在最小范围。
这个问题可以通过将玩家和相机的距离纳入计算，并分析渲染物体的深度值，被很好地解决掉。加入噪音遮罩后，最终得到如下结果：
这里玩家距离被设为固定的20米，以便展示效果更好
最终用于《Trifox》的效果添加了额外的步骤以获取更多的处理选项，比如通过顶点绘制来降低溶解密度，屏幕空间下降的控制，以及各种噪音微调选项。下图展示了完整的遮挡处理系统的效果：那么我们如何达成这个目标？解决这个问题需要考虑如何来轻松地创建一个很棒的隐藏效果，可应用于各种游戏中的各种物体上。本文将阐述实现最终方案的过程，从深入研究一些常用的溶解着色器技术开始。
可以在拱门的下半部分看到基于深度的噪音衰减效果和顶点绘制控制。
在Unity 5.6 Beta版中，Vulkan使图形显示性能更上一层楼，在最终发布的正式版中，Vulkan将支持Android，Windows，Linux，以及Tizen平台。
最后一步 － 功能检查与验证
在宣布遮挡处理系统完工前，让我们一起回顾最初的需求，并探讨这个方案是否符合。
- 障碍物：应当以一个平滑而自然的方式移出视野，在任意角度都有效，即使已经被隐藏，玩家应当依然能够感觉到它的存在。
- 关卡设计师：需要能够控制哪些东西可以被隐藏，以此加强环境的深度感。
- 系统：无论角色和镜头之间的距离如何变化都能工作。
- 设置工作：尽可能简化。
恭喜，任务完成！现在拥有了一个能够正常运转的系统，能够实现我们想要的效果，并且风格与游戏相匹配。
总结
回顾整篇文章，以上是攻克《Trifox》中的障碍物处理问题的过程。从定义问题开始，我们考察了可能的解决方案，然后一步一步实现了最终游戏里的效果。
我们最终使用的是一个可以实现很多视觉效果的技术，《Trifox》中的大量游戏细节都使用该技术，包括让被打败的敌人和被破坏的物体消失，以及改变环境的外观或让整个世界淡入或淡出等等。下面提供了两个原型示例，展示这个技术的不同应用：
比利时工作室Exiin也在游戏《Ary And The Secret Of Seasons》中运用了同样的技术，如下图所见，用来将季节球淡出。
希望您喜欢这两篇关于《Trifox》中的障碍物处理和溶解着色器技术的文章。
以上就是第二部分的内容。想要查看着色器代码或者回顾第一部分的内容，请关注《Trifox》中的遮挡处理和溶解着色器技术