1. 项目概述从“调参”到“造浪”的思维跃迁每次看到《绝地求生》里那片随着时间缓缓起伏、波光粼粼的海面你是不是也和我一样第一反应是去网上找个现成的Shader然后一头扎进材质面板里对着十几个滑块疯狂调试试图“蒙”出那个感觉我曾经也这么干过结果往往是调了半天水面要么像果冻一样僵硬要么像沸腾的开水一样诡异离“以假乱真”差了十万八千里。后来我意识到问题不在于参数本身而在于我们根本不知道这些参数背后连接的是什么它们如何相互作用最终驱动了那片虚拟的海洋。这就是今天我想和你聊的核心别再只会当个“参数调试员”了。我们要用Unity的ShaderGraph从最底层的原理出发亲手“搭建”出那片海。这个过程本质上是在用节点“编程”水的行为逻辑。我将为你拆解实现“吃鸡”级海面效果的五个最关键的ShaderGraph节点它们就像搭建乐高积木的五个核心零件。掌握了它们你不仅能复刻出这个效果更能举一反三创造出任何你想象中的水面——无论是宁静的湖泊、湍急的河流还是风暴中的怒涛。这篇文章适合所有对Shader感兴趣但又被代码吓退的Unity开发者我们将完全在可视化界面中完成这场造浪之旅。2. 核心思路拆解如何用节点“模拟”一片海在动手连接节点之前我们必须先想清楚一片看起来“真实”的海面在Shader里究竟是由哪些视觉元素构成的。这决定了我们整个节点网络的架构方向。2.1 视觉元素分解海面不止是蓝色首先我们得抛弃“一个颜色贴图走天下”的简单思维。一片生动的海面是多种视觉信息叠加的结果基础颜色与深度近处的海水清澈透亮颜色较浅远处的海水深邃呈现出更浓郁的蓝色甚至墨绿色。这不仅仅是颜色变化还包含了光线在水体中散射和吸收的物理现象。波浪起伏顶点动画海面不是平的它由无数大小、方向、速度各异的波浪叠加而成。这是让海面“活”起来的第一步需要通过动态地改变模型顶点的位置来实现。表面细节法线即使是一个平滑的波浪曲面在微观上也是粗糙不平的有细碎的波纹、涟漪和泡沫。这些细节决定了光线如何反射是产生“波光粼粼”质感的关键通常由法线贴图来表现。高光与反射阳光或月光照射在海面上会形成明亮的高光点Specular和周围环境的反射Reflection。高光的形状、强度和锐利度直接传达了海面的“粗糙度”或“风速”信息。菲涅尔效应这是一个关键的物理现象——视线与表面法线夹角越小即掠射角观察水面反射越强夹角越大垂直向下看越容易看到水下的折射内容。这解释了为什么我们总是看到海天交界处有一条亮线而脚边的海水则相对透明。2.2 节点化实现路径基于以上分解我们的ShaderGraph构建路径就清晰了顶点动画层使用Time和Position节点驱动数学运算生成波浪的位移信息。表面细节层使用Texture 2D Asset和Tiling Offset节点采样并动态滚动法线贴图模拟细碎波纹。视觉融合层使用Normal Blend等节点将多层细节如基础波浪和细节涟漪平滑地混合在一起。光学响应层使用Fresnel Effect节点和PBR Master节点的输入如Smoothness来模拟海面对光线的复杂反应。整个思路就是从“驱动顶点运动”开始逐步叠加“表面细节”最后赋予其“正确的光学属性”。下面我们就深入这五个决定成败的关键节点。3. 五大关键节点深度解析与实战连接这五个节点是构建海面Shader的骨架理解它们每一个的作用和连接逻辑比记住一百个参数组合更有用。3.1 发动机Time节点——让一切动起来为什么是它静态的海面是死海。所有动态效果——波浪的起伏、波纹的流动、光斑的移动——都依赖于一个持续变化的时间信号。Time节点就是ShaderGraph里的时钟它输出一个随着游戏时间不断增大的浮点数默认是自场景加载以来的秒数。关键操作与原理仅仅输出时间值还不够我们需要用它来驱动周期性的运动比如正弦波。这里就会引入一个经典组合Time-Multiply乘以一个控制速度的系数-Sine正弦函数。Multiply的作用乘以一个系数比如0.5本质是控制频率。系数越大正弦波振荡越快波浪就显得更“急促”或“细密”。Sine的作用将线性增长的时间转换为在[-1, 1]之间平滑、周期性振荡的值。这个振荡值可以直接用来偏移顶点的Y坐标形成基础的波浪形状。实操心得直接使用Time节点的输出变化会非常快。我通常会先连接一个Multiply节点乘以一个0.1到1之间的小数例如0.3得到一个“慢速时间”再用这个慢速时间去驱动主要波浪这样动画会更自然易于控制。对于需要不同速度的次级波纹则可以使用另一个乘以不同系数如0.7的“快速时间”分支。3.2 空间坐标读取器Position节点——知道“我在哪”为什么是它波浪不可能在所有位置都一样高。我们需要根据顶点在世界空间或物体空间中的水平位置X和Z坐标来计算其应有的高度Y坐标偏移。Position节点提供了顶点的位置信息。关键操作与原理默认的Position节点输出是一个三维向量 (X, Y, Z)。对于海面我们通常关心的是水平面即X和Z分量。拆分与重组使用Split节点将Position的XYZ分开取出X和Z。然后我们可能会用经过Time驱动的数学函数如Sine去处理X和Z得到两个方向的偏移量再用Combine节点将新的Y值原始Y偏移量与X、Z重新组合成一个新的三维向量。空间选择Position节点有World、Object、View等空间选项。对于海面这种可能移动的物体比如一艘船上的海面使用Object空间位置来计算波浪可以保证波浪形状跟随物体移动更合理。如果是无限大的远景海面使用World空间则更简单。一个基础波浪的节点链示例Position (Object Space) - Split - (取出X) \ Time - Multiply(Speed) - Add - Sine - Multiply(Amplitude) - Combine (作为新的Y) / Position (Object Space) - Split - (取出Z) - Multiply(WaveDirection) - Add这个流程的意思是用Time经过速度缩放后加上由位置X和Z按一定方向混合的值作为正弦函数的输入从而得到一个随时间和空间位置变化的波浪高度。3.3 纹理动画控制器Tiling And Offset节点——制造流动的细节为什么是它单靠顶点动画生成的波浪往往过于规则和光滑缺乏真实海面那种复杂的、多尺度的细节。这时就需要法线贴图。但一张静态的法线贴图贴上去还是死的我们需要让贴图上的波纹“流动”起来模拟风驱动力作用下水面的运动。Tiling And Offset节点的Offset输入端口正是实现纹理滚动的关键。关键操作与原理这个节点有两个主要输入Tiling缩放和Offset偏移。Tiling控制纹理的重复度。值越大同一区域内重复的纹理次数越多意味着波纹越细密。对于海面我们可能需要两层不同尺度的法线贴图一层Tiling较大模拟大的波浪走向一层Tiling很大模拟细碎的涟漪。Offset这是一个二维向量输入代表纹理在UV空间内的偏移量。核心技巧来了我们将一个由Time驱动的二维向量例如(Time * Speed, 0)连接到Offset纹理就会沿着U方向水平持续滚动。如果向量是(Time * Speed1, Time * Speed2)纹理就会沿对角线方向滚动。实现双层流动细节为了打破单调性几乎所有的海面Shader都会使用至少两层法线贴图。第一层主波纹使用一张方向性较强的法线贴图Tiling较小如0.05Offset速度较慢模拟主要波浪的走向和光影。第二层细节涟漪使用另一张或同一张法线贴图Tiling较大如0.15Offset速度较快且方向与第一层略有不同例如一个向左一个向右上。这能叠加出非常丰富的细节避免出现明显的重复图案。3.4 细节混合器Normal Strength 与 Normal Blend节点——合成真实质感为什么是它们当我们有了两层或更多滚动的法线贴图后不能简单地把它们叠加在一起那样会导致信息混乱。我们需要有控制地混合它们。Normal Strength节点这个节点经常被忽略但它至关重要。它允许我们在混合前单独调整某一张法线贴图的“强度”或“影响力”。输入一个法线向量来自Sample Texture 2D一个强度系数Float。作用当强度系数为1时输出原法线大于1时增强法线细节使凹凸感更强在0到1之间时减弱细节为0时相当于一个平坦的蓝色法线(0,0,1)。实战应用我们可以为“主波纹”和“细节涟漪”分别设置不同的Normal Strength。比如让主波纹强度为0.8细节涟漪强度为0.4。这样细节层就不会喧宾夺主而是在主波纹的基础上增加一些微妙的扰动。Normal Blend节点这是将多张法线贴图安全、正确混合的标准节点。它采用一种特殊的算法能避免直接加法混合导致的向量长度变化即法线信息失真。操作它有两个输入口Base基础法线和Blend混合法线。我们将调整好强度的主波纹法线连入Base将细节涟漪法线连入Blend。输出就是一个融合了两者信息的、新的法线向量。进阶技巧你可以进行多次混合。例如Normal Blend的输出可以作为新的Base再与第三层泡沫或特殊效果的法线进行第二次Normal Blend。避坑指南千万不要用普通的Add或Lerp节点去混合法线法线是归一化向量长度为1直接相加会破坏其长度导致光照计算错误出现奇怪的黑斑或过度明亮区域。Normal Blend节点是为此场景量身定做的。3.5 光学特性塑造器Fresnel Effect节点——模拟水岸交界为什么是它这是实现“海水为什么越远越亮越近越透”这一视觉特性的物理钥匙。菲涅尔效应描述了反射率随观察角度变化的规律。关键操作与原理在ShaderGraph中Fresnel Effect节点根据表面法线Normal和观察方向View Direction计算出一个渐变系数。这个系数在视线与表面平行时掠射角接近1在垂直时接近0。连接将我们混合好的最终法线向量连接到Normal输入口View Direction通常使用默认的摄像机视图方向。输出应用这个0到1之间的系数有两个最主要的用途控制颜色混合创建一个Lerp线性插值节点。将深水颜色连到A浅水或高光颜色连到B将Fresnel的输出连到T。这样在视线掠射的海平面远处将显示更多的B亮色在垂直视角的近处显示更多的A深色。控制反射/高光强度可以将Fresnel输出连接到PBR Master节点的Smoothness或Environment Reflections的强度上让边缘的反射更强。参数调整 节点上的Power参数控制着菲涅尔效应的过渡锐利度。Power值越小过渡越平缓、范围越大值越大过渡越尖锐亮暗分界线越明显。对于海面一个中等偏大的Power值如3-5可以模拟出比较清晰的水天线效果。4. 完整节点网络搭建与参数调试实录理解了核心节点后让我们把它们像拼图一样组装起来并看看每个旋钮该怎么调。4.1 节点网络架构图文字描述版由于无法使用图表我用层级结构描述整个网络的数据流时间与空间输入层Time节点输出经过两个不同的Multiply节点生成SlowTime系数~0.3和FastTime系数~0.7。Position节点Object Space提供顶点原始坐标。顶点位移生成层使用SlowTime和Position的XZ分量通过一系列Add、Multiply、Sine运算生成一个低频、大振幅的波浪高度偏移量WaveOffsetA。用同样的逻辑但使用不同的方向和频率参数生成另一个波浪高度偏移量WaveOffsetB。将WaveOffsetA和WaveOffsetB用Add节点相加得到总的顶点Y轴偏移。再与原始的X、Z通过Combine节点组合输出到PBR Master的Vertex Position端口。法线细节生成层主波纹法线Texture 2D Asset法线贴图 -Sample Texture 2D。其UV输入来自UV节点 -Tiling And OffsetTiling0.05, Offset(SlowTime*0.1, 0)-Normal StrengthStrength0.8。细节涟漪法线同一张或另一张Texture 2D Asset-Sample Texture 2D。其UV输入来自UV节点 -Tiling And OffsetTiling0.15, Offset(FastTime0.2, FastTime0.1)-Normal StrengthStrength0.4。法线混合Normal Blend节点将主波纹法线连入Base细节涟漪法线连入Blend。输出为Final Normal。颜色与光学计算层Fresnel Effect节点输入Final Normal和默认View DirectionPower设为4。Color节点创建深蓝色DeepColor如#006994FF和浅蓝绿色ShallowColor如#00FFE5FF。Lerp节点A连DeepColorB连ShallowColorT连Fresnel Effect输出。结果输出到PBR Master的Albedo。Final Normal输出到PBR Master的Normal。一个Vector1节点设为公开参数Smoothness默认值0.9输出到PBR Master的Smoothness。你也可以用Fresnel输出来进一步调制Smoothness增加边缘反射。4.2 关键参数调试心法参数没有绝对的正确值只有适合你场景的“感觉”。以下是调试顺序和逻辑先调“形”再调“色”首先关闭颜色和法线贴图只保留顶点动画。调整波浪的Speed频率和Amplitude振幅直到得到一个你觉得自然的基础起伏节奏。太大像海啸太小像水塘。法线贴图强度打开法线贴图先将Normal Strength都设为0然后慢慢调高。主波纹的强度如0.5-0.8决定了波浪的“形体感”细节涟漪的强度如0.2-0.4决定了表面的“粗糙度”。两者强度差不宜过小否则层次不清。Tiling与Offset速度Tiling决定波纹的尺度。远景海面主波纹Tiling要小如0.02-0.05近景或特写可以大一些。Offset的速度要与顶点动画的Speed相匹配。通常纹理滚动的视觉速度应略慢于或等于顶点起伏的速度否则会产生“滑移”的失真感。菲涅尔与颜色调整Fresnel的Power改变深水区与浅水区亮部的过渡范围。然后调整Lerp两端的颜色。DeepColor影响海水主体的颜色ShallowColor影响边缘高光和水面反光的色调。晴天用明亮的蓝绿色阴天用灰蓝色。光滑度与金属度海水的Metallic通常为0非金属Smoothness较高0.85-0.95。提高Smoothness能增强镜面反射高光的锐利度和环境反射的清晰度。你可以尝试将Fresnel输出连接到Smoothness实现“边缘更光滑中心更粗糙”的物理效果。4.3 性能优化小贴士贴图尺寸用于海面的法线贴图512x512分辨率通常足够甚至可以尝试256x256。因为Tiling通常很小贴图会被拉伸高分辨率收益不大。节点简化复杂的数学运算如多个Sine、Fraction会带来性能成本。在满足效果的前提下尽量简化顶点位移部分的计算。有时用一张高度图Height Map驱动顶点位移性能可能更好。LOD支持为海面材质配置多级LODLevel of Detail。在远处可以使用更简单的Shader变体例如减少一层法线混合甚至关闭顶点动画只用纹理动画。5. 常见问题排查与效果进阶即使按照步骤搭建也可能会遇到一些奇怪的问题。这里记录了几个我踩过的坑和对应的解决方案。5.1 水面闪烁或抖动Z-fighting现象海面与海底或其他物体交界处出现闪烁的像素。原因海面网格与海底网格在深度Z值上过于接近深度缓冲精度不足以区分谁在前谁在后。解决方案轻微抬高海面在顶点着色器中将海面整体向上Y轴偏移一个微小值如0.001单位。可以在顶点位移计算完成后在最终的Y值上加一个很小的常数。调整渲染队列确保海面材质的渲染队列Render Queue在透明物体之前但在不透明物体之后。通常设置为Geometry1即2501。使用深度偏移在ShaderGraph的PBR Master节点或材质的Inspector面板中调整Depth Offset参数。这是一个非常有效的解决方案。5.2 波浪边缘出现锯齿Aliasing现象波浪的轮廓特别是由顶点动画形成的尖锐波峰在移动时出现闪烁的锯齿。原因顶点位移幅度过大导致三角形在屏幕空间的变化速率超过采样频率。解决方案开启抗锯齿在项目质量设置或摄像机中确保MSAA或后处理抗锯齿如SMAA、FXAA是开启的。柔化波浪降低顶点动画的振幅或者让波浪形状更平滑例如使用Sine函数而不是更尖锐的函数。增加曲面细分如果使用支持曲面细分Tessellation的渲染管线如HDRP可以通过增加网格细分程度来提供更多的顶点细节从而平滑波浪曲线。但这会显著增加性能开销。5.3 法线贴图接缝明显现象流动的法线贴图在UV边界通常是0和1的位置出现明显的、不连续的接缝。原因法线贴图没有设置为Wrap模式或者Tiling不是整数导致边缘颜色对不上。解决方案检查导入设置在Unity Project面板中选中法线贴图在Inspector中确保Wrap Mode设置为Repeat重复而不是Clamp钳制。使用无缝贴图确保你使用的法线贴图本身是“无缝”的即它的左右边缘、上下边缘可以完美拼接。很多在线工具可以制作无缝纹理。节点技巧在ShaderGraph中可以在UV进入Tiling And Offset之前先经过一个Fraction节点确保UV值始终在[0, 1)范围内避免因浮点数精度问题导致的接缝。5.4 效果进阶增加泡沫与焦散一个顶级的海面还需要泡沫和海底焦散Caustics效果。泡沫可以基于波浪的“陡度”生成。在Shader中计算顶点位移后相邻顶点的斜率或高度差当差值超过某个阈值时使用一张泡沫贴图进行混合。简单实现可以采样一张泡沫噪声图用波浪的Y方向导数通过DDX/DDY节点近似来驱动其显示。焦散这是光线透过水面在海底形成的光影图案。实现方法是在海底或水下物体的材质上投影一张动态的、扭曲的焦散贴图。贴图的UV偏移可以用与海面顶点动画相似的Time和Sine函数驱动但速度更慢以模拟光线的缓慢移动。掌握了这五个核心节点和背后的原理你就从被参数支配的“调试者”变成了创造视觉规律的“设计师”。下一次当你想实现某种特定的水面效果时不妨先停下来思考我需要驱动哪些属性用什么节点来生成这种变化如何混合多层信息这个过程本身就是Shader艺术最迷人的地方。