三亩地 三亩地SAN MU DI · CODE DIARY
交流投稿
ARTICLE DETAIL

日记详情

真实记录编程学习的某一天，欢迎挑你感兴趣的翻一翻。

首页/学习日记/日记详情

UE5材质入门：从Photoshop图层思维到材质节点四则运算

发布时间：2026/8/9 6:29:46 三亩地 编程学习日记
UE5材质入门：从Photoshop图层思维到材质节点四则运算

1. 项目概述：从平面思维到三维材质的跨越

如果你是从Photoshop、SAI或者Procreate这类平面绘图软件转向虚幻引擎5（UE5）材质制作的，那么恭喜你，你已经掌握了最核心的创作思维——图层叠加与混合。这个项目标题“从Photoshop图层到材质节点”精准地戳中了许多初学者的痛点：面对UE5材质编辑器中密密麻麻的节点连线，感觉既熟悉又陌生。熟悉的是那些“叠加”、“正片叠底”、“滤色”等混合模式的名字，陌生的是它们变成了一个个需要连线的方框，并且还多出了“加”、“减”、“乘”、“除”这些看似更基础的数学运算。

实际上，UE5的材质蓝图（Material Blueprint）就是将你的视觉艺术创作过程，从二维的、基于结果的经验性操作，解构为三维的、基于物理的、可编程的逻辑过程。在Photoshop里，你拖动一个“曲线”调整层，下意识地知道会让画面变亮或变暗；在UE5里，你需要用一个“乘法（Multiply）”节点，将纹理与一个标量值（比如2.0）相乘，来达成同样的“变亮”效果。这里的“乘法”，就是你曾经那个下意识操作的数学本质。

本篇文章的目标，就是为你搭建这座思维的桥梁。我不会一上来就罗列上百个节点，而是聚焦于最核心、最常用、也最容易被误解的四个基础数学节点：加（Add）、减（Subtract）、乘（Multiply）、除（Divide）。我将通过大量与Photoshop操作的类比，让你理解这些节点在材质中究竟在“计算”什么，以及如何组合它们来实现复杂的视觉效果。无论你是美术师、技术美术（TA）还是对材质感兴趣的开发者，掌握这“四则运算”，就等于拿到了打开UE5材质世界大门的钥匙。你会发现，许多令人眼花缭乱的高级材质，其底层逻辑无非是这些基础运算精妙的排列组合。

2. 核心原理：材质节点的“计算”本质

在深入节点之前，我们必须建立一个根本性的认知：UE5材质系统中的几乎所有操作，本质上都是数学计算。材质编辑器不是一个“魔法画笔”工具，而是一个可视化编程环境，它处理的数据主要是两种：颜色（Color，RGBA四通道向量）和数值（Scalar，单浮点数）。

2.1 数据类型：颜色与数值的对话

这是理解一切操作的基础。在Photoshop中，一个像素的颜色由R（红）、G（绿）、B（蓝）三个通道的值（0-255）决定，可能还有一个A（Alpha，透明度）通道。在UE5的材质系统中，颜色通常用一个三维向量（RGB）或四维向量（RGBA）来表示，每个通道的值是0到1之间的浮点数（对应0-255的归一化）。

  • 颜色（Vector3/Vector4）：例如纯红色是 (1, 0, 0)，白色是 (1, 1, 1)，黑色是 (0, 0, 0)。一个TextureSample节点输出的就是这种颜色数据。
  • 数值（Scalar）：就是一个单一的浮点数，比如 0.5, 2.0, -1.0。一个Constant节点输出的就是这种数据。

很多节点既能接受颜色输入，也能接受数值输入。当颜色与数值进行运算时，通常意味着对颜色的每个通道都执行相同的数值运算。这是关键！

2.2 与Photoshop图层的映射关系

在Photoshop中，你通过图层的“混合模式”来决定上下图层如何融合。在UE5中，你通过连接不同的数学节点来实现混合。它们之间有着强烈的对应关系：

  • 线性减淡（添加） ≈ Add节点：Photoshop的“线性减淡”模式查看每个通道的颜色信息，并通过增加亮度使基色变亮以反映混合色。这本质上就是加法。在UE5中，Add节点将两个输入值（或颜色的每个通道）相加。如果相加结果超过1.0（即255），在默认的Clamp（钳制）模式下，它会被限制为1.0（纯白），这模拟了过曝的效果。
  • 正片叠底 ≈ Multiply节点：这是最常用的混合模式之一。其数学原理就是乘法。在Photoshop中，结果色 = 基色 × 混合色 / 255。在UE5中，Multiply节点直接执行 A × B 的运算。因为颜色值在0-1之间，相乘的结果总会使颜色变暗（除非乘以1）。纯白（1）是中性色，纯黑（0）会使结果变为纯黑。这常用来制作阴影、污渍、叠加图案。
  • 滤色 ≈ 某种特定的加法/反转乘法组合：Photoshop的“滤色”模式是“正片叠底”的反相操作，它使结果变亮。在UE5中没有直接的“Screen”节点，但你可以通过公式1 - (1-A)*(1-B)来实现，这可以通过Multiply和Add节点组合完成。这揭示了UE5材质的一个核心思想：通过基础节点构建复杂功能。
  • 叠加、柔光等：这些更复杂的混合模式，在UE5中通常由内置的LinearInterpolate(Lerp) 节点配合灰度图作为Alpha遮罩，或者使用Power、Sine等节点来模拟其非线性变化曲线。

理解了这层映射，你就不会再惧怕那些节点。你只是在用另一种语言，描述你早已熟悉的视觉合成过程。

3. 基础四则运算节点深度解析

现在，让我们逐一拆解这四个最基础的数学节点，看看它们究竟如何工作，以及如何在材质中运用。

3.1 加法（Add）节点：控制亮度与偏移

加法节点的功能直观：输出 = A + B。

核心应用场景：

  1. 调整亮度/曝光：这是最直接的用法。将一个纹理（比如漫反射贴图）连接到A，将一个常数（比如0.3）连接到B。输出纹理的整体亮度会提升0.3。如果B是负值（如-0.2），则亮度降低。

    实操心得：单纯用Add提亮阴影区域时，容易导致亮部过曝（值超过1.0变成纯白丢失细节）。更专业的做法是使用Multiply配合一个灰度遮罩来局部提亮，或者使用Power节点进行伽马校正。

  2. 混合颜色光晕：例如，模拟自发光物体。将基础颜色与一个高亮颜色（如 (2, 1, 0.5) ）相加，会产生一种“溢出”的、饱和度很高的发光效果，因为通道值可以超过1.0。此时需要后续连接Clamp节点或使用Post Process体积中的Bloom效果来处理。
  3. 制作顶点偏移动画：在材质的世界位置偏移（World Position Offset）通道中，将顶点法线信息与一个随时间变化的数值相加，可以模拟物体均匀膨胀或收缩的效果。

注意事项：

  • 通道溢出（Clamping）：默认情况下，材质会钳制（Clamp）最终输出到0-1范围。但在中间计算过程中，允许值超出此范围。理解这一点对制作HDR效果很重要。
  • 与Lerp的区别：Add是线性叠加，权重各为50%。如果你想以可变的权重混合两个输入，应该使用LinearInterpolate(Lerp) 节点。

3.2 减法（Subtract）节点：创造对比与遮罩

减法节点：输出 = A - B。它并不常用，但用对地方效果显著。

核心应用场景：

  1. 制作边缘检测或凹槽效果：将两张相同的法线贴图，其中一张通过TextureCoordinate节点做微小的UV偏移，然后两者相减（A - B）。结果会在颜色/高度变化的边缘产生高亮线，可用于生成污渍边缘、磨损高光或简单的轮廓光。
  2. 反转遮罩：这是非常实用的技巧。如果你有一张黑白遮罩图，白色（1）表示显示区域，黑色（0）表示隐藏区域。当你需要反转它时，可以用一个常数1（Constant设为1）减去这张遮罩图。输出结果就是反转后的遮罩。
  3. 计算差值进行混合：比较两个纹理或参数的差异，根据差值大小来控制其他效果。例如，用当前像素亮度减去一个阈值，结果大于0则输出一种材质，小于0则输出另一种，可用于制作动态的“湿润表面”效果。

3.3 乘法（Multiply）节点：强度、混合与衰减的核心

乘法节点是材质编辑器的“万金油”，使用频率极高。输出 = A × B。

核心应用场景：

  1. 控制强度/饱和度：将一个纹理与一个小于1的标量值相乘，会按比例降低其所有通道的强度，整体变暗、饱和度降低。这是模拟阴影、衰减、透明度的基础。
  2. 纹理混合（正片叠底）：将两张纹理相乘。例如，将一张砖墙的漫反射贴图与一张锈迹斑驳的灰度图相乘，锈迹区域（灰度图黑色部分，值为0）会使砖墙变黑，模拟锈蚀；较亮部分则影响较小。这比Lerp更柔和，是物理正确的混合方式之一。
  3. 制作衰减遮罩：结合Distance或Dot Product节点。例如，计算像素到某点的距离，得到一个从0（远处）到1（近处）的值，然后用一个Power节点控制衰减曲线，最后用这个值去乘某个效果（如自发光强度），就能实现平滑的径向衰减。
  4. 分离或组合通道：将一个RGB颜色向量与一个纯色向量相乘，可以过滤或强调特定通道。例如，乘以 (1, 0, 0) 就只保留红色通道。

参数计算示例：模拟粗糙度变化假设你有一张基础的粗糙度贴图（BaseRoughness），值在0.3到0.6之间。你想在物体表面受潮的部分降低粗糙度（变得更光滑）。

  1. 你需要一张潮湿区域遮罩（WetMask），潮湿处为白色（1），干燥处为黑色（0）。
  2. 你希望潮湿处的粗糙度降低到0.1左右。
  3. 你可以这样构建：FinalRoughness = BaseRoughness * (1 - WetMask * 0.7)。
    • 解释：WetMask * 0.7表示潮湿处的影响强度为0.7。1 - WetMask * 0.7在潮湿处结果为0.3，在干燥处结果为1。
    • 最终，干燥处粗糙度不变（BaseRoughness * 1），潮湿处粗糙度变为原来的0.3倍（BaseRoughness * 0.3），实现了变光滑的效果。

3.4 除法（Divide）节点：标准化与比例计算

除法节点：输出 = A / B。使用时需要格外小心，因为除数为零会导致无效结果（UE5中通常处理为一个极大值或NaN，可能引发视觉错误）。

核心应用场景：

  1. 归一化（Normalization）：这是除法最重要的用途。将一个向量除以其长度（模），可以得到一个方向相同、长度为1的单位向量。在材质中，常用Normalize节点直接完成，其内部就是除法运算。单位向量在计算光照（如点积）时至关重要。
  2. 计算比例/比值：例如，用屏幕空间坐标的X分量除以Y分量，可以得到一个从屏幕左边到右边的渐变梯度，与Y值无关。这可用于制作与屏幕长宽比无关的渐变背景。
  3. 高级纹理混合：有时用于实现特殊的混合公式，如除以（A+B）来实现某种平均化效果，但这种情况较少。

重要警告：在实际操作中，应尽量避免直接用Divide节点除以一个可能为零的动态值。一个安全的做法是使用SafeDivide自定义函数（如果项目中有），或者用Branch节点或Max节点来确保除数有一个最小值（如Max(B, 0.001)）。

4. 从Photoshop操作到材质蓝图实战

让我们通过几个具体的案例，将你在Photoshop中的操作习惯，直接翻译成UE5的材质节点网络。

4.1 案例一：制作带污渍和磨损的边缘发光材质

Photoshop思路：

  1. 底层：金属基础色。
  2. 中间层：污渍贴图，使用“正片叠底”模式。
  3. 上层：边缘磨损遮罩，用于提亮边缘，可能用“线性减淡（添加）”或“滤色”模式。

UE5材质实现步骤：

  1. 基础设置：创建材质，Blend Mode设为Opaque，Shading Model设为Default Lit。
  2. 引入纹理：拖入三个TextureSample节点，分别连接：
    • T_BaseColor：金属基础色贴图。
    • T_Grime：黑白污渍贴图（白色表示干净，黑色表示污渍）。
    • T_EdgeWear：黑白边缘磨损遮罩（白色表示磨损边缘）。
  3. 混合污渍：
    • 思路：污渍处颜色变深。使用Multiply节点。
    • 操作：将T_BaseColor连接到Multiply节点的A引脚。将T_Grime连接到B引脚。因为T_Grime是黑白的，黑色（0）相乘会使基础色变黑，白色（1）则保留基础色。但注意，这会使干净区域（白色）完全不变，污渍区域（黑色）完全变黑，可能过于生硬。
    • 优化：更好的做法是，先用一个Constant节点（如0.5）乘以T_Grime，得到一个强度减弱版的污渍遮罩，再用Lerp节点去混合基础色和一个调暗后的颜色。这给了你更多的控制权。
  4. 添加边缘磨损：
    • 思路：磨损边缘更亮，模拟金属高光。使用Add节点。
    • 操作：将上一步混合后的颜色输出，连接到一个Add节点的A引脚。
    • 准备边缘高光颜色：创建一个Constant3Vector节点，设置为一个亮色（如 (1.5, 1.2, 0.8) 模拟金属磨损）。将其连接到另一个Multiply节点的A引脚。
    • 将T_EdgeWear连接到这个Multiply节点的B引脚，用于控制高光显示的强度区域。
    • 最后，将这个Multiply节点的输出连接到Add节点的B引脚。
    • 将Add节点的输出连接到材质的Base Color引脚。
  5. 连接其他属性：类似地，你可以用T_Grime和T_EdgeWear通过Lerp节点去影响粗糙度（Roughness）和金属度（Metallic）。例如，污渍区域粗糙度更高，金属度更低；磨损边缘粗糙度更低，金属度更高。

通过这个案例，你可以看到，Multiply用于变暗（正片叠底），Add用于变亮（线性减淡），而Lerp用于根据遮罩选择两种结果。

4.2 案例二：基于高度的混合材质（模拟积雪、泥土）

Photoshop思路：使用一张高度图（Height Map）作为蒙版，通过“曲线”或“色阶”调整蒙版对比度，然后用于混合两个图层。

UE5材质实现步骤：

  1. 核心节点：LinearInterpolate (Lerp)：虽然标题聚焦加减乘除，但Lerp是混合的灵魂，必须掌握。Lerp(A, B, Alpha)根据Alpha值（0到1）在A和B之间线性插值。Alpha为0时输出A，为1时输出B，为0.5时输出中间值。
  2. 引入纹理：拖入TextureSample节点：T_Snow（雪材质）、T_Mud（泥土材质）、T_Height（高度图）。
  3. 处理高度遮罩：
    • 高度图本身可能对比度不够。我们可以用Multiply和Add来调整它的对比度和亮度，模拟Photoshop的“色阶”功能。
    • 创建一个Multiply节点，将T_Height与一个常数（如2.0）相乘，增加对比度（拉伸）。
    • 再将结果连接到一个Add节点，加上一个常数（如-0.3），降低整体亮度（黑场）。
    • 最后，使用Clamp节点将结果限制在0-1之间，防止超出范围。这个处理后的结果就是我们需要的Alpha遮罩。
  4. 执行混合：
    • 拖入Lerp节点。
    • 将T_Mud连接到A引脚（作为底层）。
    • 将T_Snow连接到B引脚（作为顶层）。
    • 将处理后的高度遮罩连接到Alpha引脚。
    • 这样，高度高的地方（白色）显示雪，高度低的地方（黑色）显示泥土，中间过渡平滑。
  5. 增加细节：你可以用Power节点（本质是乘方运算）对高度遮罩做非线性变换，让混合边缘更硬或更软，这类似于Photoshop中曲线的非线性调整。

这个案例展示了如何用Multiply和Add来预处理一张贴图，为更复杂的混合操作（Lerp）准备数据。它们是构建复杂材质网络的基石。

5. 常见问题与排查技巧实录

即使理解了原理，在实际操作中依然会遇到各种问题。以下是我在项目中总结的一些典型坑点和解决思路。

5.1 问题：为什么我的材质看起来一片纯白或纯黑？

  • 排查思路：
    1. 检查数值范围：这是最常见的原因。如果你将一个纹理与一个大于1的数值Multiply，或者进行了多次Add，很容易导致最终输出值远超1.0，被钳制为纯白。反之，多次与小于0的值运算会得到纯黑。
    2. 使用预览节点：在材质编辑器中，按住键盘上的M键并在节点连线上点击，可以创建一个临时的预览节点，实时查看该连线上的数据（颜色或数值）。这是最强大的调试工具。沿着你的节点网络一路预览，找到数值“爆炸”或“归零”的那个点。
    3. 检查纹理采样：确保TextureSample节点的UV坐标输入正确，没有连接到错误的值导致采样出错。

5.2 问题：边缘闪烁或出现奇怪条纹（精度问题）

  • 排查思路：
    1. 除法除以零：如果使用了Divide节点，并且除数可能为0或非常接近0，就会产生极大值或NaN，导致视觉错误。确保除数有最小值保护。
    2. 世界空间与局部空间：在计算位置相关效果（如基于世界坐标的纹理平铺）时，如果物体移动或旋转，使用物体局部空间（Object Position）还是世界空间（World Position）会带来巨大差异。使用Transform节点（如TransformVector）来正确转换法线等向量信息。错误的坐标系转换是导致闪烁和条纹的元凶之一。
    3. 纹理过滤与Mipmap：在极远处或陡峭角度下，纹理采样可能出现摩尔纹或闪烁。确保纹理的压缩设置合适，并可以尝试在TextureSample节点中调整Mip Value Mode或使用DDX/DDY节点进行手动微分计算（高级用法）。

5.3 问题：性能开销大，材质编译缓慢

  • 优化技巧：
    1. 减少纹理采样：纹理采样是材质中最耗性能的操作之一。尽可能复用同一张纹理的不同通道（例如，将粗糙度、金属度、环境光遮蔽打包到一张纹理的RGB通道中）。
    2. 简化数学运算：复杂的、多层嵌套的Power、Sine、Divide运算会显著增加像素着色器的指令数。考虑是否能用查找表（TextureLookup）或近似函数替代。
    3. 善用材质函数和参数集合：将常用的节点组合（如边缘磨损计算、高度混合）封装成材质函数（Material Function），可以简化主材质图表，提高复用性和编译效率。将需要频繁调整的标量值提升为材质参数（Scalar Parameter），便于在实例中调整，而无需重新编译父材质。

5.4 高级技巧：用乘加节点模拟复杂函数

有时你需要一个简单的曲线，比如实现一个“阈值化”效果：当输入值大于0.5时输出1，小于0.5时输出0。虽然可以用If节点或Step节点，但一个更优雅且性能更好的方法是使用Saturate和乘加运算。

公式：Output = Saturate((Input - Threshold) * Sharpness)

  • Input：你的输入值（如灰度）。
  • Threshold：阈值，比如0.5。
  • Sharpness：锐度，一个很大的数，比如1000。
  • Saturate：钳制到0-1。

在材质蓝图中：

  1. 用Subtract节点计算(Input - Threshold)。
  2. 用Multiply节点将结果乘以一个很大的Sharpness常数。
  3. 连接Saturate节点。 当Input略大于0.5时，(Input - 0.5)是一个很小的正数，乘以1000后变成一个大于1的数，Saturate后为1。当Input略小于0.5时，得到负数，Saturate后为0。这就实现了一个非常锐利的阈值切割。通过调整Sharpness，你可以控制过渡的硬度。

这个例子展示了如何用最基础的加减乘除，组合出非线性的、可控的效果。这正是UE5材质编辑的魅力所在——将视觉艺术转化为可推理、可控制的数学过程。当你开始习惯这种思维，你就会从“连接节点”转变为“设计算法”，创作空间将变得无限广阔。

编程学习 学习日记 实战经验
← 返回列表