Shader - Hair & Fur

 Demo



Mesh

无论是头发材质还是毛发材质，它们的建模都是基于插片的方式，且每个片都是单面（Cull Off）

UV Layout

需要保证Kajiya-Kay高光流向的连续性，UV的布局要是统一且具有方向性的，每个网格片的UV区域重复覆盖。

Vertex Occlusion

通过烘焙保存在顶点颜色的环境光遮蔽，不同于使用AO贴图的方式。离线的烘焙可以计算出不同层级（插片）互相之间的遮挡关系。区别不同层级受到的环境光遮蔽，提升整个毛发渲染的阴影体积感。

Pass

渲染效果分为两个品质：
  • Alpha Test（适用中低性能的设备）
  • Alpha Test + Alpha Blend（适用高性能的设备）
两个Pass使用的都是同一张Alpha贴图。


Alpha Test

只有一个裁剪Pass，所有毛发的边缘都会被硬切，整个毛发的渲染效果就显得比较毛糙，完全没有柔软感。但是性能方面相对的比较好，写入了深度值，不会导致严重的Overdraw。

Alpha Blend

再加上一个混合Pass，每一根毛发的边缘都变成半透明状态，锯齿感会明显减少，整个毛发的渲染效果也会显得比较有柔软感。但是裁剪（Alpha Test）Pass必须作为基础，因为混合Pass要依赖它提前的深度写入来进行深度测试，从而避免出现错误的混合层级和顺序，还能减少大部分区域的Overdraw。另外一个需要注意的是，因为深度值精度的有限，同一个三角面的混合Pass和裁剪Pass可能会发生深度冲突。为了有正确的渲染效果，要让混合Pass始终能覆盖在裁剪Pass上。使用Shader提供的Offset设置渲染状态，能对混合Pass的深度值进行非常轻微的偏移，这样在不影响渲染效果（透视）的前提下避免了深度冲突。
混合Pass渲染状态：
Blend SrcAlpha OneMinusSrcAlpha
ZWrite Off
Offset 1, -1

Specular

https://web.engr.oregonstate.edu/~mjb/cs519/Projects/Papers/HairRendering.pdf
高光是各向异性的，它的流向是依据毛发的方向（顶点空间的切线或次切线）
镜面高光的D项是Kajiya-Kay，F项是Schlick，V项用常量0.25代替。

Kajiya-Kay

// Note: Kajiya-Kay is not energy conserving.
// We attempt at least some energy conservation by approximately normalizing Blinn-Phong NDF.
// We use the formulation with the NdotL.
// Note: this is Blinn-Phong, the original paper uses Phong.
real3 D_KajiyaKay(real3 T, real3 H, real specularExponent)
{
    real TdotH = dot(T, H);
    real sinTHSq = saturate(1.0 - TdotH * TdotH);

    real dirAttn = saturate(TdotH + 1.0);

    real n = specularExponent;
    real norm = (n + 2) * rcp(2 * PI);

    return dirAttn * norm * PositivePow(sinTHSq, 0.5 * n);
}

Dual Lobe

同时使用两个高光瓣，是为了模拟毛发的散射特性。通过Shift顶点空间的切线或次切线，可以分别偏移两个高光的流向，互相之间形成错位分布。
real3 ShiftTangent(real3 T, real3 N, real shift)
{
    return normalize(T + N * shift);
}
主高光是镜面反射造成的，高亮且没有色彩；次高光是散射特性造成的，相对较弱并带有色彩。

Flow Map

在某些特殊的用法或建模情况下，UV布局不能保证是连续的，顶点空间的切线不是连续的。这就会导致高光的流向也不能保持连续性，出现了断裂的情况。


使用Flow Map技术可以重新定义高光的流向，不再完全依赖顶点空间的切线方向。它的原理是通过使用贴图的两个通道，分别对切线方向和次切线方向产生偏移，最后计算出单位矢量和作为高光的流向。其中需要特别注意的是，LDR贴图的值范围是0 ~ 1，要把范围映射到-1 ~ 1后才能表达矢量方向的正反。
(1 - 2 * map.x) * tangent + (1 - 2 * map.y) * bitangent

评论

发表评论

此博客中的热门博文

Shader - Skin & SSS

图片
Demo Workflow 需要渲染出的特性： 毛孔造成细碎的高光现象 次表面散射造成的透光现象 金属工作流的高光参数只有光滑度，只能控制高光区域的聚集度。高光工作流的高光参数除了有光滑度，还有镜面反射率可以控制高光的反射量。渲染皮肤的方式适合使用高光工作流，可以更方便的控制高光的表现。 Specular Detail 毛孔需要有高精度的贴图来表现高频的反射凹凸变化。在限制了贴图尺寸的情况下，并且脸部通常会和身体放到一个贴图UV区域，脸部只占了其中的小部分区域。这些情况都会导致脸部的整体渲染精度不高，表达不出高频的毛孔凹凸的细节效果。 其中解决的一个思路是利用细节纹理的优势：Detail Map + Mask Map 细节纹理可以提供高频毛孔的镜面反射率，渲染出不规则凹凸的镜面反射高光效果。 上面从左往右的贴图分别是：Albedo Map，Smoothness Map，Specular Detail Map Direct Lighting & Specular Subsurface Scattering https://developer.nvidia.com/gpugems/gpugems3/part-iii-rendering/chapter-14-advanced-techniques-realistic-real-time-skin 实时次表面散射渲染技术主要分为纹理空间和屏幕空间，需要对贴图进行多次的高斯模糊处理和大量的贴图采样指令，这些都会在移动端造成很大的性能瓶颈。 下面介绍的两种散射实现方式，性能代价都是相对较小的，对于在移动端设备上的项目比较友好。 SSS Pre-integrated https://therealmjp.github.io/posts/sss-intro/ 预制作好散射的LUT贴图，将法线方向和光源方向的点积映射到贴图的U坐标，再添加一个曲线参数（Curvature）映射到贴图的V坐标。用映射后的UV坐标采样LUT贴图，替换BRDF中的漫反射项。 Direct Diffuse & Scattering SSS Back-facing 当观察的视角在模型的背光面时，散射会导致模型出现透光的效果，仿佛模型有略微的透明。 大白的身体出现略微的透光 从渲染微平面的角度分析，触发这个效果的条件是当光源和视角的方向相反，视线...
阅读全文

一个Mesh的半透明类型

图片
根据渲染管线在渲染半透明时的设定，会提前对所有的Mesh（材质）进行排序，然后依次渲染，即“画家算法”。 不同于特效的半透明类型，角色模型是三维立体并且可以水平旋转的，就算把模型拆分成多个Mesh（材质），利用管线去对所有Mesh排序，也可能得不到理想的半透明效果（比如Mesh有弯曲或穿插等情况）。角色模型有着复杂而不规则的结构和多层嵌套，半透明渲染的排序要求已经达到三角面的精度了。 感觉如果用基于排序的渲染技术去处理半透明，那渲染角色模型这种复杂的半透明效果，还是比较局限。 本文只讨论一个Mesh（材质）的半透明类型，根据半透明最多叠加的层数，总结成下面的几种类型： 预深度写入 https://docs.unity3d.com/2020.1/Documentation/Manual/SL-CullAndDepth.html 这个半透明渲染的技术方案，在Unity官方文档中也有提及。 技术理论：第一个Pass只写入深度，第二个Pass开启深度测试并进行正常渲染。那么离相机较远的片段就会被近的片段通过深度测试给剔除掉，这可以解决半透明的排序问题。 优势：解决了排序问题，几乎适用于所有类型的半透明情况 劣势：半透明效果是“平面化”，没有真实的立体感 下面视频中的例子都是使用预深度写入的方案渲染：半透明的球和人，渲染的效果是“平面化”，没有三维的体积感。半透明的翅膀，当它们互相之间重叠时，渲染出了错误的效果（变成不透明了）。 如果使用这个方案渲染三维的角色模型，那劣势的影响将更加明显，模型的半透明效果会缺失三维体积感。并且在有些情况下，结果甚至是错误的。 单层 最简单的是只有单层的半透明，不管从什么角度去看，不会有片段重叠的情况，不会有半透明的排序问题。 Shader里也不用做什么特殊的处理，只需要一个Pass和关闭深度写入，就能满足半透明效果的需求。 角色模型上几乎不会出现只有单层半透明的情况 双层 如果是最多出现两层半透明的情况，有想到一个解决思路，既可以避免排序问题，又能渲染出立体感。 此方案的思路和预深度有点类似，也是基于两个Pass去实现的。 技术理论：第一个Pass渲染背面（Cull Front），第二个Pass渲染前面（Cull Back），每个Pass都是同样的着色计算。 半透明的球体有三维立体感了，半透明的翅膀发生重叠时也是正确的效果。 多层（双层以上）...
阅读全文