复刻手游《一人之下》的角色渲染

以上是复刻的效果图,右边为unity里的显示。

因为项目的需求,我需要研究一下某讯刚上的手游《一人之下》的角色渲染。

概述

我用到了截帧工具Snapdragon Profiler来研究。文章提供了我自己写的shader代码(URP环境下的),因为版权

原因资源就没有了。实际上shader只是渲染流程的一半,另一半需要美术开发流程配合,包括AO贴图、高光贴图、

描边贴图等等,具体的会在文中讲解。

具体的渲染

在Snapdragon Profiler里可看到,shader已经被加密了,无法看到明文,所以渲染的实现只能靠经验猜。

先看身体部分的渲染,角色的模型是多个模型合并在一起的,这样操作的具体原因未知。上半身、头部、头发、下半身、鞋子,都是独立的模型,然后合并到一起的。

AO贴图

上半身先有一张主贴图,并且包括了alpha通道:

alpha通道的数据和RGB通道的其实没太多关联,那么根据经验来判断,假设alpha通道的数据是用于

AO贴图(环境光遮蔽),纯黑色是阴影,灰色区域不做任何处理。

按照这个假设做的处理,未加AO贴图:

加了AO贴图后:

嗯,和手游效果一致!果然AO贴图的数据放入了主贴图的alpha通道里。

内部描边

接着,看另外一张和主贴图结构一样,但是颜色不一样的贴图,alpha通道里也有数据。

这是描边的贴图吗?很有可能,可以假定黑色是描边,白色是不处理任何东西。所以我增加了内部描边的功能。

下图分别是无内部描边和有内部描边的效果。效果还是算明显的。

高光贴图

头发上可以明显看到有高光的感觉,但是主贴图却没有,那这部分高光是如何生成的呢?

在截帧工具里,我们可以看到有张贴图:

它的数据都在alpha通道里,如下:

上过原画课的人就知道,头发的高光一般是画成H或V形状,或者它们的变形,所以利用这个贴图就可以在相应的地方

生成高光效果。下面是实际在Unity里的效果。

丝袜和鞋子上的高光

这部分高光,它们不是高光贴图,具体实现我也不甚清楚,我是用blin-phong高光来实现的。

效果和手游上的有点差距,下面右边的图是我在Unity里实现的。

如果有知道怎么实现的朋友,烦请告知一下。

外描边

最后,看手游的效果图,还有外描边,而且描边似乎和主贴图的颜色相关,也就是主贴图颜色乘以一个0-1的数值。

或者做了正片叠底。于是,另外使用一个描边的pass来处理。其中frag的代码里,就是主贴图颜色乘以一个0-1的数值。

得到描边的颜色值。

float4 fragOuline(v2f i) : SV_Target{
		float4 sampleTex = tex2D(_MainTex, i.uv);
		float3 finalCol = sampleTex.rgb;
		return float4( finalCol.rgb* _OutlineColor * _Outlinebool,1);
}

代码下载

需要Unity的URP环境下运行。

链接:https://pan.baidu.com/s/1rchbh0fg5DLgl03MQJfaBw 
提取码:4r2y

猜你喜欢

转载自blog.csdn.net/zakerhero/article/details/106518463