模型与材质基础

模型与材质基础

感谢鲤鱼儿老师和May老师和PPT

一、图形渲染管线的一部分

在这里插入图片描述
其中蓝色部分是我们可以改动编写的:

① 顶点着色器:将顶点坐标从模型空间转换到齐次裁剪空间,我们可以通过在顶点着色器中改变顶点位置实现动画。
这里我在巩固一下我自己对vertex shader也就是顶点着色器的认知:Vertex Shader负责把输入的数据进行矩阵变换位置,计算光照公式生成逐顶点颜⾊,⽣成/变换纹理坐标.并且把位置和纹理坐标这样的参数发送到片段着色器。输入的数据包括但不限于空间位置,法向量,纹理坐标以及顶点颜色等由vertex array 提供的顶点数据。

② 片元着色器:利用在光栅化阶段被插值的vertex array信息进行光照模型的计算,以及一些别的效果。
这里我在巩固一下我自己对Fragment shader也就是片元着色器的认知:片元着色器的作用是处理由光栅化阶段生成的每个片元,最终计算出每个像素的最终颜色。顶点着色器阶段输出的 varying 变量在光栅化阶段被线性插值计算之后输出到片元着色器中作为它的输入。在顶点着色器阶段只有唯一的 varying 输出变量-即内建变量gl_FragColor,就是逐片元的颜色。

二、模型实现原理

在这里插入图片描述

2.1 UV

在这里插入图片描述
在这里插入图片描述

2.2 模型包含的信息-obj文件

在这里插入图片描述
注:ppt中的顶点色不存在obj中,忽略。
只有顶点在模型空间中的坐标、贴图坐标(x-u,y-v)、和顶点法线朝向信息。
注:不使用平滑组:在Maya中创建一个box,导出obj的vn如下
在这里插入图片描述
(刚开始不知道坐标的含义,观察后猜测上图数据是按照面来显示法线方向的,一个面四个点的法线。不知道是不是这样-_-)
使用平滑组后的vn(用三角形三个点算出共用平面的面法线,然后使用共用该顶点的面的面法线求出顶点的顶点法线,复杂起来了www

在这里插入图片描述

2.3 obj格式与fbx格式

在这里插入图片描述

三、材质

在这里插入图片描述
有些物体反射光的时候不会有太多的散射( Scatter),因而产生一个较小的高光点,而有些物体则会散射很多,产生一个有着更大半径的高光点。

3.1 漫反射

在这里插入图片描述

3.2 镜面反射

在这里插入图片描述

3.3 折射

在这里插入图片描述

3.4 粗糙镜面反射

在这里插入图片描述
物体表面不是完全平滑,法线因为垂直表面存在,会有不明显的偏移。

3.5 粗糙镜面折射

在这里插入图片描述
物体加入折射意味着有透明度,可以先获取该物体后面被遮挡的物体的render texture,在本物体的shader中对其采样。

3.6 多层材质

在这里插入图片描述
例子:上过透明油漆的地板,水面

3.7 次表面散射

在这里插入图片描述

3.8 多层皮肤模型

在这里插入图片描述
在这里插入图片描述

四、模型数据在shader中的应用

1、顶点动画:在顶点着色器中,修改模型的顶点位置。进而达到模型运动的效果。
2、纹理动画:在片段着色器中,修改模型的UV信息,使得采样贴图时,发生位移而产生运动效果。
3、顶点色:在渲染时,影响输出结果。控制颜色范围。

4.1 纹理动画

UV坐标动画或UV平移的含义是,水平(U)和/或垂直(V)移动纹理的UV坐标,以产生复杂动画的错觉。

在这里插入图片描述
(会动的水www)

4.1.1 原理

① 改变法线方向
在这里插入图片描述
比如blinn-phong使用世界空间下的法线

struct a2v 
{
...
float3 normal : NORMAL;
...
}

struct v2f
{
...
float3 normalWorld : NORMAL;
...
}

v2f vert(a2v v)
{
...
o.normalWorld  = UnityObjectToWorldNormal(v.normal);
...
}

fixed4 frag(v2f i) : SV_Target 
{
...
nDir = normalized(i.normalWorld);
//Blinn-phong
...
hdotn = dot(halfDir, nDir);
...
}

② 改变UV采样点位置
在这里插入图片描述

4.2 顶点动画

在这里插入图片描述
在这里插入图片描述

4.3 顶点色

控制范围
在这里插入图片描述
比如卡通渲染中的人物阴影,通过画好的顶点色,判断如果顶点色某一通道的数值达到某个阈值,就处在阴影中,否则就是高光。

在Maya中绘制顶点色(注:模型的面在导入引擎后都会转化为三角面)
在这里插入图片描述

4.3.1 插值原理——重心坐标

在这里插入图片描述

在这里插入图片描述
注:插值操作是在光栅化阶段进行的所以这些XY坐标可以理解为屏幕坐标

一个例子
在这里插入图片描述

4.4 顶点法线与面法线

如下图

在这里插入图片描述
在这里插入图片描述

4.4.1 原理(实践)

面法线中,不使用平滑组(Maya:软边)的话,三角形的三个点顶点共用一条法线。插值计算时因为法线方向相同,结果也相同。

顶点法线中,使用平滑后,一个顶点一个法线。三角形三个顶点的法线也就不相同。插值结果,也就会不同。
在这里插入图片描述
在这里插入图片描述

顶点色还可以做什么?
首先是一般作用,顶点颜色通常与漫反射颜色相乘,使color map变色或者变暗。然后是一些效果和shader:
顶点色可以控制不同纹理/集之间的混合: 由于画顶点色对于控制纹理的混合是一种消耗较低的方法,所以你懂的。
在这里插入图片描述
顶点色也能作为一个人为设定的遮罩,通过将颜色所代表的数值设定为阈值,控制某种效果(比如Fresnel)是否在模型涂有顶点色的部位生效,从而起到遮罩的作用。
控制不透明度;
在模型发生碰撞时控制不同顶点发出声音;
控制树叶顶点是否受到“风”的吹动,抑或是哪些会被“吹动”。



当顶点色不作为一种颜色去发挥作用时,每个颜色通道都被视为单独的储存信息的集合,因此,RGB顶点色可以控制三个不同的顶点效果。alpha通道也一样,作为单通道储存顶点色的数据。

在这里插入图片描述

模型的AO(Ambient occlusion)信息也可以储存在顶点色中。但是似乎与一般的AO图相比,储存在顶点色中的ao信息被读取所展现的效果并不如人意,会有损失。

模型光滑组对法线有什么影响?
对于面法线,有没有光滑组都一样,不影响。对于顶点法线,有光滑组且uv中的面是连续的,那么模型在引擎中不会有光影断裂或者不正常的显示。顶点会根据平滑后模型重新插值法线,会获得与面法线不同的角度均匀连续分布的法线。

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值