type
status
date
slug
summary
tags
category
icon
password
📝 效果展示

📝 实现原理
从效果图中可以看出,其核心部分仍然是遮罩纹理,以及噪声图的运用,唯一的难点是如何制作出“光边”的溶解边界
关于遮罩纹理和简单溶解的Shader制作,可以参考我的主页里另外几篇文章
第一部分 遮罩效果
第一部分是遮罩效果的实现,这部分理论可以直接在【遮罩纹理的简单实现】中查看
Shader节点如下:

第二部分 光边提取
第二部分是光边的提取:

基本思路是,使用两个Step得到的黑白色阶图相减,得到差分部分,也就是光边;
其中第二个黑白色阶图在Step前,要在噪声图的通道基础上增加一个设定值(EdgeWidth),相当于提高了这部分的通道强度,这样接下来使用Substact做减法时就能得到一个不为0的差值了(即两张黑白色阶图的像素亮度的差值),Subtract节点得到的纹理图就是我们需要的光边 (当然目前只是得到了光边的透明度信息)
第三部分 给光边上色
这部分即数字图像处理中像素乘法,将黑白色阶图乘以一个颜色矢量,就能得到有颜色的光边了:

第四部分 将光边与原始纹理插值混合
为了使光边效果更加自然,我们希望光边的像素能与原始纹理的像素进行插值混合

插值的方式是Alpha,在本例中就是使用光边的Alpha值进行Lerp插值,关于Lerp()节点的说明可以参考下图:

意即当光边的透明度为1的地方,就输入节点B,也就是光边的颜色值;相反,如果光边透明度为0的地方,就输入节点A,也就是原始纹理的像素值;
第五部分 输出渲染结果
输出结果无非就是像素值,包括RGB颜色值和A透明度
RGB值,即上一步插值混合得到的纹理图;
A值,在这里不是原始纹理的透明度,而是噪声图在溶解时的实时透明度信息(因为我们要做的是溶解效果,溶解掉就会变透明),方法是使用Multiply节点对透明度值相乘

然后使用Mask节点和Append节点将RGB和A通道合并后输出:

第六部分 美术效果优化
我们可以给光边的颜色值开启HDR选项,这样可以得到范围更丰富的颜色变化效果
同时,我们可以在Unity中安装Post Processing后处理模块,给最终渲染画面添加一层滤镜,使光边效果看起来更逼真
📎 参考文章
- 作者:Damier
- 链接:https://notion-next-coral-eta.vercel.app/article/2e970403-73ea-4063-a9a7-b038876b678d
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议,转载请注明出处。