“丝绸的高光”放在Unity里为什么这么难调我摸索的结果是默认PBR材质根本做不出那种流动的、会随角度改变方向的丝光。上周做披风项目时我把URP的Lit、Built-in的Standard来回拖参数高光始终是塑料式的圆点或者一整片油亮直到我放弃默认材质自己写了一个带各向异性GGX的Shader才终于把那种沿纤维方向被拉开的丝质光泽还原出来。这篇文章把从物理原理到最终Shader实现的完整过程记录下来包括可复制的代码和调试坑。如果你在Unity里做丝绸、缎面这类布料或者想深入理解PBR微表面模型里各向异性的含义这篇应该能帮你少走很多弯路。1. 丝绸为什么“油光却不塑料”问题出在默认PBR的方向假设上1.1 微表面模型里被忽略的“方位角”PBR微表面模型的基本想法是把表面看作无数朝向各异的微小镜面每个微表面根据自身法线对光照做反射最终结果是所有微表面的统计叠加。这个模型在金属、塑料、石头这些材质上表现良好因为它们表面的微观凸起方向没有偏好——转了90度统计特征还是一样可以叫它各向同性。但丝绸不一样。织物的微观结构是一根根基本平行的纤维每根纤维近似一个小圆柱。光打在圆柱上反射分布会明显受到纤维排列方向的牵引。这个现象在光学上叫各向异性反映到画面里就是我们看到的那条被压扁的、沿纤维方向流动的高光。默认BRDF里的D项只依赖NdotH——微表面法线与半角向量的点积——根本不关心入射光是从哪个方位角打在纤维上。因此无论材质参数调多高高光形态始终是一个圆对称的分布自然不可能出现拉丝感。1.2 拆成两条粗糙度轴Gather方向的几何含义各向异性GGX解决这个问题的方法很直接把原来一个粗糙度参数拆成两个分别控制沿纤维方向和跨纤维方向的微表面分布。这里借用我习惯的说法一个叫“顺滑轴”一个叫“阻力轴”。顺着纤维走表面起伏平缓粗糙度小横跨纤维走会不断越过纤维凸起粗糙度大。两个轴的粗糙度差距越大高光椭圆被拉得越长。公式可以简化为ax roughness * (1 anisotropy)ay roughness * (1 - anisotropy)anisotropy在-1到1之间0时两个轴相等回到普通各向同性。anisotropy为正时ax大于ay为负时两个轴对调高光方向也就跟着旋转90度。实际调试时如果感觉高光方向反了不用改模型直接把这个参数乘以-1就能快速验证这个习惯帮我省了很多时间。1.3 丝绸是介电质菲涅尔和漫反射不能省做材质不能只看高光形状。丝绸本质上是介电材料F0非常低大约0.04。这意味着它的大部分反射来自漫反射高光只是建立在漫反射之上的一层薄薄的丝质光润。如果Shader里只保留镜面高光即使各向异性写对了看起来也像镀了膜。真实的桑蚕丝表面还有淡淡的半透明感非高光区域会透出底色高光区域则带一点冷白或象牙白的偏移。要实现这种层次需要在Diffuse和高光两部分同时处理。2. 动手前准备URP工程、测试布和问题定位技巧2.1 为什么选URP而不是直接用HDRP现成参数HDRP的Lit材质面板里自带Anisotropy开关拖一下就能出丝绸效果。如果你做的是PC或主机项目转HDRP确实最省事。但多数项目的实际处境是URP管线尤其是移动端、微信小游戏、数字孪生这类轻量场景URP没有现成各向异性选项只能自己写Shader。这篇文章以Unity 2022.3 LTS搭配URP 14.0为例代码里只依赖URP自带的HLSL库降级或升级版本时注意API变更即可。2.2 测试模型别用可卡裆的复杂网格调各向异性材质时测试模型的选取直接决定调试效率。建议初期只用两种模型一个细分平面一个圆柱。平面的UV是干净的横平竖直可以从俯视角直接观察高光椭圆与切线方向的关系圆柱则能绕一圈检查高光在各朝向下的连续性。不要一上来就套到角色衣服上那样无法判断是高光方向写错了还是模型切线本身乱。模型导入Unity后会自动生成切线但各家DCC工具导出时有时会把切线W值标反导致相邻三角形之间高光方向跳变。遇到这种情况可以在导入器里重新计算切线或者更换模型源。要检查切线方向是否正确可以写一个临时Pass直接把世界切线输出成颜色观察这一步在后面的排查中非常关键。2.3 为什么不用ShaderGraph而直接写HLSLShaderGraph里没有一个完整的各向异性GGX节点要实现必须塞Custom Function节点把一堆代码藏在小方框里调起来反而不如直接看HLSL直观。而且如果你打算把这个Shader用在多个渲染管线上手写一份代码的移植成本更低。整个着色器中涉及的核心函数不超过三个结构非常短理解起来并没有想象中困难。2.4 URP手写材质的工程注意事项URP下自定义Shader有最小标签要求。SubShader的Tags必须包含RenderPipelineUniversalPipeline否则URP会按旧管线逻辑处理。Queue设成GeometryRenderType设为Opaque这样能避免SRP Batcher报错。如果你项目开了SRP Batcher要注意Properties里的变量要放在CBUFFER里包括颜色、粗糙度、各向异性这些逐材质参数这一点在后面的完整代码里已经处理好了。3. 核心Shader实现各向异性GGX从公式到代码3.1 先重建副切线再做切线旋转在Shader里顶点着色器需要把对象空间的法线、切线、位置转换到世界空间。切线是float4其中w分量保存了副切线方向的符号。副切线由法线叉乘切线再乘以w得到float3 B normalize(cross(N, T)) * IN.tangentWS.w;这个w极其重要。模型上一个封闭曲面上如果某处三角形tagent从顺时针变成逆时针w的符号会修正副切线的方向保证TBN坐标系始终一致。漏了这一步高光会在接缝处跳来跳去呈现破碎的亮斑。许多织物并不是完全横平竖直的织法斜纹、人字纹这些纹理需要高光轴发生旋转。所以我在Shader里加了一个_AnisoRotation参数用来对切线在切平面内做旋转这样不用改模型就能把高光方向旋转任意角度。3.2 各向异性GGX的D项一条简洁的数学表达各向异性GGX的D项可以写成D NdotH² / (π * ax * ay * ( (TdotH / ax)² (BdotH / ay)² NdotH² )² )其中TdotH和BdotH分别是半角向量在切线和副切线方向上的投影。分母中的两项正是在分别计算两个方向上的微表面分布权重。粗糙度大的方向会有更大的分母高光向该方向扩散拉长。函数实现float D_GGX_Aniso(float NdotH, float TdotH, float BdotH, float ax, float ay) { float denom (TdotH * TdotH) / (ax * ax) (BdotH * BdotH) / (ay * ay) NdotH * NdotH; float D (NdotH * NdotH) / (3.14159265 * ax * ay * denom * denom); return D; }代码很短但能撑起整个各向异性高光效果。实际写的时候要注意ax和ay不能太小否则分母趋近于0会出现高光爆亮成白点的情况后面会说到这个坑。3.3 完整Shader代码和关键行解析下面是可以在URP里直接使用的完整ShaderShader Custom/AnisoFabric { Properties { _BaseColor (Base Color, Color) (0.95, 0.92, 0.85, 1) _Smoothness (Smoothness, Range(0, 1)) 0.3 _Anisotropy (Anisotropy, Range(-1, 1)) 0.6 _AnisoRotation (Aniso Rotation, Range(0, 3.14159)) 0.0 } SubShader { Tags { RenderType Opaque RenderPipeline UniversalPipeline Queue Geometry } Pass { HLSLPROGRAM #pragma vertex vert #pragma fragment frag #include Packages/com.unity.render-pipelines.universal/ShaderLibrary/Core.hlsl #include Packages/com.unity.render-pipelines.universal/ShaderLibrary/Lighting.hlsl struct Attributes { float4 positionOS : POSITION; float3 normalOS : NORMAL; float4 tangentOS : TANGENT; float2 uv : TEXCOORD0; }; struct Varyings { float4 posCS : SV_POSITION; float3 posWS : TEXCOORD0; float3 normalWS : TEXCOORD1; float4 tangentWS : TEXCOORD2; float2 uv : TEXCOORD3; }; CBUFFER_START(UnityPerMaterial) float4 _BaseColor; float _Smoothness; float _Anisotropy; float _AnisoRotation; CBUFFER_END Varyings vert (Attributes v) { Varyings o; o.posWS TransformObjectToWorld(v.positionOS.xyz); o.posCS TransformWorldToHClip(o.posWS); o.normalWS TransformObjectToWorldNormal(v.normalOS); o.tangentWS.xyz TransformObjectToWorldDir(v.tangentOS.xyz); o.tangentWS.w v.tangentOS.w; o.uv v.uv; return o; } float D_GGX_Aniso (float NdotH, float TdotH, float BdotH, float ax, float ay) { float denom (TdotH * TdotH) / (ax * ax) (BdotH * BdotH) / (ay * ay) NdotH * NdotH; float D (NdotH * NdotH) / (3.14159265 * ax * ay * denom * denom); return D; } half4 frag (Varyings IN) : SV_Target { float3 N normalize(IN.normalWS); float3 V normalize(_WorldSpaceCameraPos - IN.posWS); float3 T normalize(IN.tangentWS.xyz); float3 B normalize(cross(N, T)) * IN.tangentWS.w; float sinR, cosR; sincos(_AnisoRotation, sinR, cosR); T normalize(T * cosR - B * sinR); Light mainLight GetMainLight(); float3 L normalize(mainLight.direction); float3 H normalize(L V); float NdotL saturate(dot(N, L)); float NdotV saturate(dot(N, V)); float NdotH saturate(dot(N, H)); float VdotH saturate(dot(V, H)); float TdotH dot(T, H); float BdotH dot(B, H); float roughness 1.0 - _Smoothness; roughness max(roughness * roughness, 0.03); float ax max(roughness * (1.0 _Anisotropy), 0.02); float ay max(roughness * (1.0 - _Anisotropy), 0.02); float D D_GGX_Aniso(NdotH, TdotH, BdotH, ax, ay); float G 1.0; float F0 0.04; float3 F F0 (1.0 - F0) * pow(1.0 - VdotH, 5); float3 diffuse _BaseColor.rgb * NdotL; float3 specular mainLight.color * D * F * G * NdotL; float3 finalColor diffuse specular; return half4(finalColor, 1.0); } ENDHLSL } } }几个关键点说一下。首先_Smoothness是线性参数被我转回roughness后再平方一次。这种映射更贴近感知均匀性直接让smoothness取0.3左右时不会出现太亮的塑料点。第二ax和ay的下限设成0.02是为了防止极端的anisotropy把某一个轴压成0导致高光无限窄最终产生刺眼的闪烁。第三代码里的几何遮蔽项G暂时给的是1这是刻意为之。调各向异性的第一步是确认高光形状正确其他项先别加进来干扰判断。等方向对了再补G项会容易得多。3.4 为什么要把漫反射和高光分开处理丝质高光绝不是浮在表面的白斑它是和漫反射颜色有层次关系的。这段代码里漫反射直接用了_BaseColor.rgb * NdotL高光部分通过菲涅尔项抬高了大角度观察时的反应。实际渲染中高光强度要控制在一个能让材质颜色透出来的范围。如果高光比漫反射强太多丝绸会变成乳白色塑料如果太弱又完全看不到丝光。这里的平衡点主要靠_Smoothness和_Anisotropy配合控制下一节详细说调参。3.5 关于切线方向正负和高光方向的经验细心的人会在模型上发现一个现象同一块布料有的面高光看起来从左往右拉有的面却上下拉这通常不是代码问题而是模型的UV方向不统一。各向异性高光轴默认绑定在切线方向上而切线由模型顶点的UV方向生成。如果你的曲面模型展UV时有的U方向指向左有的指向上高光自然会在两个区段里方向不一致。想要全局统一要么重新展UV要么在材质里通过_AnisoRotation配合法线方向做修正。光线最终是视觉结果先确认参考图里高光方向应该是顺着经线还是纬线再决定怎么处理模型。4. 调参实录把“金属涂料”变成真正的“桑蚕丝”4.1 一张参数表对照不同织物质感以下是我在一周内反复对照参考图后归纳的经验值适合丝绸、缎面和绒面三类常见面料起步。参数丝绸参考值缎面参考值绒面参考值说明_Smoothness0.2~0.40.5~0.70.1~0.2绒面毛绒结构会打散高光_Anisotropy0.4~0.80.2~0.50.4~0.6数值越大高光拉得越长_AnisoRotation视织纹方向视织纹方向视织纹方向45度斜纹布需要相关数值_BaseColor偏暖白高饱和鲜艳色深色或低饱和丝绸底色不能太灰菲涅尔F00.040.04~0.050.04绒面边缘会有轻微反光实际项目里没有绝对正确值我的建议是先用丝绸参数把一个空场景调到满意再应用到实际模型上微调。这样能快速判断问题出在材质参数还是模型UV上。4.2 调高光形状从圆斑到长条的过程在平面测试材质时可以先把场景里的光源调成单方向平行光视角摆成45度左右观察高光形状。如果看到的是一个圆斑说明anisotropy没有生效或者aya和ax被后来代码重置了。如果看到一条线状高光说明两个轴的粗糙度差距过大可以适当降低anisotropy。如果高光是一条但方向完全不对比如参考图的高光应该是横向的实际却是纵向那么把anisotropy乘以-1就好。这个方向性的调试最好配合前面提到过的切线可视化Pass一起做。把世界切线输出成颜色后你能直观看到哪个区域切线方向是乱的再比对高光的区域就能确定裂纹来源。4.3 环境光照和反射探针的影响各向异性高光对粗糙度很敏感对环境光同样敏感。在URP里如果场景没有反射探针PBR材质的间接光会显得比较平丝绸的“油润感”会被削弱。建议在测试场景放一个覆盖主要视区的反射探针强一些也无所谓。丝绸在暗环境下其实很容易被光线吃细节增加一个半球光或者环境光强度往往比继续在材质参数里抠细节更有效。4.4 常规关卡主光的方向和角色的朝向在角色服饰上做丝绸材质时主光方向和高光方向之间的关系非常重要。丝绸的高光会顺着纤维方向滚动因此角色转身时高光会像流水一样改变位置。建议主光不要放在正前方而是放在侧上方45度左右这样各向异性高光最容易被看到。如果角色是站桩展示可以微调反射探针的位置来控制高光的节奏而不是只改材质球。5. 实际踩坑记录从切线翻转到碎片高光的排查链路5.1 问题一高光方向在模型接缝处明显断裂第一天试用时我把Shader套在一个有袖口接缝的模型上发现袖子中段有一条垂直的亮线分割了光线方向左边高光横向右边高光纵向。我第一反应是anisotropy参数写错了但把参数来回切换问题始终在同一个位置。后来一步步排查才发现是模型导入时自动生成的切线在接缝处方向不一致。排查过程是这样的先在材质上临时把高光关掉只留漫反射确认问题不在光照。然后写了一个输出切线颜色的调试Pass把WorldTangent经*0.50.5转成颜色渲染出来结果接缝两侧一边偏红一边偏蓝说明切线旋转方向发生了跳变。最终解决方法是让美术在DCC工具里统一扫描线方向重新展UV具体来说就是保证U方向和织物的经线方向对齐。如果你的模型是程序化生成的则需要在生成代码里根据每根纤维的走向重新赋予顶点切线。5.2 问题二高光变成“碎玻璃”状的小白点另一个麻烦是在某些角度下高光不是干净的长条而是碎裂成一堆密密麻麻的小白点。这个问题在像素密集的地方尤其明显比如袖口的褶皱。排查后发现原因是当NdotH接近0时GGX公式里分母的某个部分会变得很大而我又没有几何遮蔽项导致零星像素出现极亮的高光。解决方法是两件一是把ax和ay的下限从0.001提高到0.02虽然看起来只是很小的数字变化但能有效避免极致的高光闪烁二是加入一个简单的Smith-G近似即使在边缘区域也不会出现残暴的亮点。我这里给一个基础的G函数实现float G_SmithSchlick(float NdotV, float NdotL, float k) { float gv NdotV / (NdotV * (1.0 - k) k); float gl NdotL / (NdotL * (1.0 - k) k); return gv * gl; }k的值取roughness * 0.5即可。实际测试后碎点问题几乎消失同时高光的形状没有被破坏。5.3 问题三移动端渲染结果泛白在编辑器里调得好好的丝绸材质打包到部分安卓机上居然泛白高光像蒙了一层雾。最初怀疑是Gamma/SRGB设置问题但工程一直用的Linear色彩空间。后来定位到是移动端GPU对pow函数的精度处理不一致。在部分GPU上pow(1 - VdotH, 5)的结果不够稳定导致边缘菲涅尔过曝。最简单的绕行办法是把菲涅尔计算从pow改成近似表达例如F F0 (1 - F0) * exp2(-5.55473 * VdotH - 6.98316) * VdotH。这个公式在大多数GPU上表现一致几乎不影响视觉效果。同时把Shader内变量的精度从float降为half也能提升移动端效率。5.4 问题四开启雾效后高光被吃掉URP场景里开了指数雾的话远处物体的高光会被雾色完全压掉丝绸材质看起来死气沉沉。这个不完全是材质问题但会影响调参判断。如果你是远景展示建议在材质CustomData里加入雾效开关或者单独做一套不含雾效的远景Shader。我最终方案是给这个丝绸Shader关闭雾效因为在布料特写上雾效给视觉带来的破坏远大于它提供的深度信息。6. 从丝绸扩展到缎面、绒布的几点经验6.1 双层高光让效果更接近真实缎面真实丝绸面料并不是单一反射它同时包含表层纤维的镜面反射和内层纤维的散射。为了模拟这个层次可以在最终颜色上混合两层高光一层各向异性高光沿切线方向另一层强度稍弱、旋转角度不同。重点不是让两层高光独立存在而是要找到一个遮罩或者权重来控制它们的混合。如果布料有明显的图案比如提花或者印花遮罩可以用贴图的alpha通道来控制高光强度和方向。我的实践中双层高光很适合做缎面底层窄高光保留“水润感”第二层宽高光负责“柔和过渡”两者相加后就变成高级绸缎那种流动的光感。6.2 绒布的思路不能直接套用丝绸参数天鹅绒、丝绒这种材质的特点是表面粗糙且带有方向性绒毛高光通常只出现在绒毛倒伏的边缘。如果用丝绸的高光参数去调效果会显得很脏。比较稳的做法是降低Smoothness到0.1左右同时让anisotropy数值偏大让高光呈现成很窄的边线光再叠加一层菲涅尔边缘光。此外丝绸和绒布在间接光处理上区别很大绒布几乎需要额外做一层遮罩来控制环境光强度否则绒毛部分会过亮。6.3 配合游戏场景优化不要把所有布料都做成一个材质在项目实战中除非是主角特写否则不要给每块布都配一套单独的丝绸材质。我的习惯是做三个预设版本远景版、中景版、近景特写版。远景版只需要保留漫反射和一条简单的高光性能开销低近景版才启用完整的各向异性GGX并可加反射探针的镜面反射。这样一来既保证了视觉品质又不会把移动端性能拖垮。6.4 性能优化的两个实测经验第一各向异性高光本身并不比普通GGX昂贵多少真正吃性能的是你为了追求效果额外加的法线贴图采样和副切线计算。如果目标平台是中低端手机建议不要加法线贴图而是用简单的顶点扰动或噪声让高光更自然。第二这个Shader建议配合Unity的SRP Batcher只要把参数放到CBUFFER里合批的效率会明显好于一个个材质球各自Pass。实测下来一个包含四个材质的披风模型打开SRP Batcher后DrawCall可以降到原来的三分之一。7. 最后一点心得想调好丝绸先忘掉参数想清楚光线怎么在纤维上滚动敲代码之前我建议你先去灯光下面观察一块真实的布料或者在网上找高清丝绸特写视频。看它高光是如何随角度改变的看它的阴影边缘是被压扁的还是发散的。这些东西理解清楚了再回来看这里的公式你会发现每个参数都有对应的视觉意义而不是一堆调来调去的滑块。调试时有一个便宜有效的办法把材质球放在一个带天空盒的空场景里用手电筒式的平行光绕它旋转。这样能最快暴露高光方向、宽度和反射强度的问题比在复杂场景里反复切视角高效得多。我也习惯于在一次调试中只变更一个参数并记录这样能建立自己的参数感觉数据库。这个Shader离商业项目里的最终丝绸材质还有一段距离但作为从零理解各向异性高光的起点应该足够用了。后续如果你想升级可以给它加上法线贴图支持、多层高光混合、URP全链路光照的阴影采样以及更准确的微表面遮蔽。希望这篇记录能帮你把Unity里那块“琴弦上滑动的高光”稳稳做出来。
“丝绸的高光”放在Unity里为什么这么难调我摸索的结果是默认PBR材质根本做不出那种流动的、会随角度改变方向的丝光。上周做披风项目时我把URP的Lit、Built-in的Standard来回拖参数高光始终是塑料式的圆点或者一整片油亮直到我放弃默认材质自己写了一个带各向异性GGX的Shader才终于把那种沿纤维方向被拉开的丝质光泽还原出来。这篇文章把从物理原理到最终Shader实现的完整过程记录下来包括可复制的代码和调试坑。如果你在Unity里做丝绸、缎面这类布料或者想深入理解PBR微表面模型里各向异性的含义这篇应该能帮你少走很多弯路。1. 丝绸为什么“油光却不塑料”问题出在默认PBR的方向假设上1.1 微表面模型里被忽略的“方位角”PBR微表面模型的基本想法是把表面看作无数朝向各异的微小镜面每个微表面根据自身法线对光照做反射最终结果是所有微表面的统计叠加。这个模型在金属、塑料、石头这些材质上表现良好因为它们表面的微观凸起方向没有偏好——转了90度统计特征还是一样可以叫它各向同性。但丝绸不一样。织物的微观结构是一根根基本平行的纤维每根纤维近似一个小圆柱。光打在圆柱上反射分布会明显受到纤维排列方向的牵引。这个现象在光学上叫各向异性反映到画面里就是我们看到的那条被压扁的、沿纤维方向流动的高光。默认BRDF里的D项只依赖NdotH——微表面法线与半角向量的点积——根本不关心入射光是从哪个方位角打在纤维上。因此无论材质参数调多高高光形态始终是一个圆对称的分布自然不可能出现拉丝感。1.2 拆成两条粗糙度轴Gather方向的几何含义各向异性GGX解决这个问题的方法很直接把原来一个粗糙度参数拆成两个分别控制沿纤维方向和跨纤维方向的微表面分布。这里借用我习惯的说法一个叫“顺滑轴”一个叫“阻力轴”。顺着纤维走表面起伏平缓粗糙度小横跨纤维走会不断越过纤维凸起粗糙度大。两个轴的粗糙度差距越大高光椭圆被拉得越长。公式可以简化为ax roughness * (1 anisotropy)ay roughness * (1 - anisotropy)anisotropy在-1到1之间0时两个轴相等回到普通各向同性。anisotropy为正时ax大于ay为负时两个轴对调高光方向也就跟着旋转90度。实际调试时如果感觉高光方向反了不用改模型直接把这个参数乘以-1就能快速验证这个习惯帮我省了很多时间。1.3 丝绸是介电质菲涅尔和漫反射不能省做材质不能只看高光形状。丝绸本质上是介电材料F0非常低大约0.04。这意味着它的大部分反射来自漫反射高光只是建立在漫反射之上的一层薄薄的丝质光润。如果Shader里只保留镜面高光即使各向异性写对了看起来也像镀了膜。真实的桑蚕丝表面还有淡淡的半透明感非高光区域会透出底色高光区域则带一点冷白或象牙白的偏移。要实现这种层次需要在Diffuse和高光两部分同时处理。2. 动手前准备URP工程、测试布和问题定位技巧2.1 为什么选URP而不是直接用HDRP现成参数HDRP的Lit材质面板里自带Anisotropy开关拖一下就能出丝绸效果。如果你做的是PC或主机项目转HDRP确实最省事。但多数项目的实际处境是URP管线尤其是移动端、微信小游戏、数字孪生这类轻量场景URP没有现成各向异性选项只能自己写Shader。这篇文章以Unity 2022.3 LTS搭配URP 14.0为例代码里只依赖URP自带的HLSL库降级或升级版本时注意API变更即可。2.2 测试模型别用可卡裆的复杂网格调各向异性材质时测试模型的选取直接决定调试效率。建议初期只用两种模型一个细分平面一个圆柱。平面的UV是干净的横平竖直可以从俯视角直接观察高光椭圆与切线方向的关系圆柱则能绕一圈检查高光在各朝向下的连续性。不要一上来就套到角色衣服上那样无法判断是高光方向写错了还是模型切线本身乱。模型导入Unity后会自动生成切线但各家DCC工具导出时有时会把切线W值标反导致相邻三角形之间高光方向跳变。遇到这种情况可以在导入器里重新计算切线或者更换模型源。要检查切线方向是否正确可以写一个临时Pass直接把世界切线输出成颜色观察这一步在后面的排查中非常关键。2.3 为什么不用ShaderGraph而直接写HLSLShaderGraph里没有一个完整的各向异性GGX节点要实现必须塞Custom Function节点把一堆代码藏在小方框里调起来反而不如直接看HLSL直观。而且如果你打算把这个Shader用在多个渲染管线上手写一份代码的移植成本更低。整个着色器中涉及的核心函数不超过三个结构非常短理解起来并没有想象中困难。2.4 URP手写材质的工程注意事项URP下自定义Shader有最小标签要求。SubShader的Tags必须包含RenderPipelineUniversalPipeline否则URP会按旧管线逻辑处理。Queue设成GeometryRenderType设为Opaque这样能避免SRP Batcher报错。如果你项目开了SRP Batcher要注意Properties里的变量要放在CBUFFER里包括颜色、粗糙度、各向异性这些逐材质参数这一点在后面的完整代码里已经处理好了。3. 核心Shader实现各向异性GGX从公式到代码3.1 先重建副切线再做切线旋转在Shader里顶点着色器需要把对象空间的法线、切线、位置转换到世界空间。切线是float4其中w分量保存了副切线方向的符号。副切线由法线叉乘切线再乘以w得到float3 B normalize(cross(N, T)) * IN.tangentWS.w;这个w极其重要。模型上一个封闭曲面上如果某处三角形tagent从顺时针变成逆时针w的符号会修正副切线的方向保证TBN坐标系始终一致。漏了这一步高光会在接缝处跳来跳去呈现破碎的亮斑。许多织物并不是完全横平竖直的织法斜纹、人字纹这些纹理需要高光轴发生旋转。所以我在Shader里加了一个_AnisoRotation参数用来对切线在切平面内做旋转这样不用改模型就能把高光方向旋转任意角度。3.2 各向异性GGX的D项一条简洁的数学表达各向异性GGX的D项可以写成D NdotH² / (π * ax * ay * ( (TdotH / ax)² (BdotH / ay)² NdotH² )² )其中TdotH和BdotH分别是半角向量在切线和副切线方向上的投影。分母中的两项正是在分别计算两个方向上的微表面分布权重。粗糙度大的方向会有更大的分母高光向该方向扩散拉长。函数实现float D_GGX_Aniso(float NdotH, float TdotH, float BdotH, float ax, float ay) { float denom (TdotH * TdotH) / (ax * ax) (BdotH * BdotH) / (ay * ay) NdotH * NdotH; float D (NdotH * NdotH) / (3.14159265 * ax * ay * denom * denom); return D; }代码很短但能撑起整个各向异性高光效果。实际写的时候要注意ax和ay不能太小否则分母趋近于0会出现高光爆亮成白点的情况后面会说到这个坑。3.3 完整Shader代码和关键行解析下面是可以在URP里直接使用的完整ShaderShader Custom/AnisoFabric { Properties { _BaseColor (Base Color, Color) (0.95, 0.92, 0.85, 1) _Smoothness (Smoothness, Range(0, 1)) 0.3 _Anisotropy (Anisotropy, Range(-1, 1)) 0.6 _AnisoRotation (Aniso Rotation, Range(0, 3.14159)) 0.0 } SubShader { Tags { RenderType Opaque RenderPipeline UniversalPipeline Queue Geometry } Pass { HLSLPROGRAM #pragma vertex vert #pragma fragment frag #include Packages/com.unity.render-pipelines.universal/ShaderLibrary/Core.hlsl #include Packages/com.unity.render-pipelines.universal/ShaderLibrary/Lighting.hlsl struct Attributes { float4 positionOS : POSITION; float3 normalOS : NORMAL; float4 tangentOS : TANGENT; float2 uv : TEXCOORD0; }; struct Varyings { float4 posCS : SV_POSITION; float3 posWS : TEXCOORD0; float3 normalWS : TEXCOORD1; float4 tangentWS : TEXCOORD2; float2 uv : TEXCOORD3; }; CBUFFER_START(UnityPerMaterial) float4 _BaseColor; float _Smoothness; float _Anisotropy; float _AnisoRotation; CBUFFER_END Varyings vert (Attributes v) { Varyings o; o.posWS TransformObjectToWorld(v.positionOS.xyz); o.posCS TransformWorldToHClip(o.posWS); o.normalWS TransformObjectToWorldNormal(v.normalOS); o.tangentWS.xyz TransformObjectToWorldDir(v.tangentOS.xyz); o.tangentWS.w v.tangentOS.w; o.uv v.uv; return o; } float D_GGX_Aniso (float NdotH, float TdotH, float BdotH, float ax, float ay) { float denom (TdotH * TdotH) / (ax * ax) (BdotH * BdotH) / (ay * ay) NdotH * NdotH; float D (NdotH * NdotH) / (3.14159265 * ax * ay * denom * denom); return D; } half4 frag (Varyings IN) : SV_Target { float3 N normalize(IN.normalWS); float3 V normalize(_WorldSpaceCameraPos - IN.posWS); float3 T normalize(IN.tangentWS.xyz); float3 B normalize(cross(N, T)) * IN.tangentWS.w; float sinR, cosR; sincos(_AnisoRotation, sinR, cosR); T normalize(T * cosR - B * sinR); Light mainLight GetMainLight(); float3 L normalize(mainLight.direction); float3 H normalize(L V); float NdotL saturate(dot(N, L)); float NdotV saturate(dot(N, V)); float NdotH saturate(dot(N, H)); float VdotH saturate(dot(V, H)); float TdotH dot(T, H); float BdotH dot(B, H); float roughness 1.0 - _Smoothness; roughness max(roughness * roughness, 0.03); float ax max(roughness * (1.0 _Anisotropy), 0.02); float ay max(roughness * (1.0 - _Anisotropy), 0.02); float D D_GGX_Aniso(NdotH, TdotH, BdotH, ax, ay); float G 1.0; float F0 0.04; float3 F F0 (1.0 - F0) * pow(1.0 - VdotH, 5); float3 diffuse _BaseColor.rgb * NdotL; float3 specular mainLight.color * D * F * G * NdotL; float3 finalColor diffuse specular; return half4(finalColor, 1.0); } ENDHLSL } } }几个关键点说一下。首先_Smoothness是线性参数被我转回roughness后再平方一次。这种映射更贴近感知均匀性直接让smoothness取0.3左右时不会出现太亮的塑料点。第二ax和ay的下限设成0.02是为了防止极端的anisotropy把某一个轴压成0导致高光无限窄最终产生刺眼的闪烁。第三代码里的几何遮蔽项G暂时给的是1这是刻意为之。调各向异性的第一步是确认高光形状正确其他项先别加进来干扰判断。等方向对了再补G项会容易得多。3.4 为什么要把漫反射和高光分开处理丝质高光绝不是浮在表面的白斑它是和漫反射颜色有层次关系的。这段代码里漫反射直接用了_BaseColor.rgb * NdotL高光部分通过菲涅尔项抬高了大角度观察时的反应。实际渲染中高光强度要控制在一个能让材质颜色透出来的范围。如果高光比漫反射强太多丝绸会变成乳白色塑料如果太弱又完全看不到丝光。这里的平衡点主要靠_Smoothness和_Anisotropy配合控制下一节详细说调参。3.5 关于切线方向正负和高光方向的经验细心的人会在模型上发现一个现象同一块布料有的面高光看起来从左往右拉有的面却上下拉这通常不是代码问题而是模型的UV方向不统一。各向异性高光轴默认绑定在切线方向上而切线由模型顶点的UV方向生成。如果你的曲面模型展UV时有的U方向指向左有的指向上高光自然会在两个区段里方向不一致。想要全局统一要么重新展UV要么在材质里通过_AnisoRotation配合法线方向做修正。光线最终是视觉结果先确认参考图里高光方向应该是顺着经线还是纬线再决定怎么处理模型。4. 调参实录把“金属涂料”变成真正的“桑蚕丝”4.1 一张参数表对照不同织物质感以下是我在一周内反复对照参考图后归纳的经验值适合丝绸、缎面和绒面三类常见面料起步。参数丝绸参考值缎面参考值绒面参考值说明_Smoothness0.2~0.40.5~0.70.1~0.2绒面毛绒结构会打散高光_Anisotropy0.4~0.80.2~0.50.4~0.6数值越大高光拉得越长_AnisoRotation视织纹方向视织纹方向视织纹方向45度斜纹布需要相关数值_BaseColor偏暖白高饱和鲜艳色深色或低饱和丝绸底色不能太灰菲涅尔F00.040.04~0.050.04绒面边缘会有轻微反光实际项目里没有绝对正确值我的建议是先用丝绸参数把一个空场景调到满意再应用到实际模型上微调。这样能快速判断问题出在材质参数还是模型UV上。4.2 调高光形状从圆斑到长条的过程在平面测试材质时可以先把场景里的光源调成单方向平行光视角摆成45度左右观察高光形状。如果看到的是一个圆斑说明anisotropy没有生效或者aya和ax被后来代码重置了。如果看到一条线状高光说明两个轴的粗糙度差距过大可以适当降低anisotropy。如果高光是一条但方向完全不对比如参考图的高光应该是横向的实际却是纵向那么把anisotropy乘以-1就好。这个方向性的调试最好配合前面提到过的切线可视化Pass一起做。把世界切线输出成颜色后你能直观看到哪个区域切线方向是乱的再比对高光的区域就能确定裂纹来源。4.3 环境光照和反射探针的影响各向异性高光对粗糙度很敏感对环境光同样敏感。在URP里如果场景没有反射探针PBR材质的间接光会显得比较平丝绸的“油润感”会被削弱。建议在测试场景放一个覆盖主要视区的反射探针强一些也无所谓。丝绸在暗环境下其实很容易被光线吃细节增加一个半球光或者环境光强度往往比继续在材质参数里抠细节更有效。4.4 常规关卡主光的方向和角色的朝向在角色服饰上做丝绸材质时主光方向和高光方向之间的关系非常重要。丝绸的高光会顺着纤维方向滚动因此角色转身时高光会像流水一样改变位置。建议主光不要放在正前方而是放在侧上方45度左右这样各向异性高光最容易被看到。如果角色是站桩展示可以微调反射探针的位置来控制高光的节奏而不是只改材质球。5. 实际踩坑记录从切线翻转到碎片高光的排查链路5.1 问题一高光方向在模型接缝处明显断裂第一天试用时我把Shader套在一个有袖口接缝的模型上发现袖子中段有一条垂直的亮线分割了光线方向左边高光横向右边高光纵向。我第一反应是anisotropy参数写错了但把参数来回切换问题始终在同一个位置。后来一步步排查才发现是模型导入时自动生成的切线在接缝处方向不一致。排查过程是这样的先在材质上临时把高光关掉只留漫反射确认问题不在光照。然后写了一个输出切线颜色的调试Pass把WorldTangent经*0.50.5转成颜色渲染出来结果接缝两侧一边偏红一边偏蓝说明切线旋转方向发生了跳变。最终解决方法是让美术在DCC工具里统一扫描线方向重新展UV具体来说就是保证U方向和织物的经线方向对齐。如果你的模型是程序化生成的则需要在生成代码里根据每根纤维的走向重新赋予顶点切线。5.2 问题二高光变成“碎玻璃”状的小白点另一个麻烦是在某些角度下高光不是干净的长条而是碎裂成一堆密密麻麻的小白点。这个问题在像素密集的地方尤其明显比如袖口的褶皱。排查后发现原因是当NdotH接近0时GGX公式里分母的某个部分会变得很大而我又没有几何遮蔽项导致零星像素出现极亮的高光。解决方法是两件一是把ax和ay的下限从0.001提高到0.02虽然看起来只是很小的数字变化但能有效避免极致的高光闪烁二是加入一个简单的Smith-G近似即使在边缘区域也不会出现残暴的亮点。我这里给一个基础的G函数实现float G_SmithSchlick(float NdotV, float NdotL, float k) { float gv NdotV / (NdotV * (1.0 - k) k); float gl NdotL / (NdotL * (1.0 - k) k); return gv * gl; }k的值取roughness * 0.5即可。实际测试后碎点问题几乎消失同时高光的形状没有被破坏。5.3 问题三移动端渲染结果泛白在编辑器里调得好好的丝绸材质打包到部分安卓机上居然泛白高光像蒙了一层雾。最初怀疑是Gamma/SRGB设置问题但工程一直用的Linear色彩空间。后来定位到是移动端GPU对pow函数的精度处理不一致。在部分GPU上pow(1 - VdotH, 5)的结果不够稳定导致边缘菲涅尔过曝。最简单的绕行办法是把菲涅尔计算从pow改成近似表达例如F F0 (1 - F0) * exp2(-5.55473 * VdotH - 6.98316) * VdotH。这个公式在大多数GPU上表现一致几乎不影响视觉效果。同时把Shader内变量的精度从float降为half也能提升移动端效率。5.4 问题四开启雾效后高光被吃掉URP场景里开了指数雾的话远处物体的高光会被雾色完全压掉丝绸材质看起来死气沉沉。这个不完全是材质问题但会影响调参判断。如果你是远景展示建议在材质CustomData里加入雾效开关或者单独做一套不含雾效的远景Shader。我最终方案是给这个丝绸Shader关闭雾效因为在布料特写上雾效给视觉带来的破坏远大于它提供的深度信息。6. 从丝绸扩展到缎面、绒布的几点经验6.1 双层高光让效果更接近真实缎面真实丝绸面料并不是单一反射它同时包含表层纤维的镜面反射和内层纤维的散射。为了模拟这个层次可以在最终颜色上混合两层高光一层各向异性高光沿切线方向另一层强度稍弱、旋转角度不同。重点不是让两层高光独立存在而是要找到一个遮罩或者权重来控制它们的混合。如果布料有明显的图案比如提花或者印花遮罩可以用贴图的alpha通道来控制高光强度和方向。我的实践中双层高光很适合做缎面底层窄高光保留“水润感”第二层宽高光负责“柔和过渡”两者相加后就变成高级绸缎那种流动的光感。6.2 绒布的思路不能直接套用丝绸参数天鹅绒、丝绒这种材质的特点是表面粗糙且带有方向性绒毛高光通常只出现在绒毛倒伏的边缘。如果用丝绸的高光参数去调效果会显得很脏。比较稳的做法是降低Smoothness到0.1左右同时让anisotropy数值偏大让高光呈现成很窄的边线光再叠加一层菲涅尔边缘光。此外丝绸和绒布在间接光处理上区别很大绒布几乎需要额外做一层遮罩来控制环境光强度否则绒毛部分会过亮。6.3 配合游戏场景优化不要把所有布料都做成一个材质在项目实战中除非是主角特写否则不要给每块布都配一套单独的丝绸材质。我的习惯是做三个预设版本远景版、中景版、近景特写版。远景版只需要保留漫反射和一条简单的高光性能开销低近景版才启用完整的各向异性GGX并可加反射探针的镜面反射。这样一来既保证了视觉品质又不会把移动端性能拖垮。6.4 性能优化的两个实测经验第一各向异性高光本身并不比普通GGX昂贵多少真正吃性能的是你为了追求效果额外加的法线贴图采样和副切线计算。如果目标平台是中低端手机建议不要加法线贴图而是用简单的顶点扰动或噪声让高光更自然。第二这个Shader建议配合Unity的SRP Batcher只要把参数放到CBUFFER里合批的效率会明显好于一个个材质球各自Pass。实测下来一个包含四个材质的披风模型打开SRP Batcher后DrawCall可以降到原来的三分之一。7. 最后一点心得想调好丝绸先忘掉参数想清楚光线怎么在纤维上滚动敲代码之前我建议你先去灯光下面观察一块真实的布料或者在网上找高清丝绸特写视频。看它高光是如何随角度改变的看它的阴影边缘是被压扁的还是发散的。这些东西理解清楚了再回来看这里的公式你会发现每个参数都有对应的视觉意义而不是一堆调来调去的滑块。调试时有一个便宜有效的办法把材质球放在一个带天空盒的空场景里用手电筒式的平行光绕它旋转。这样能最快暴露高光方向、宽度和反射强度的问题比在复杂场景里反复切视角高效得多。我也习惯于在一次调试中只变更一个参数并记录这样能建立自己的参数感觉数据库。这个Shader离商业项目里的最终丝绸材质还有一段距离但作为从零理解各向异性高光的起点应该足够用了。后续如果你想升级可以给它加上法线贴图支持、多层高光混合、URP全链路光照的阴影采样以及更准确的微表面遮蔽。希望这篇记录能帮你把Unity里那块“琴弦上滑动的高光”稳稳做出来。
