Lesson1作业标准答案
思路

实现

作业点评

作业批改
作业1 简单玉石效果

可以看到这是一个像玉石的效果,拆解一下就是:
HalfLambert采样RampTex + NdotV边缘光 + Trick双高光
接下来讲详细实现过程
HalfLambert采样RampTex

双高光Trick
思路:偏移法线,再dotL,给高亮部分一个阈值,让其形成一个黑白遮罩,再插值上高光的颜色
先偏移法线(偏移LightDir也可以得到一样的效果)

归一化后dot光线Dir

大于阈值输出1,小于阈值输出0,形成黑白遮罩

Max合并两个高光,Clamp将其钳制在01之间(防止负数),Lerp插值RampColor和HighLightColor

边缘光
这里用到Fresnel节点,菲涅尔详细原理公式这里就不给出了,直接用就好了,最后加上原来的颜色即可。

效果
猴头有点锯齿,应该是模型的问题。

作业2 屏幕空间条纹纹理

HatchingShader,手绘素描的效果
拆解一下:
Lambert + ScreenPosition和Depth采样HatchTex + Lerp明暗颜色
这个作业效果,由于ShaderForge里有个Depth节点,在ASE中没实现出来,所以在Unity2019用SF复刻了
Lambert
先是连个NdotL,然后Clamp到01之间,乘上一个BaseColor

效果:

HatchTex采样
我们使用ScreenPostion来采样HatchTex
可以看到效果如下,并且根据摄像机距离远近会导致效果不同


因此我们需要给ScreenPosition乘上Depth,这样就不会产生问题了
Depth节点:目标点到摄像机的距离

接下来将采样结果与Lambert基础光照Step,神奇的效果就出现了
如果 [A] 小于或等于 [B],则输出 1,否则输出 0

颜色
接下来就是用Step的结果,插值两种颜色,然后加上Lambert的基础色,就完成了

连连看

这里留个坑:这个shader是在built-in管线下用SF连的效果,之后在URP下用代码或者ASE复刻这个效果。
ASE版本
效果比较怪,摄像机离得近没有问题,如果离得远还存在摩尔纹的问题,不知道是哪里导致的,以后再排查吧。



作业3 程序化点阵纹理HalfTone

一个halftone的效果
Lambert + 程序化纹理,这个效果实现过程中,涉及到了一些数学知识
Halftone
与HatchingShader类似,我们同样需要用ScreenPosition,将ScreenPos乘上一个Size参数,用Frac函数来实现uv的拆分。

效果如下:

接下来Remap一下uv的范围,从01映射到-0.5~0.5,效果如下,remap后 原点 到了 中心点位置

Remap的目的在于下一步的,Length是取向量的模长,生成黑点程序纹理,

接下来调整下Size,就有点感觉了

Lambert
简单连个Lambert,将其Remap到-0.5~2

这里得到的效果非常奇怪,是与正常Lambert光照相反的结果(不准确)

这一步看似没有用,但是非常的有用,不知道是怎么想到这样的Trick的
接下来将原来的Halftone,用重映射后的值进行pow,效果如下

pow后的效果竟然正常了,这里解释一下原理,程序生成出来的纹理值在0-1之间,重映射后的NodtL值:
越黑越接近0(也有可能是负数),在黑色部分,pow出来的值就越接近1或大于1,也就是白色
越白数值越大(1~max),在白色部分,pow出来的值越接近0,也就是黑色
最后round函数,增加对比,最终效果如下:
round:四舍五入,非0即1

贴上整个节点图:

思考
这个案例确实足够的有意思,也让我学到了很多,用数学方法来实现了程序化的纹理生成,加上一些trick最终实现了这样的美术效果。
图形编程还是离不开数学,想要用程序化的方式去生成很多好看的效果,以及一些特殊的trick,少不了扎实的数学功底。
情报·卡渲
卡通渲染的风格有很多种,赛璐璐,大色块等

卡通渲染的技术那就更多了

比较常用的两种卡通渲染方案:罪恶装备和究极风暴


以及HatchingShading在游戏中的应用


这样的风格化阴影还是很好看的,这里先埋个坑,之后有机会都去实现一下()
内容规范
TA需要整理团队项目资源,因此规范自身很重要

对应文件放在相应的文件夹下面,一种像我这样对应文件夹下面放每课的内容,另一种就是给每课单独创个文件夹,再创建相应的文件夹放文件。两种都行,能方便找到就ok。

总结
这节课主要介绍了三种效果,并不算特别难,但有些细节还是存在一些问题的
比如:
- 作业2、3的屏幕空间坐标的问题,在ASE中效果与SF中不太一样,应该如何得到一样的效果
- unity2022,urp下作业2实现出来有摩尔纹,以及阴影效果不太对,如何修正
- 作业3中,我尝试了用屏幕空间uv来作为ScreenPos,但是效果乘出来不对,是为啥
这些问题目前以我的知识要解决还有点麻烦,暂且先放一下,在以后的学习过程中,再回头来看。
还有就是介绍了一些卡渲的技术和方案效果,但课程中介绍的方案目前来说应该已经过时了,后续会研究如今二游的卡通渲染方案。
