UE4---雨点和水滴滑落效果笔记

GIF 2021-1-5 21-32-16

涟漪Mask制作

贴图的R通道存储的是涟漪的范围,涟漪中心为最亮,往四周渐变为黑色

image-20210105180330662

利用Texture.R - (1 - frac (time * 涟漪变化速度)得到沿涟漪中心往外伸展的效果

image-20210105180706389

img

利用同样的Distance获取涟漪的边缘,并缩放到0-1,最后取反

image-20210105180806279

可以看到,涟漪的而结束很生硬,没有淡入淡出

GIF 2021-1-5 18-09-32

利用数学运算创造一个过度平缓的函数周期,实现淡入淡出效果

image-20210105181434294

image-20210105181531663

最后要解决的就是涟漪的连续问题,同样解决的方法与Flowmap相同,创建两个涟漪动画,一个涟漪动画偏移一段时间,然后用Lerp函数将两端动画进行融合

image-20210105183831136

image-20210105183843705

就是重复感有点强烈

GIF 2021-1-5 18-45-17

各种混合

得到涟漪Mask之后一切就好做很多了,接下来就是各种属性混合

涟漪法线Lerp的Alpha用的是Mask动画融合的Alpha,与输入法线混合用的是涟漪Mask

image-20210105184733930

基础颜色混合,输入的基础颜色与水颜色,水亮度相乘得到的就是水涟漪颜色,大多数金属材质在潮湿的情况下回变暗,所以下面的基础颜色根据金属度进行一定的Lerp操作。

image-20210105184948291

金属度和粗糙度混合

image-20210105185326642

最终涟漪

这里我随便找了一个UE4自带金属材质连接MF_RainSurface进行测试

image-20210105185553502

GIF 2021-1-5 18-56-30

水滴滑落材质

水滴滑落大多数会出现倾斜的情况,以正方体为例,雨水从上方落下,那么滑落情况只会出现在侧面

image-20210105200534777

我们从这个方面开始入手,用世界空间位置作为水滴滑落纹理的采样UV,由于只是需要侧面进行正确的采样,所以我们只需要在xz平面和yz平面进行贴图采样,根据顶点法线的X轴Mask进行lerp操作

image-20210105201116876

得到效果如下

image-20210105201142251

法线也用同样的UV去采样,同样的Alpha去Lerp

image-20210105210347108

同样我们需要采样贴图的B通道,得到的是向下移动块状的渐变图

image-20210105210948360

image-20210105211030445

我们将从G通道获取的水滴图减去B通道得到的块状渐变图,可以形成水滴滑落的错觉

image-20210105211349933

GIF 2021-1-5 21-14-59

将水滴法线与正常的法线方向根据水滴滑落Mask进行混合(0.5,0.5,1),才能得到正确的法线

image-20210105211605556

水滴滑落效果和涟漪结合

首先要获取永远朝上的Mask贴图,其实就是将法线方向从切线空间切换到世界空间,只获取B通道

image-20210105211951450

后面与1.1相乘是为减弱水滴拉伸的出现,可以看到当平面轻微倾斜的时候,会出现水平拉伸的情况

image-20210105212902536

得到Z轴Mask贴图之后,将涟漪和水滴滑落Mask做最后的混合

image-20210105213026999

最终效果

GIF 2021-1-5 21-32-16

全家福

image-20210105213337560

  • 版权声明: 本博客所有文章除特别声明外,著作权归作者所有。转载请注明出处!
  • Copyrights © 2015-2021 Opda
  • 访问人数: | 浏览次数:

请我喝杯咖啡吧~

支付宝
微信