UE5 材质 雨滴shader

这篇具有很好参考价值的文章主要介绍了UE5 材质 雨滴shader。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

潮湿效果

物体表面是如何变湿的?

  • 物体表面吸水使颜色变深
  • 潮湿的颜色会变得暗淡且饱和

实现

  • 增加饱和度且变暗

    UE5 材质 雨滴shader

潮湿的物体表面的特点

  • 当水作用在材质表面,材质表面的specualr会略微变弱且粗糙度会大幅降低
  • 对于积水的表面,我们设置它的roughness = 0.07, specualr = 0.3,一个value = 1用于控制潮湿程度,最后进行lerp即可

实现

  • 潮湿程度为1的效果
    UE5 材质 雨滴shader

  • 潮湿程度为0的效果
    UE5 材质 雨滴shader

  • 加入多孔性

    多孔性也就是吸水性,多孔性越高,颜色越暗
    UE5 材质 雨滴shader

表面水珠(Rain Drop)效果

本节展示如何实现雨滴效果

雨滴纹理

为了实现表面水珠,我们需要一个雨滴纹理,它的RG通道表示雨滴法线;B通道表示时间偏移mask(使得雨滴在不同时间出现);alpha通道表示静止和动态的雨滴

  • 雨滴法线
    UE5 材质 雨滴shader

  • 时间偏移
    UE5 材质 雨滴shader

  • 动静雨滴

    黑点表示静止的雨滴,白色表示动态雨滴
    UE5 材质 雨滴shader

实现

处理normal

因为在纹理图中normal的范围为[0,1],而归一化normal范围为[-1,1],因此我们需要进行一个转化
UE5 材质 雨滴shader

处理时间偏移

这里重点在于Frac(),因为G通道值大多各不相同,这样减去时间的增量并取小数部分限制在[0,1]即可实现如下的闪烁效果
UE5 材质 雨滴shader
UE5 材质 雨滴shader

动态雨滴

只需将时间offset用于A通道即可实现动态雨滴效果

  • 无normal
    "Multiply" "subtract" 是因为这里想提取time offset的白色雨滴(大雨滴)
    UE5 材质 雨滴shaderUE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 有Normal

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

静态雨滴

  • 因为在A通道中,黑色是静态雨滴,白色是动态雨滴,在处理动态效果时只处理了白色的值,那么在处理静态效果时进行一个反转即可

    注意,这里使用power()是因为我们只想要得到白色和灰色的效果并不想要灰色,但此时范围是[-1,1],因此需要控制一下范围
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

控制雨滴效果方向

  • 在现实中,雨水来自天空,肯定只有上面才有雨滴效果,整个物体都有雨滴效果是不科学的,因此我们需要控制雨滴效果的方向——normal方向

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

控制水滴的粗糙度

  • 目前已知表面偏向0,雨滴偏向1,而我们想要的效果是雨滴光滑表面粗糙,因此可以将之前得到的值进行反转然后作用域roughness即可

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

流淌雨滴(Rain Drip)效果

流淌雨滴纹理

和雨滴效果相同,流淌雨滴纹理由法线贴图(RG)、mask(B)、time offset(A)组成

映射到世界空间

  • 为了应对物体从局部空间变化到世界空间的状况,需要将纹理映射到世界空间,这样无论物体进行任何矩阵运算,雨滴的流淌总是正确的

  • 使用世界空间的位置作为采样的纹理坐标,只需提取RB

    这里的Multiply()是为了正确的比例,乘以的value越小,采样得到的图像越大;value越大,采样得到的图像越小

    为什么还有负号呢?因为这样可以对采样方向取负
    UE5 材质 雨滴shader

  • 采样侧面

    这里改变正负号是为了让物体的侧面和正面不再相同
    UE5 材质 雨滴shader

  • 混合正侧面

    采样两次纹理进行合并是很简单的,但只采样一次又该如何实现呢?

    在这里采用世界空间的法线作为物体面的判断基准
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

制作动画的mask纹理

它的rgb通道都是相同的,a通道没有使用

UE5 材质 雨滴shader

实现流淌雨滴

  • 将mask纹理映射至世界空间

    下图中,可以将白色部分视为雨滴,基于这个实现动画即可
    UE5 材质 雨滴shader

  • 初步雨滴动画

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 控制雨滴速度

    雨滴在不同物体上的滑落速度是不一样的,因此我们还需要让这些雨滴的速度有所差异

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 雨滴法线
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 将雨滴效果控制在物体侧面

    3.5用于控制正方向的白色范围,-1,5用于控制负方向的白色范围
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

雨滴涟漪(Rain Ripple)效果

本节将展示如何实现雨滴打到水面产生的波纹效果

纹理

  • 动画mask纹理(渐变纹理)

    用该纹理可以实现圆从无到有,从小到大,最后渐渐消散
    UE5 材质 雨滴shader

  • 法线纹理
    该纹理的R通道是动画mask纹理,GB通道是法线信息

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 多个涟漪纹理

    alpha通道包含time offset
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

波纹效果

  • 实现纹理动画都需要Time节点。很容易实现以下内容
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 控制波纹边缘的锐度(让波纹边缘不再是渐变色)
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 初步实现波纹

    因为水波纹属于正弦函数,因此在这里我们使用一个sin,并让他在一个周期内产生五个波纹(因为UE5的sin函数默认周期为1)
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 标准的sin函数

    UE5中的sin函数并不是标准的sin函数(一个周期为2Π),它的默认周期为1,因此我们需要将其改为6.283185
    UE5 材质 雨滴shader

  • 放大淡出效果

    目前我们实现的效果是到最大然后消失,但我们希望的是放大淡出。目前的效果是因为能量是从0到1,而放大淡出的效果应该是从1到0

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

法线

UE5 材质 雨滴shader

UE5 材质 雨滴shader

多个涟漪

  • 为每个涟漪赋予单独的Time
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

多个涟漪相互叠加

  • 目前的效果只是在固定位置不同时间段产生波纹,但没有展现波纹的叠加效果

  • 首先,我们需要对"1-x"进行修改,添加力的因素

    • "Multiply 0.8"是因为需要考虑力的因素,让涟漪的初始能量不为1
    • "Add 0.2"是因为需要考虑雨滴重量不能为0的情况

    UE5 材质 雨滴shader

  • 涟漪的叠加

    总体思路是使用四个不同的涟漪效果——不同的时间,不同的涟漪强度,对采样结果进行叠加

    • 求取四个不同的时间

      UE5 材质 雨滴shader

    • 求取四个不同的uv

      UE5 材质 雨滴shader

    • 求取四个不同的雨滴重量
      UE5 材质 雨滴shader

    • normal混合
      UE5 材质 雨滴shader

最终效果

UE5 材质 雨滴shader

水坑(Rain Puddle)效果

纹理

  • 扭曲纹理,
    对于扭曲纹理,我们将该纹理设置为"Linear Color"且无"sRGB",因为它只包含灰度值。第二张中,我们把该图的黑色部分视为水坑,部分有水坑部分没有符合现实常理(后面处理会进行"1-x"运算,将白色部分看成水坑)

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

映射至世界空间

  • 初步映射
    UE5 材质 雨滴shader

  • 控制水坑大小

    这是一个灰度图,通过做减法即可放大水坑,但这里采用一种更加灵活的方式——lerp
    UE5 材质 雨滴shader

  • 控制水坑位置

    让上图可以看到水坑的纹理延申到了其他面,但正常来说应该只有上面才会出现水坑,因此需要想办法让水坑只出现在物体上面
    UE5 材质 雨滴shader

  • 确保水坑只有白色
    UE5 材质 雨滴shader
    从上图可以得知,有些部分是灰色的。因此我们需要再"Multiply"确保只存在白色和黑色
    UE5 材质 雨滴shader

normal

  • 水坑的涟漪不仅仅在水滴落下时会产生,当被风吹时也会产生。水滴落下的效果在之前已经实现了,对于风吹的涟漪我们采用UE5提供的纹理
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • UE5 材质 雨滴shader

    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

  • 控制涟漪位置
    本小节的实现是水坑,那肯定是在水坑处产生涟漪啊!
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

融合所有效果

  • 将以上所有效果融合即可实现一个完整的雨天shader
  • 你可能不是很清楚,这里的mask究竟代表什么含义。仔细观察下图,不难发现mask其实就是我们所实现的效果
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader
    UE5 材质 雨滴shader

normal 混合

混合表面水珠normal 和流淌雨滴normal

UE5 材质 雨滴shader

  • 采用Rain Drip作为alpha的原因:假定我们只考虑alpha为1/0的情况,若alpha为1,我们希望只有RainDrip效果没有RainDrop,以Lerp效果来说确实如此;若alpha为0,我们希望只有RainDrop效果没有RainDrop,从Lerp效果来说确实如此。但若以RainDrop作为alpha则不符合我们的条件

混合外部normal

  • 因为目前这两个normal只是内部实现的material function的normal,还需要与欲使用的材质的normal进行blend
    UE5 材质 雨滴shader

水坑

UE5 材质 雨滴shader

湿度控制

  • max():因为这三个效果是各自独立的材质函数,如果分开运算会使得这三效果不一致,我们需要求得以这三之一的max以达到最好且一致的效果

UE5 材质 雨滴shader

吸水性

UE5 材质 雨滴shader

reference

Rustling Leaves Shader - UE4 Materials 101 - Episode 12 - YouTube文章来源地址https://www.toymoban.com/news/detail-482184.html

到了这里,关于UE5 材质 雨滴shader的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • UE5 半透明覆层材质

    本文采用虚幻5.2.1版本演示,介绍半透明覆层材质(覆层材质)。 半透明覆层材质是 UE5.1 版本 更新的功能,使用半透明覆层材质,可以轻松的给物体表面附着一层材质。 在UE5.1以上版本可以为静态和骨骼网格体分配辅助覆层材质。你可以将其用于实现特定视觉效果,而不需

    2024年02月14日
    浏览(96)
  • 【UE 材质】物体在缩放时材质不变形

    1. 新建一个材质,在材质图表中,添加一个纹理节点 将其转换为纹理对象 继续添加如下节点 2. 将材质赋予给一个网格体 当我们缩放该网格体时效果如开头所示。

    2024年01月25日
    浏览(32)
  • 【UE5】给模型指定面添加自定义材质

    1. 首先我们向UE中导入一个简单的模型,可以看到目前该模型的材质插槽只有一个,当我们修改材质时会使得模型整体的材质全部改变,如果我们只想改变模型的某些面的材质就需要继续做后续操作。 2.  选择建模模式 3. 在模式工具栏中点击材质编辑按钮“MatEd” 4. 在视口中

    2024年02月11日
    浏览(33)
  • UE5中双pass解决半透明材质乱序问题

    透明度材质乱序问题一直是半透明效果时遇到的比较多的问题,用多pass方案只能说一定程度上解决,当遇到多半透明物体穿插等情况时,仍然不能完美解决。 双pass方案Unity用的比较多,因为Unity支持多个pass绘制。在UE中我们可以以复制多个物体赋予不同材质球的方式模拟多

    2024年02月07日
    浏览(34)
  • 【虚幻引擎】UE4/UE5鼠标点击事件实现物体移动

     在UE4/UE5中,引擎有它自己的一套框架体系,虚幻就是基于这一个框架体系来实现的。其中就有PlayerController(玩家控制器),玩家控制器中就有对鼠标的一系列设置,包括显示鼠标,允许点击事件等。  1.创建PlayerController,命名为MyPlayerController 2.打开MyPlayerController,勾选参数

    2024年02月10日
    浏览(55)
  • 实现草地Shader的物体互动效果

    我跟着教程:https://zhuanlan.zhihu.com/p/433385999 用Unity Shader实现了草地效果。 接下来我分享一下我在这篇文章的基础上实现简单的草地互动效果的经验。 如果需要实现互动效果,需要实现脚本向shader的传递参数。 脚本使用下面的代码: 在场景中创建一个胶囊体,挂上这个脚本。

    2024年02月07日
    浏览(31)
  • 【UE5 C++】鼠标点击发射射线获取物体信息

    UE小白,有错误的地方请指出。 本文使用UE5,如在UE4中使用可能需调整某些API 1.获取镜头控制器,并开启点击事件 2.鼠标点击发射射线 在Tick中调用射线发射逻辑 UE中API看起来没有分鼠标抬起和鼠标按下API,如有大佬知道可以评论一下。 1.获取镜头控制器,并开启点击事件

    2024年02月15日
    浏览(48)
  • UE5 物体高速移动产生拖影(运动残影)

    给一个物体加上一个location的变化,当这个值达到一定大小时,运动会产生残影 速度较小时则不会,或者说不那么明显 这个是因为UE5的抗锯齿采样方法方法改成了 TSR- Temporal Super Resolution 该方法主要是将低分辨率游戏画面扩展至高分辨率,类似英伟达的DLSS,减轻显卡压力从而

    2024年02月11日
    浏览(69)
  • 记录--如何实现一个雨滴滑落效果

    下雨天坐在车窗前,看着雨滴顺着车窗渐渐落下,这一唯美的场景,忍不住想记录下来。最近在纠结电脑壁纸时,无意间看到有类似的场景,可以将自己喜欢的壁纸加上这种效果。作为多年切图仔,不由地想到了用css动画应该可以实现这一效果,于是,直接开干。先上效果图

    2024年02月19日
    浏览(29)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包