五彩斑斓的白—偏振彩色反射（镭射）

上周我们公司原画师画了一张很好看的镭射衣服原画，这个材质号称原画师一画就废的材质。BulingBuling的。我们原画师非常强，画的真好。看到后很有实现的欲望。于是我要挑战一下设计界甲方的最高难度，五彩斑斓黑的哥哥，五彩斑斓白。说了这么多，其实非常非常容易，核心代码就几句话的事情。我是在拾人牙慧。并且实现的方式也不止一种。

先上最后效果图

1 分析

首先我们先了解一下，这种效果会在哪里用到，比如：车漆的反射，泡泡，这种比较洋气的镭射衣服也会用到。但是镭射衣服一般外面还会有一层类似透明雨披的东西或者就是透明的。我这里没有现成的模型就没有去制作，要是想做的话把模型丢进MAX挤出一层也可以。

这里我找了一些五彩斑斓白的参考：

这个图让我想起来小时候外婆家猪圈棚就是这个纸

话说我也挺想做这种的，奈何没有找到类似的模型，自己又懒得做（其实是做的丑），只能找个裙子凑合凑合（所以说啊，美术大佬就非常重要）

这种的把猪圈棚纸当雨披穿的，颜色相对上面的比较饱和，类似UE4的HueShift节点

但是本文不是基于这个UE节点的算法制作的，这里就不去赘述。

2 思考

看完上面的图，那么问题来了，我们常见的泡泡是不是也是这种？没错，泡泡也可以认为是具有偏振彩色反射的。但是泡泡有一个更加洋气的名字，叫薄膜干涉。

感兴趣的同学可以去这个github库看看。

去年春节的时候我也实现过一个类似的，跟我有一年塑料朋友圈友情的朋友应该见到过。

仔细观察这种材质，大概就是彩虹色渐变+反光+透明（如果有的话），光的原理涉及到光的干涉。题外话，大家知道一根筷子进水和空气会发生一次折射，那么泡泡是一个闭合的球体，会发生两次折射。当然我们这里实现的是不透明的衣服，折射不在我们的考虑范围内，我们考虑反射就好。

首先我们想一下，这个不灵不灵的效果，和什么有关呢？灯光方向？视口方向？摄像机的位置？法线方向？

3 实现

对，其实都有关系，首先我们来讲解一下灯光方向，即世界空间的灯光方向，一个float3的向量，但是我们这里假设灯光是不变的就只有一盏光，光照模型中我们也假设是一个标准的PBS光照模型（如果讲清PBS真的要讲几天几夜，这里我就直接用的Unity标准的表面着色器，对标ASE的stanrad，毕竟本文重点是偏振幅彩色反射），向量具有方向性。视口方向同理，即显示生活中我们人眼的观察方向（需要归一化）。

这里的代码实现原理是用摄像机位置减去空间物体的位置得来的结果。

// 视觉方向v。即相机到物体的向量归一化。// 等价UnityWorldSpaceViewDir(mul(unity_ObjectToWorld,v.vertex))fixed viewDir = normalize(_WorldSpaceCameraPos.xyz - mul(unity_ObjectToWorld,v.vertex).xyz);

Unity为我们定义好了摄像机位置的参数，在UnityShaderVariables.cginc这个文件中我们可以查到

#define _WorldSpaceCameraPos unity_StereoWorldSpaceCameraPos[unity_StereoEyeIndex]

直接可以通过_WorldSpaceCameraPos 这个方法拿到对应的向量数据

节点版本：我们这里使用了摄像机位置和一个float值相乘，为什么？下面第二个Debug给大家看。再和世界空间法线点乘获得值

Debug（1）：

我们发现当我旋转视口的时候（即当前的摄像机位置产生了变化），颜色变化了。

然后我们将点乘的值给Cos函数后，再给一个蓝色。

Debug ：可以看到，当我移动摄像机位置和远近的时候，颜色会发生不同程度的偏移，当我缩放上面的Tile值时，蓝色部分重叠的也就更加频繁。

我想这里大家应该是可以理解的，我再解释一下：

摄像机位置距离越远，点乘值就会改变，而点乘是可以与float值相乘且满足交换律的。当我的值发生了变化，Cos也就发生了变化，cos是一个波浪弧线，当里面的自变量越大，弧线也就越密集。就会得到上面的效果。

那么我们对应的表面着色器代码应该怎么写呢？

（这里照顾一下新人能够实现效果，说了一下创建)

首先我们先创建一个表面着色器

创建后发现里面有代码，没错，里面已经预制了一个完整的PBS，我们只需要填充就好（当然，这里得解释一下，对于没有了解过UnityShader

机制的朋友来说，表面着色器完全是一个黑合。如果没有研究过PBR的实现方式，并不知道Unity到底帮我们做了什么。很方便，但是Pass和变体也很多）不过对练习和初学来说却非常好入门。

以下为全部代码：

Shader"Custom/CustomFilm"{Properties{_Metallic("Metallic",Range( 0 , 1)) = 1_ContrastMask1("ContrastMask1",Color) = (0,0,1,1)_Smoothness("Smoothness",Range( 0 , 1)) = 1_Tile("Tile",Float) = 1_MainTex("MainTex",2D) = "white" {}_MainColor("MainColor",Color) = (1,1,1,0)_MaskRgb("MaskRgb",Color) = (1,1,1,0)}SubShader{Tags{ "RenderType"="Opaque" }CGPROGRAM #pragma surface surf Standard fullforwardshadows #pragma target 3.0sampler2D_MainTex;structInput{float2uv_MainTex;float3worldNormal;};half_Smoothness;half_Metallic;half_Tile;half4_MainColor;half4_MaskRgb;half4_ContrastMask1;voidsurf (Input IN, inout SurfaceOutputStandard o){half3WorldNormal = normalize (IN.worldNormal);half3CameraPos = _WorldSpaceCameraPos * _Tile;half3DotPostion = dot (CameraPos,WorldNormal);half3Mask01 = saturate ( cos (DotPostion) * _ContrastMask1.rgb);half3CrossColor = cross (_ContrastMask1.rgb , float4(1,1,1,1));half3Mask02 = saturate ( sin (DotPostion) * CrossColor);half3AddMask = Mask01 + Mask02;halfRGBToGray = saturate ( 0.2989 * AddMask.r + 0.587 * AddMask.g + 0.114 * AddMask.b);half4c = tex2D (_MainTex, IN.uv_MainTex) * _MaskRgb;half3FinalColor = lerp (c , _MainColor , RGBToGray);o.Albedo = FinalColor.rgb;o.Metallic = _Metallic;o.Smoothness = _Smoothness;o.Alpha = 1;}ENDCG}FallBack"Diffuse"}

这个还是很容易的，我们首先去定义Properties内我们用到的所有东西