GenshinCelShaderURP

What's This?

这是一个基于Unity引擎URP管线的卡通渲染项目，经过一段时间修改后基本做成这样的集合式使用了，技术难度整体不大，主要是整合了各位大佬们的工程，进行了一段时间的效果调研，取其精华并整合封装到一套shader当中，目前shader依旧使用了unlit，预计未来会转lit，本着分享的开源精神还是决定将本项目分享给大家，也希望通过开源的方式提高代码质量，我们的目的是创建一套能还原原神角色卡通渲染方式的渲染库，在保证易用性的同时保持扩展性 ，同时兼顾PC端、移动端、主机端的兼容性、性能和效果。

Installation & Usage

只需将/Shaders/GenshinCelShaderURP/路径下解压对应版本的文件夹到你的Assets即可在材质球中看到添加的shader。 在开始之前，你至少需要准备如下的贴图，如果不知道如何获取他们，可以参考B站 @小二今天吃啥啊 的这个教程，链接

(1)RGBA通道的身体Base Map (2)RGBA通道的身体Light Map(ILM Map) (3)身体Shadow Ramp (4)面部Base Map (5)面部阴影SDF阈值图 (6)头发Base Map (7)RGBA通道的头发LightMap(ILM Map) (8)头发ShadowRamp (9)面部阴影Mask (10)金属光泽Map

贴图示例

1. 身体部分：
   
   
   

2. 脸部的特殊处理：
   

Support

关于shader兼容性（通用性），目前仅限于工作在URP的Forward管线中，如果需要在延迟管线中使用请自行设置Render Objects

PS.不同游戏开发商对于ilm贴图处理方式稍有不同，可以根据自己需要修改与定制，理论上只要有ilm（表现物体阴影、高光及反射面）和脸部sdf阴影阈值图的都可以使用该shader，这里值得说明的是，《崩坏3》旧角色ilm贴图做法和新角色稍有不同，没有alpha通道控制ramp采样区域，效果会稍差点，这可能需要各位手动调色了。

For Sample Models

示例用的模型和贴图附在/Model路径下，模型来源：模之屋，链接可以用于结合我的shader进行测试，模型最终解释权归mihoyo所有，切勿商用。

For Generate Ramp Texture Tool

该配套工具是用于在Unity Editor中创建适用于该shader的ramp texture，即可根据自己需求定制ramp color，具体食用方法可参考此处

About Ramp Texture

让我们回归Cel Shading的本质——把色彩从多色阶降到低色阶，减少色阶的丰富程度，从而实现类似手工着色的效果，说人话的话也就是色阶化光照。Cel Shading有两种常见的做法，一种是计算光照强度后去采样一张Ramp贴图，另一种就是使用数学计算去拟合Ramp贴图。而采样Ramp贴图的方法提供了更多的可控性，且更加直观，而且开销并没有大多少。

图为使用RampTexture后的阴影

half3color = lerp(_ShadowColor, _Color, ramp );

该方法是Diffuse Warp(Warped Diffuse)方式，在这个方法中使用了Ramp贴图。

贴图如上。

《军团要塞2》最先使用了该Shading方法，也颇具历史意义。不仅可表现鲜明的明暗，还能表现柔和的明暗表现。我也比较常用这个方法。

相关资料 - https://steamcdn-a.akamaihd.net..

大家可以结合上面的Ramp贴图和下方的实现效果一起看下，就能知道Ramp贴图是如何影响结果的。我们可以这样理解，采样RampTexture时，把HalfLambert值应用于UV上，HalfLambert值是暗的话，映射纹理的左边，亮的话映射纹理的右边。

除了横轴对应HalfLambert的方法之外，我们可以通过灵活处理纵轴，来得到不同的效果实现。For example，在不考虑性能开销的情况下使用多层“3DRamp”图来将阴影和高光采样三次，进行三层效果的叠加，并使用外部参数调整实时调整颜色，实时所见即所得。还可以将采样的Y值与各种参数相结合，比如以视角与法线的夹角值按Y轴采样，综合实现类似菲涅尔现象的卡通渲染。

如在<崩坏3 MMD>中，利用顶点颜色绘制（Vertex color painting），把UV的Y轴移到顶点颜色值，直接调整软硬明暗效果。（MMDshader和游戏内shader的实现方式不同。）

在<军团DOTA2>中，额外使用了一张Diffuse Warp Mask纹理。

被遮罩的部分，通过采样ramp图来实现明暗渐变。把采样坐标值存入顶点色中更助于优化。

原神相比崩三（崩坏三第二部似乎也采用了类似的技术），在diffuse基础色上多了ramp阴影实现漫反射，在卡通渲染这类npr渲染当中，我们通常会通过冷暖色调分离、硬化阴影边缘等多重手段来使画面达到风格化的目的，例如《原神》这种利用ilm贴图配合ramp texture实现色调控制的方法，其实《原神》这种用ilm贴图配合ramp实现色调控制的方法，其实早在好几年前《GUILTY GEAR Xrd》就已经存在类似的实现了，《罪恶装备》和《崩坏三》同样是这种思路的延续，只不过放到原神这边是有一张单独的 ramp texture2D，原神里面角色Albedo的颜色本身并不依赖于任何光源（也有可能依靠后处理实现，不是特别确定），而是靠采样RampColor（漫反射的DarkSide部分，由 diffuse*RampColor 得到，BrightSide则为diffuse。根据LightMap.a通道的不同值域，选择Ramp图中的不同层。

原神的Ramp使用了十行1维的Ramp，分别分成上下五组代表着暖色调阴影和冷色调阴影，对应着在游戏中的白天与黑夜分别使用两种Ramp，每五个之间通过Ramp Range贴图进行区分，以让不同材质的物体使用不同的Ramp贴图表现不同的材质。Ramp有两张，头发和身体各一张，共10层，分上下两部分，前5行为暖色调阴影，后5行为冷色调阴影，对应着夜晚与⽩天。）结合diffuse实现整个Albedo颜色。如下图。

这种做法好处显而易见，一个是节省性能，因为漫反射的颜色部分不需要参与任何光照计算，亮部就是贴图颜色，阴影颜色已经以贴图形式预先绘制了，只需要后期根据光源方向控制阴影位置即可，其二是美术可更加灵活地控制阴影颜色，明暗过渡，便于实现更复杂的风格化的效果，坏处是对美工要求真的很高。

注：《原神》角色ramp图与常规Ramp贴图不同的地方就是——一般的Ramp明暗交界线在0.5的位置，但是这个在接近最右边的位置，去除了一些般变化不大的亮部部分，起到了节约带宽的同时保证美术的操作空间不被限制（压缩Ramp贴图降低采样）。

采样思路：以下是针对该贴图每一行作用的描述：
对于y轴，思路话是根据LightMap.a通道，结合光照模型（halflambert）的范围，分层采样ramp图赋予漫反射颜色。已知我们采样的像素分为冷暖两种色调，以适应白天和夜晚不同的光线环境，为了实现冷暖色调切换我们要做的就是通过shader_feature来进行采样的切换，直接if做个条方便inspector调整就行。

对于x轴，根据原来的lambert值，做smoothstep重映射，只保留0到一定数值的渐变，而大于这一数值的全部采样ramp最右边的颜色，这样一来就既可以保留阴影色的过渡，又可以形成硬边，将明暗很好的区分开来（形成硬边）。

最后补充一个关于原神内ilm贴图各通道作用：

LightMap.r :⾼光类型Layer,根据值域区分不同的⾼光ap.g :阴影AO ShadowAO光，以及matcap金属高光。

LightMap.g :阴影AO ShadowAOMask，可以理解为二级阴影，也就是不随光照方向变化的常驻阴影。

LightMap.b :BltMap.a :Raask SpecularIntensityMa制漫反射暗部颜色，htMap.a :Ramp类型Layer，根据值域选择不同的Ramp（控制漫反射暗部颜色，非常重要）

LightMap.a :Ramp类型Layer，根据值域选择不同的Ramp（控制漫反射暗部颜色，非常重要，待会介绍）

VertexColor.g :Ramp偏移值,值越⼤的区域 越容易"感光"(在⼀个特定的⾓度，偏移光照明暗)

VertexColor.a :描边粗细

Thanks

鸣谢以下大佬们提交的代码（排名不分先后）：

1、Zzzzohar（Generate Ramp Texture Tool）
https://github.com/Zzzzohar/Ramp-Tools

2、ashyukiha（shader菲涅尔边缘光、sdf面部阴影、Emission、Bloom、AlphaClipping)
https://github.com/ashyukiha/GenshinCharacterShaderZhihuVer

3、ColinLeung-NiloCat（shader卡通描边outline）
https://github.com/ColinLeung-NiloCat/UnityURPToonLitShaderExample

4、YuiLu（shader ramp漫反射及tex采样、头发裁边视角高光、金属高光、屏幕空间深度等宽边缘光）
https://github.com/YuiLu/GenshinCharacterShading

5、T.yz（知乎）（v3版本diffuse模块，包括ramp采样，结合，光照模型，ao等）
https://zhuanlan.zhihu.com/p/547129280

Rules

为了规范项目的使用，你可以将其用于...
卡通渲染相关知识学习、了解HLSL基本语法结构、个人独立游戏开发（相关代码需要遵循MIT许可进行开源）、根据自己需求定制修改源码、MMD等影视制作（如要使用此shader时请在片尾或简介中署名Thanks名单中的名字（可以不写我的名字））

请不要用于...
1 禁止用此模型参与任何商业性质活动和内容制作
2 禁止用此模型参与18禁作品，极端宗教宣传，血腥恐怖猎奇作品，人身攻击视频、暴力、色情、反社会、政治的内容制作
3 禁止对此模型进行侮辱性或猎奇的改造
4 允许对shader的全部代码进行改造，但须始终保持署名（Thanks名单当中，使用哪些作者们代码请把他们署名）
5 禁止个人之间以任何形式的二次配布（即二次传播项目文件）
3 未获得原作者许可，禁止用于商业用途（交易售卖/商业广告类宣传视频等）
5 仅允许使用本场景制作MMD视频，禁止用于其他领域（VRCHAT/游戏MOD等）
6 其他违反GPL开源许可证的行为

在遵守第五则的前提下，允许对此shader二次配布，同须始终保持署名为Github/Gaolingx

Links

欲了解更多作者相关信息欢迎访问：
米游社@爱莉小跟班gaolx、Bilibili@galing2333

End

最后，希望大家玩得开心，这个项目任将持续进行更新，如果对我们的项目感兴趣记得给一个star，这便是对我们最好的鼓励与支持，由于本人仅仅是高三的学牲，敲代码水平有限qwq，如有不足之处希望谅解，如果你针对shader部分有任何好的想法，意见或建议欢迎在Issues中讨论或者提交你的PR哟。也可以通过邮箱联系我（[email protected]），If you feel that my works are worthwhile, I would greatly appreciate it if you could sponsor me.