//这篇文章是学习Ben Cloward材质教程的笔记，每日更新一集，笔记要是看不懂就回去看原视频，Shader Graph文件我会放在github。这篇已经更新完了o(〃’▽’〃)oDafenyuyu/Shader_BenCloward: 学习BenCloward材质教程的ShaderGraph文件 (github.com)
Episode 2——The Graphics Pipeline - Shader Graph Basics
在Unreal中实现简单的顶点动画和UV动画
在Unity中实现
效果
Episode 3——Your First Shader - Shader Graph Basics
这一节只教了一下如何创建你的第一个Shader，很简单就不记录了，但是有一点需要了解，在unity创建Blank Shader Graph的时候，创建出来的东西是紫色的，需要添加一个Active Targets
Episode 4——Basic Shader Math - Shader Graph Basics
这一节教了一下加减乘除的用法。One Minus节点可以翻转黑白，最后实现了UV流动的效果。
Unreal中实现节点
unity中实现斜着流动
unity中垂直流动
Episode 5——Understanding Texture Maps - Shader Graph Basics
查看贴图在引擎中的资源占用量
Unreal中，双击贴图的右上角
unity中，单击贴图后Inspector面板底部的位置
不同格式、分辨率，以及使用不同通道下情况下贴图的大小对照表
DXT1、DXT5、BC7是经过压缩后的图像，虽然很小，但是可能会出现伪阴影，分别支持三通道、四通道和三四通道。R、RGB、RGBA是没有经过压缩的图像。通常使用带Alpha通道的图像会比不带Alpha通道的图像大一倍。
Unreal中不同类型的贴图设置，不需要Alpha通道的图开启无透明度压缩，默认压缩格式是DXT1/5，没有出现伪影的情况下可以使用。如果将压缩格式设置为用户图形界面2D，那图片的格式就会变为B8GBR8A8。根据贴图需要可以开启或者关闭sRGB这一选项。如果是灰度图可以设置为单通道。
Episode 6——Linear Interpolation Node (Lerp) - Shader Graph Basics
拆解一下Lerp节点
假如有一个红色和一个蓝色，然后我想用一个值来控制它，这个值为1时就是蓝色，为0时就是红色，所以就需要有，当1乘蓝色时，要有零乘红色，这个0可以通过One Minus节点得到，然后将这两个乘后的值加起来就能满足开始的需求，用unity做示例
如果觉得用三个节点太麻烦，那直接用lerp这个封装好的节点就可以
一些Lerp的用法
Episode 7——Dot Product Node - Shader Graph Basics
了解一下点积是如何运算的
点积的一些运用
法线方向和视角方向进行点积并去反可以得到菲涅尔效果
Episode 8——Texture Coordinates - Shader Graph Basics
这一集讨论的是uv的一些应用，乘缩小，除放大，加减位移
这里学习一个节点，Append，可以将两个一维数据转化为二维数据
扰动效果
Unreal中实现扰动效果（这样连可以避免重复的扰动效果，三个RGB三个通道的内容都不一样）
unity中的效果实现
Episode 9——Input Vectors - Shader Graph Basic
这一集讨论一下输入矢量
一些向量的应用
Saturate节点去饱和度，Negate节点变负
根据范围取遮罩，先获取相机与物体之前的距离，减掉一个值再去除一个值，例如下图，物体距离相机位置大于9.5的地方就会变白，反之为黑色
布料材质模拟
棉布材质的特征通常表现为边缘有发白的效果
丝绸则为中间发白
在Unreal中模拟这种效果，为了具有更多的可控性，这里不使用fresnel节点。简单理解就是，视角方向和世界空间法线方向做点积会产生边缘发黑的效果，使用Oneminus节点反一下可以实现菲涅尔效果，再使用power进行发白区域控制，乘一个常量控制发白的亮度。反之如果不使用OneMinus节点则可以模拟丝绸的高光效果。这里使用的切线空间法线转世界空间法线的节点是TransformVector。
在unity中模拟
Episode 10——View, World, Object, & Tangent Space - Shader Graph Basics
unity中实现Matcap
材质混合
unity中使用法线G通道来划分遮罩，并配合Lerp在模型顶部混合不同的材质，法线由切线空间转换到对象空间时，这个混合的材质是能跟着模型动的，如果是转化到世界空间，那这个混合的材质就永远保持在最上面。Contrast（对比度）和Saturate（饱和度）也是用来配合划分遮罩
Unreal中实现也大差不差
Episode 11——Min, Max, Clamp, & Saturate
限制性节点的作用
使用Split节点分出法线向量的G通道的范围是-1~1，用这个得到的遮罩作Lerp会有一些不正确的结果，所以可以使用Saturate将其范围限制在0~1
Unreal中使用也类似
Episode 12——Blending Normal Maps - Shader Graph Basics
如何分辨法线贴图的格式
Unreal使用的是DirectX，Unity使用的是OpenGL，区别就是绿通道的朝向不同。这里有一个辨别小技巧，红橙黄绿青蓝紫的顺序，顺时针为DX，逆时针为OpenGL，红色在右边为凸，左边为凹。
混合法线贴图的几种不同方法
第一种（Sample）：可以理解为将法线贴图的RG通道相加，优点是和混合之前的消耗差不多，缺点是会将法线贴图强度降低。
第二种（UDN）：在Combine那一步，B通道使用了基础法线的B通道，并在最后做归一化处理，好处是基础法线的细节得到了保留，缺点是性能消耗更大一点点。
第三种（Whiteout）：和UDN相似，不同的是Combine那一步使用的是两个法线贴图B通道相乘的结果。质量会更好，性能消耗也会更大一点点。
第四种（RNM）:和第三种消耗一样，但是结果更准确，计算过程很复杂
第五种：使用法线混合节点
Episode 13——Detail Normal Mapping - Shader Graph Basics
这一集讨论细节法线贴图
教程中的做法是基础纹理颜色和粗糙度合成一张贴图，Detail贴图的RG存细节法线的RG，B通道存粗糙度，A通道存一个去色的颜色信息。法线贴图首先要解码，Detail的RG通道乘2减1，再用计算Z通道的节点，算出法线贴图信息，再用BlendNormal节点进行混合。粗糙度贴图直接相乘即可。颜色贴图使用Blend节点的Overlay模式进行混合。
解码法线的节点
Episode 14——Advanced Detail Mapping
这一集讨论高级细节贴图的制作
在unity中，传统艺能下，我们想要通过遮罩来划分某些区域的贴图，我们通常会在RGBA是个通道划分不同的区域以实现效果，这样做有一个好处能使贴图有过渡的混合，但也会让贴图数量非常多，这里不过多赘述。
这里讨论另一种方法，使用TextureArray纹理数组，并使用不同数值的灰度来区分遮罩
先来看看unity中的TextureArray怎么制作，首先需要将纹理进行手动排列，就行下面这样，然后TextureShape设置为
,怎样排列的就怎样设置行列，我这里设置为2x2。如果是横着排的那应该可以设置为4x1（这里没有尝试过，不知道是否能成功）。然后调节贴图的Array值就可以显示不同的贴图
。SG中对应调整
Index值。
接下来是遮罩图的做法，可以拉一个渐变取，四个区域的值，这张图存的是灰度信息所以不需要勾选SRGB。数值取对后，统一乘3，配合四舍五入节点Round，就能得到对应区域的0123值
接下来看节点，这里法线需要使用Normal Unpack节点转为切线空间
虚幻中如何制作
右键创建一个2D纹理数组
、
添加四个源纹理依次放入就行
看节点
Episode 15——Smoothstep - Shader Graph Basics
SmoothStep这一节点可以理解为，限定范围内的值将保持0到1的平滑过渡（不是线性的），范围外则保持0或者1
做一个消融效果
Sin Time的范围是-1到1，将其映射到0.5~1.5再减去一个和0.5相近的值，就能够实现0到1再到0的过程，用SmoothStep限定遮罩再相减就能实现描边消融效果
还有一个限定高度的遮罩教程，请看原视频（因为暂时没搞懂）Smoothstep - Shader Graph Basics - Episode 15 - YouTube
Episode 16——Length & Distance
这集讨论距离和长度节点
第一个案例，相机五米之内物体变黑
第二个案例，树叶摇曳
第三个案例，一个非常酷的亮点
Episode 17——Ceiling, Floor, & Round Nodes
取整的一些节点
Ceiling向上取整，Floor向下取整，Round四舍五入
示例1：请看第14集的遮罩划分
示例2：法线方向点乘光方向，再Remap到0到1得到半兰伯特，乘5用floor，再乘0.15得到颜色分级
Episode 18——Derivatives DDX DDY
导数节点
案例1：通过测量DDX和DDY的斜率来计算各个面的法线，然后使用专业叉积来找到每个面的法线
案例2：贴hdri的方法。mip值模式需要改为导数
案例3：bump转法线（下面零散节点是原理，上面那一个是封装好的），unity中对应的是Normal form height
Episode 19——Sine and Cosine
水波纹效果
案例1:黑白变化
案例2：水波纹效果，Fraction节点的作用是取余，取余减1获取一个-1到0的被减数，乘第一个8是为了让这个圆变得更实一点，第二个乘乘的数越大，波纹的圈数就饿越多。
案例3：弹跳效果
案例4：UV旋转。SG中有封装好的节点就是UV下的Rotate
Unreal中实现
Episode 20——Power
Power就是数学里面的次幂
越大越暗，越小越亮
Power的一些用法
关于图像的那个SRGB开关也就是伽马矫正，Power值为2.2可以将未勾选的图得到一个近似于勾选后的值，如果勾选了的图，Power值为0.45则可以得到一个近似于未勾选的图
Episode 21——Shader Performance Measurement
Shader编译流程
友情链接 视频中计算Shader性能的链接 Shader Playground (timjones.io)
Ben计算好的对应指令消耗的列表Instruction Cycles - Google 表格
Episode 22——Shader Performance Measurement Part 2
PIX测量Shader的性能
Shader Performance Measurement Part 2 - Shader Graph Basics - Episode 22 - YouTubeh
Episode 23——Advanced Channel Packing
高级通道打包
正常情况的贴图打包
精简后的
因为AO和法线贴图的B通道相似，所以将AO贴图放在法线贴图的B通道，这种贴图打包方式在压缩后相对于Normal的专用压缩格式来说细节上会有一些损失。使用于植物、石头这一类物件。
根据GR通道解码法线贴图
UE中封装好的节点为DeriveNormalZ，unity为Normal Reconstruct Z
Episode 24——Reflection and Refraction Vectors
反射和折射
eta是空气的折射率除以玻璃的折射率，折射后图像会倒过来，就像透过玻璃珠看物体，如果不做这些操作，默认反射和折射的内容就是场景中的内容
由于SG中没有折射节点所以需要自定义一个
Episode 25——Swizzle & Channel Manipulation
一些通道拆分与合并节点
这些节点都是免费的不会有额外的性能消耗。Unreal中的合并是Append，unity中的是Combine。Swizzle在较高版本的SG中才会有。
把UV变成VU来旋转图片
Episode 26——Using Position Data
一些位置数据的用法（位置不同遮罩不同）
Absoult Position是相对于世界坐标原点的位置数据
下面·这个案例用于树木的颜色变化非常好用，不同位置有不同的颜色遮罩，拿这个遮罩数据做Lerp
Unreal中的用法
Episode 27——Direction Masks
根据法向量取不同方向的遮罩
Unreal中实现
Episode 28——Triplanar Projection
三平面投影
需要结合上面两集来看
直接用封装好的节点Triplanar和这种昂贵的效果是一样的，至于使用世界空间还是模型空间根据实际需求来定 有点不求甚解了，等实际用上了再说吧
Unreal中的实现
Episode 29、30——是讲三平面投影的映射翻转，以及三平面投影的法线。直接看这个老哥写的吧，这一块有点烧脑。可能他写的也不是很明白，再贴图一个原视频的链接shader着色器基础课21-30_noh贴图-CSDN博客
Triplanar Projection Normal Maps - Shader Graph Basics - Episode 30 - YouTube
Episode 31——MatCap
正确的Matcap做法
Episode 32——LatLong Projection
unity中采样2D格式的HDRI
Unreal中LongLatToUV节点的实现原理
Episode 33——Creating Cubemaps
虚幻中需要未压缩的DDS格式才能够被导入，制作插件下载链接纹理工具导出器 |英伟达开发者 (nvidia.com)
虚幻官方对于Cubemap的一些介绍，创建、导出、导入、使用立方体贴图 |虚幻引擎4.27文档 (unrealengine.com)
笔记就看看他写的shader着色器基础课31-40_unity matcap 卡通材质-CSDN博客
Episode 34——Interior Mapping
内部映射（假室内）
先来构建一个三分量的UV坐标
然后这样连就行（主打一个装懂，但是这样连是能实现的，后面有时间再去弄清楚原理吧）
Cubemap的格式可导入HDR或者DDS，EXR不行，dds格式被压缩了也导不进，只能用33集中说到的那个英伟达插件，所以想要简单快捷还是用HDR吧
Unity中实现
Episode 35——Random Noise
随机的室内效果
直接增加行列数会显得太过规律，所以要给这种效果添加一些随机
先构建一个材质函数
然后这样连
随机后的一个效果
Unity中实现
先做一个Sub Graph
然后请这样连
Episode 36——Interior Mapping Polish
给假室内效果加上外墙以及内部随机自发光
unity中实现，先定义一个Sub Graph，大部分是复制上一节课的，然后定义了两个输入和输出接口
然后请这样连，中间部分的菲涅尔效果是为了让窗户看起来更像玻璃
Unreal中实现
先定义材质函数
然后这样连
Episode 37——Object Space Interior Mapping
更正确的显示效果
从顶部往下看会显示地面，从底部往上看会看到天花板
Hash33
然后这样连，Branch那里连不上可能需要高版本的SG
Unreal中实现
Hash33
材质函数
Shader小改变
Episode 38——Toon Shader Paint
卡通着色器
主要包含三个要素：绘画、镜面高光和描边，这一集主要制作绘画，要注意的事情是我们实际上是在着色器本身创建照明，之前大部分着色器用的都是引擎中的照明所以这里模版选择Unlit
第一种卡通效果的方法在第十七集有，这里我们直接介绍第二种，做一个这样的渐变图，并按照下面的方式进行压缩设置，如果不这样设置显示效果可能会有问题
用半兰伯特作为U向输入，再用一个Slider节点作为V向输入，这样的话调节Slider值就能拥有不同的渐变效果
Unreal中实现，UE中没有Slider节点。图片压缩要关掉SRGB然后压缩格式选用户图形界面2D
Episode 39——Toon Shader Ink Outlines
卡通外描边
方法1，根据前面的向量方面的教程我们了解到法线向量和视角方向做点积可以有反的Fresnel效果，刚好最外面有一圈黑的，然后我们让这个结果更加具体，所以用if节点，并设置一个阈值，大于这个值就返回1，小于就返回0。这个阈值也刚好能控制描边的粗细。但这种方法在某些物体上用不了，例如正方体
方法2：就是复制一个网格并沿法线挤出一点点，然后翻转面法线，再赋予一个黑色的材质
方法3：是基于后处理完成的，再深度缓冲区上运行一个查找边缘过滤器，以便在深度缓冲区中找到深度突然跳跃的位置，然后遮蔽那些黑暗的地方。重要的是Ben没教。。。这里贴一个链接教程Selection Outlines Without Post-Process Material - [UE4 Tutorial] - YouTube
Episode 40——Toon Shader Specular Highlights
卡通着色器的镜面高光Blinn&Phong
Blinn是半角和法线向量做点积
先加可以看出带一点点贴图的染色，后加就是比纯白，round后的高光比较硬，根据效果选择方式。个人感觉Phong比Bilnn好看
Unity中实现，需要注意的是，Unity的值会被限制，所以在Unity里面就直接后加
Episode 41——Tessellation and Displacement
置换
用的是Unity里面的功能，并没有教曲面细分是怎么实现的
遮罩用于控制细分区域，这个可以提神着色器性能。通常情况下，正视一个物体法线贴图就能拥有足够好的效果，假在边缘，所以边缘需要更多的置换效果，所以用法线向量和视方向做点积得到反着的类似Fresnel的效果，再用OneMinus取反并连入Tessellation Factor这个接口。这个功能只在HDRP中有，URP中没有
Episode 42——UV Rotation
UV旋转
Unity和Unreal都有封装好的节点就叫Rotate。下面看一下实现原理的节点
案例1：不均匀的旋转UV,实际上还是画一个遮罩，用的是VectorLength节点，测量枢轴点到当前像素的距离，越远越白，所以用OnMinus反转。因为是靠Time实现持续旋转，所以用这个遮罩乘上Time就可以得到不均匀的旋转速度。此时可以改变旋转中心点来获得不同的旋转效果
案例2：树叶旋转摇曳效果
具体思路就是用Sin控制其来回旋转，并限定在一个较小的值
Episode 43——Moving, Rotating, and Scaling UVs
制作一个具有移动旋转缩放功能的材质函数或者叫Sub Graph
Unity中实现
Episode 44——Random UV Transforms
随机的UV变化
需要用到之前课上做的Hash23和UVTransform，来制作一个材质函数，其本质就是让Hash23生成的随机数来控制旋转
应用
Unity中实现
这你uv变化节点采用弧度作为单位的旋转值，所以要将角度转为弧度需要用到Degress To Radians节点
Episode 45——Texture Tile Break-up
解决地形规范平铺的问题（简单版本）
用到的是上一集制作的材质函数。简单说一下思路就是，上周给采样的纹理添加了一个Round节点，使其范围限制在了0和1，所以整个纹理只会有两种情况的随机，为了能有更多的随机，我们给这个灰度图乘上一个值之后在使用Round，这个值就是随机次数。
Unity中实现
Unreal中实现
Episode 46——Procedural Hex Grid
创建六边形
节点有点复杂，建议直接看源文件，虚幻也差不多这样连
Episode 47——Texture Tiling Without Repetition
颜色部分的重复感消除
完成上一集材质函数的第五部分，公开UVs、HexFocus、HexSize三个参数
得到
然后配合之前的UVRandomTransform节点，然后这样连。如果只采样同一张贴图，那会有稍微好一点的性能，但是视觉感官上会有一些不好，例如严重的边缘感。如果采样三张贴图那就会解决这个问题但是性能开销会增大一些
Epsode 48——Hex Grid Normal Tiling
最终的着色器It's pretty cool
让我们先把颜色贴图采样的节点封装成一个，需要公开一些参数，这个节点只对颜色和灰度图有用
这个要获取到旋转的弧度，并输出一个能够转回去的角度，也就是TAU减这个弧度，TAU是2PI
然后做一个将法线转回去的函数，这里用的的Rotation就是上面输出的那个，这你Normal用Vector4是考虑到了某些情况可能会使用打包贴图
然后是采样法线贴图的节点，会用到上面的RotationNormal节点，NormalType选择为Normal
最后是完全体
这里对比一下正常和不正常的法线贴图，左边是不正常的，可以看出光照似乎是来自各个方向，这很显然不正确，右边则是正常的，光影方向统一
虚幻中的操作也差不多，可能在旋转法线那个材质函数那里没有Rotate这个节点，需要去UVRandomTransform那里复制一段旋转的代码，然后其他的都差不多
1026
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
