【Unity3D Shader】学习笔记-消融效果

简介: 前言 消融效果一般用于怪物的死亡表现,主要原理通过随时间修改消融的阈值,丢弃小于阈值的颜色实现消融(也可以通过alpha设为0)。一、简单消融效果图2 面版参数 简单的消融效果,Threshold的值是随时间从0-1进行变化。对扰动图采样取r值,通过比较Threshold与R值的大小来进行消融。Noise图可以控制消融的形状,代码如下。

【Unity3D Shader】学习笔记-消融效果


前言


   消融效果一般用于怪物的死亡表现,主要原理通过随时间修改消融的阈值,丢弃小于阈值的颜色实现消融(也可以通过alpha设为0)。

  [声明:本笔记系列文章的图片资源都源自百度图片搜索,如有问题联系我]

一、简单消融效果


微信图片_20220424154714.gif

图1 消融效果


微信图片_20220424154718.png

图2 面版参数


   简单的消融效果,Threshold的值是随时间从0-1进行变化。对扰动图采样取r值,通过比较Threshold与R值的大小来进行消融。Noise图可以控制消融的形状,代码如下。


fixed4 col = tex2D(_MainTex, i.uv);
float value = tex2D(_DissolveTex, i.uv).r;
// 扰动采样的值r小于外部动态修改的阈值就丢弃,实现消融
if(value <= _DissolveThreshold) 
{
    discard;
}
return col;


二、消融增加边界区颜色


微信图片_20220424154723.gif    

图3 消融边界区域颜色


微信图片_20220424154726.png

图4 面版增加边界颜色和阈值


消融增加边界区颜色,当采样的R值小于消融阈值*边界区域阈值,混合边界颜色形成消融过渡。


fixed4 col = tex2D(_MainTex, i.uv);
float value = tex2D(_DissolveTex, i.uv).r;
// 扰动采样的值r小于外部动态修改的阈值就丢弃,实现消融
if(value <= _DissolveThreshold)
{
    discard;
}
// 消融的阈值乘以边界的范围实现边界染色
if(value <= _DissolveThreshold*_EdgeThreshold)
{
    col.rgb *= _EdgeColor.rgb; //这里直接赋值效果也很好
}
return col;


三、消融带定向飘散效果


微信图片_20220424154731.gif

图5 定向飘散


微信图片_20220424154735.png


   在顶点着色器中对模型顶点进行位移来实现飘的效果,通过消融阈值和方向来控制飘的方向等参数。


// 顶点着色器中对坐标进行偏移w控制从什么时候开始位移,_WaveParams.xyz控制方向
v.vertex.xyz += saturate(_DissolveThreshold - _WaveParams.w) * _WaveParams.xyz;


四、后记


   本篇中的代码全部使用了if判断,需要优化掉,边界区域可以添加多个来提升过渡效果。当然整体效果还是比较一般,跟大神的差距还是很大的。


网络异常,图片无法展示
|

图7 twitter@Ed_dv做的消融效果

相关文章
|
10天前
|
图形学
【实现100个unity特效】shader实现3D物品闪光和描边效果
【实现100个unity特效】shader实现3D物品闪光和描边效果
11 0
|
10天前
|
开发工具 图形学
【推荐100个unity插件之11】Shader实现UGUI的特效——UIEffect为 Unity UI 提供视觉效果组件
【推荐100个unity插件之11】Shader实现UGUI的特效——UIEffect为 Unity UI 提供视觉效果组件
12 0
|
10天前
|
图形学
【实现100个unity特效之2】使用shader和shader Graph实现2d图片描边效果(附源码)
【实现100个unity特效之2】使用shader和shader Graph实现2d图片描边效果(附源码)
9 0
|
10天前
|
图形学 开发者
【实现100个unity特效之1】使用Shader Graph实现动物森友会的世界弯曲效果(带源码)
【实现100个unity特效之1】使用Shader Graph实现动物森友会的世界弯曲效果(带源码)
15 0
|
2月前
|
图形学 异构计算
【Unity Shader 中Pass相关介绍_第四篇】
【Unity Shader 中Pass相关介绍_第四篇】
|
2月前
|
缓存 图形学 异构计算
【#Unity Shader#Amplify Shader Editor(ASE)_第二篇】
【#Unity Shader#Amplify Shader Editor(ASE)_第二篇】
|
2月前
|
图形学
【Unity Shader#自定义材质面板_第一篇】
【Unity Shader#自定义材质面板_第一篇】
|
10天前
|
图形学
【制作100个unity游戏之28】花半天时间用unity复刻童年4399经典小游戏《黄金矿工》(附带项目源码)
【制作100个unity游戏之28】花半天时间用unity复刻童年4399经典小游戏《黄金矿工》(附带项目源码)
24 0
|
10天前
|
存储 JSON 关系型数据库
【unity实战】制作unity数据保存和加载系统——大型游戏存储的最优解
【unity实战】制作unity数据保存和加载系统——大型游戏存储的最优解
18 2
|
10天前
|
图形学
【制作100个unity游戏之29】使用unity复刻经典游戏《愤怒的小鸟》(完结,附带项目源码)(上)
【制作100个unity游戏之29】使用unity复刻经典游戏《愤怒的小鸟》(完结,附带项目源码)
19 2