雾气流动效果

雾气流动效果

章鱼烟雾

主要想模拟

  • 幽灵

  • 灵魂

  • 召唤烟雾

  • 角色能量体

这是一个角色特效。特效同学用粒子做烟雾会穿模型,试了用软粒子效果也不好,尤其特定角度旋转就会穿帮。

所以我从shader入手实现这个效果。

先在3DMax中将这个蒙皮mesh复制一份,然后用上这个新shader专门渲染雾气。

核心技术结构

这个Shader由 4 个关键系统组成:

  1. Shell壳层外扩

  2. 顶点噪声位移

  3. 三层流动噪声混合

  4. 溶解 + Fresnel增强

顶点阶段

1️⃣ Shell 外扩结构

v.positionOS.xyz + v.normalOS * _ShellOffset

作用:

  • 沿法线方向膨胀模型

  • 形成“外壳”

  • 让烟漂浮在物体外表面

这是一种经典的:

Shell Rendering 技术

常用于:

  • 毛发

  • 能量罩

  • 幽灵外壳

2️⃣ 噪声驱动位移

 

float2 dUV = posWS.xz * _DisplaceScale + _Time.y * 0.2;
float displaceNoise = SAMPLE_TEXTURE2D_LOD(...).r;
displaceNoise = displaceNoise * 2 - 1;

特点

  • 使用世界坐标作为UV

  • 时间驱动

  • remap到 [-1,1]

  • 控制位移强度

最终:

finalOffset = _ShellOffset + displaceNoise * _DisplaceStrength;

效果:

  • 壳层不是均匀膨胀

  • 表面起伏

  • 有呼吸感

片元阶段

1️⃣ 世界空间UV流动

worldUV = float2(i.worldPos.x, i.worldPos.y) * _NoiseScale;

WorldPos做UV  烟雾在世界空间流动,就不用管原始UV了

2️⃣ 三层噪声叠加

n1 = NoiseA (主流动)
n2 = NoiseB (反向流动)
n3 = NoiseC (低频扰动)

混合方式:

smoke = n1 * n2 + n3 * 0.5;

数学意义

噪声 作用
n1 主结构
n2 破坏规则性
n3 增加层次感

 

乘法 → 产生“块状体积感”

加法 → 细节增强

这是标准的程序化烟雾结构。

3️⃣ 动态溶解系统

threshold = _DissolveBase + sin(time * 2) * 0.05;
dissolve = smoothstep(threshold, threshold + _EdgeWidth, smoke);

特点:

  • threshold随时间震荡

  • 产生“翻滚边缘”

  • 类似燃烧边界

这是动态阈值溶解,而不是静态cutoff。

4️⃣ Fresnel增强

fresnel = pow(saturate(dot(normalWS, viewDirWS)), _FresnelPower);

作用:

  • 边缘增强

  • 灵体发光边

  • 增加空间感

5️⃣ 最终Alpha

alpha = dissolve * (0.5 + fresnel) * n1 * n2 * n3;

结构分析:

因子 作用
dissolve 控制存在区域
fresnel 边缘增强
n1n2n3 体积噪声

最终:

return float4(col, alpha * mask * _Value);
外壳层
  + 顶点噪声起伏
      + 三层流动烟
          + 动态溶解边界
              + Fresnel增强
                  + 加法混合

在移动端:

  • 5采样略高

  • 但无光照

  • 无Shadow

  • 无复杂分支

属于中等特效成本。

可优化的部分:

合并Noise贴图

可以把:

  • NoiseA/B/C打包到一张RGB,减少采样次数 → 3 → 1

这个Shader本质是:

Shell + Vertex Noise + Multi-layer Flow Noise + Dynamic Dissolve + Fresnel + Additive

未来拓展方向

可以升级为:

  • 深度淡出(Soft Particle)

  • 基于深度的体积衰减

  • 视差烟雾

  • 屏幕空间扰动

  • GPU Instancing支持

    章鱼烟雾1

© 版权声明
THE END
喜欢就支持一下吧
点赞7 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容