永远相信美好的事情即将发生 😊!

卡通渲染之梯度漫反射的实现(URP)

分享 Mavis 16℃ 0评论

这部分的内容比较简单,理解起来也非常容易,而且这部分内容已经有太多参考资料了,只是为了让我的专栏完整一点,还是该加上的。下面按照老方法讲讲自己的思路和理解吧,然后看看实现之后的对比图。

首先看一下传统lambert漫反射模型的效果:

然后再看一下half-lamber模型的效果:

但是在表现卡通效果的时候,通常需要让光影以色块的形式表现,这样连续的光影效果更适合模拟真实的效果

所以需要对连续的值进行离散化,就是让某个区域的值变成一个值,首先就用一个阈值来区分亮暗区域

float diff = dot(normalWS ,LightDirWS);
diff = diff * 0.5 + 0.5;
diff = clamp(diff,0,1);
_ShadowRange = step(_ShadowRange,diff);
float3 diffuse = light.color.rgb * BaseMap.rgb * _ShadowRange;

shadowRange用来控制边界值,diff大于该阈值则返回1,否则返回0,所以可以看到目前的效果是暗处全黑,调整阈值调整的是暗部和亮部的比例:

可以看出来相比较传统漫反射的连续值,采用这样的方式获得的是明显的色块

但是目前的效果还不够好,太黑了,ok,之前是用一个阈值来控制,那有几个阈值来控制岂不是更好,但阈值作为参数如果太多肯定不好,所以出现了用图来存储的形式,通常这张图被叫做Ramp,长这个样子:

这张图作为输入的含义就是,现在有三个阈值A,B,C,分成了四个区域:0-A、A-B、B-C、C-1。

diff的值取样在哪个区域就会得到哪个区域的颜色,所以利用这种图,可以自制更好的更灵活的亮部和暗部效果,边界也可以不用smoothstep处理,直接在图里处理就可以。

既然这个图这么好用,那么自然能有一个编辑器是最好的辣

这个是我照着一个大佬的写的:

Gradient就可以制作这样的图,不过这只针对数据在竖向上没有变化的Ramp图

将这张图应用到代码中:

float diff = dot(normalWS ,LightDirWS);
diff = diff * 0.5 + 0.5;
diff = clamp(diff,0,1);
float3 ramp = SAMPLE_TEXTURE2D(_Ramp,sampler_Ramp,float2(diff,diff));
float3 diffuse = light.color.rgb * BaseMap.rgb * ramp;

得到的效果是:

上图只是举个例子,不是最好的效果展示,如何制作符合人物的ramp图以及一些细节的调整还是要靠美术。

梯度漫反射的实现就是这么简单明了,也没什么需要补充的,之后可能会涉及到其他光影效果的实现,但就不放在卡通渲染的专栏里面了,毕竟卡通渲染的内容我只学了最基础的部分,还需要大量的学习来完善自己,本专栏也就到此结束了。

 

 

 

 


Mavis , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:卡通渲染之梯度漫反射的实现(URP)
喜欢 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址