US4L2——模型描边效果
US4L2——模型描边效果 知识回顾 —— 边缘检测 边缘检测效果,是一种用于突出图像中的边缘,使物体的轮廓更加明显的图像处理技术。 我们目前学习的实现方式有两种,都是基于屏幕后期处理效果的: 基于卷积运算的: 用像素周围的9个像素的灰度值和Sobel算子进行卷积计算得到梯度值决定是否在边缘上 基于深度+法线纹理的: 基于Roberts交叉算子,通过比较对角线上的的像素的深度和法线值,判断是否在边缘上 这两种方式会对屏幕图像中每个像素产生影响,主要是针对全局性效果的,一个用于2D图像,一个用于3D场景 模型描边效果 在 Unity 中,模型描边效果也可以称为边缘描边、轮廓描边、轮廓线效果。 它实现出来的效果类似边缘检测,主要是为了让单个 3D 模型产生描边效果,使模型的轮廓更加突出。 这种效果一般用在卡通渲染、手绘风格、漫画风格的游戏中,还可以用来制作对象选中效果。 模型描边效果的基本原理 一句话描述模型描边效果的基本原理: 两个 Pass 渲染对象,一个 Pass 用于渲染沿法线方向放大的模型,一个 Pass...
US4L1——流光效果
US4L1——流光效果 流光效果 在 Unity Shader 中的流光效果是一种动态的视觉效果,通常用于给材质增加一种闪光或光线移动的效果,使物体表面看起来像是有光在流动。 这种效果常用于武器光效、能量护盾、传送门等等,可以让物体看起来更加生动富有科技感 流光效果的基本原理 实现流光效果的原理非常简单:就是利用 Unity 内置的时间变量 _Time,让UV坐标沿着一个固定的方向持续递增, 然后用偏移后的UV坐标对纹理贴图进行采样,就可以得到流动的效果了。 相关知识详见:US3S9——动态效果 知识回顾:_Time 中的 4 个分量分别是 (t/20, t, 2t, 3t),t 代表该游戏场景从加载开始经过的时间 流光贴图美术相关注意事项 UV 需要均匀的展开,如果 UV 展开不均匀或者出现拉伸,流光的移动会出现扭曲和不自然,需要确保模型的UV展开尽量均匀和平滑 UV 的比例要一致,模型上不同部分的 UV 比例需要保持一致,确保流光效果的移动速度在整个模型上是一致的。 如果某些区域的 UV...
US4——Shader实践知识
US4——Shader实践知识 本系列学习内容: 基础效果 流光效果 模型描边效果 遮挡半透明效果 物体切割效果 翻页效果 非真实感渲染 卡通风格渲染 素描风格渲染 噪声相关效果 制作噪声纹理 Photoshop生成噪声、渐变纹理 柏林噪声纹理生成工具实现 消融效果 水波效果 噪声雾效
US3L11L7——利用深度法线纹理实现边缘检测效果
US3L11L7——利用深度法线纹理实现边缘检测效果 知识回顾 边缘检测屏幕后处理效果 边缘检测效果是什么 是一种用于突出图像中的边缘,使物体的轮廓更加明显的图像处理技术,利用 Shader 代码自动给屏幕图像进行描边处理 边缘检测效果的基本原理 得到 当前像素以及其上下左右、左上左下、右上右下共9个像素的灰度值 用这 9 个灰度值和 Sobel 算子进行卷积计算得到梯度值 G = abs(Gx) + abs(Gy) 最终颜色 = lerp(原始颜色,描边颜色,梯度值) 如何得到当前像素周围 8 个像素位置 利用 float4 纹理名_TexelSize 纹素信息得到当前像素周围8个像素位置 为什么要基于深度法线纹理实现边缘检测 我们之前利用 Sobel 算子基于像素灰度值计算出来的边缘检测效果,其实总体上来说不太理想。 因为这种计算方式依赖于像素的颜色(灰度值)变化来识别边缘,会受到物体纹理和阴影颜色等因素影响。 所以这种制作方式往往不能准确的反应出物体的真实轮廓! 因此我们才会来学习...
US3S11L6——深度纹理实现全局雾效
US3S11L6——深度纹理实现全局雾效 知识回顾 —— 全局雾效的三种计算方式 Linear(线性):f=end−∣d∣end−startf = \frac{end - |d|}{end-start}f=end−startend−∣d∣ Exponential(指数):f=1−e−density⋅∣d∣f = 1 - e^{-density \cdot |d|}f=1−e−density⋅∣d∣ Exponential Squared(指数平方):f=1−e−(density−∣d∣)2f=1-e^{-(density-|d|)^2}f=1−e−(density−∣d∣)2 它们都是用来计算雾的混合因子 fff 的, 有了混合因子,会用雾的颜色和物体本来的颜色进行混合计算: 最终的颜色=(1−f)×物体的颜色+f×雾的颜色最终的颜色 = (1-f) \times 物体的颜色 + f \times 雾的颜色 最终的颜色=(1−f)×物体的颜色+f×雾的颜色 为什么要实现屏幕后处理效果的全局雾效 既然 Unity...
US3S11L5——Unity自带全局雾效
US3S11L5——Unity自带全局雾效 全局雾效 全局雾效(Global Fog)是一种视觉效果,用于在3D场景中模拟大气中的雾气对远处物体的遮挡, 它通过在场景中加入雾的效果,使得距离摄像机较远的物体看起来逐渐被雾气覆盖,从而创造出一种朦胧、模糊的视觉效果。 Unity自带的全局雾效 Unity 当中本身就存在一个全局雾效功能、我们可以在 Window —> Rendering —> Lighting 窗口中的 Environment 环境页签中进行开启 Fog 是否开启全局雾效 Color 雾的颜色 Mode 雾的计算方式 其中,雾的计算模式有三种,它们分别是: Linear(线性) Exponential(指数) Exponential Squared(指数的平方) 关于雾的计算公式,详见下文 Density 雾的浓度 这里参数根据雾的模式的不同而不同 不同模式的雾的混合因子计算公式 其中,雾的计算模式有三种,它们分别是 Linear(线性) Exponential(指数) Exponential...
US3S11L4——利用深度纹理实现运动模糊效果
US3S11L4——利用深度纹理实现运动模糊效果 知识回顾 运动模糊效果 运动模糊效果,是一种 用于模拟真实世界中快速移动物体产生的模糊现象 的图像处理技术。 一般有两种常用方式: 累积缓存:物体快速移动时存储多帧图像信息,取它们之间的加权平均值作为最后的运动模糊图像 优点:质量高、效果好 缺点:计算量大,存储开销大 速度缓存:物体快速移动时存储多帧运动速度信息,利用速度来决定模糊的方向和大小 优点:性能较累积缓存好 缺点:效果较差,可能产生重影和伪影 我们之前学习的方式是基于累积缓存的,但是并没有存储多张场景信息,而是采用一张渲染纹理 RenderTexture 保存之前的渲染结果, 不断把当前渲染图像叠加到之前的渲染图像中,从而产生一种运动轨迹视觉效果 详见:US3S10L9——基于累积缓存的运动模糊 基于速度缓存的运动模糊效果 这节课是利用深度纹理实现运动模糊,它其实就是基于我们之前提到的 速度缓存...
US3S11L3——查看深度和法线纹理
US3S11L3——查看深度和法线纹理 查看深度纹理信息 我们可以在屏幕后期处理中使用我们学习过的获取深度信息的知识点,将深度值作为颜色的RGB值显示在屏幕上,感受深度纹理中存储的内容 理论上来说,如果深度值使用 0~1 范围的线性值,越接近近裁剪面越靠近黑色,越接近远裁剪面越靠近白色 实现 查看深度纹理屏幕后期处理效果 对应 Shader 新建 Shader,删除无用代码 声明变量 在 Shader 中通过声明 _CameraDepthTexture 获取深度纹理 123sampler2D _MainTex;float4 _MainTex_ST;sampler2D _CameraDepthTexture; // 按规则命名的深度纹理变量 顶点着色器 只需要修改传入结构体类型 1234567v2f vert (appdata_base v){ v2f o; o.vertex = UnityObjectToClipPos(v.vertex); o.uv = TRANSFORM_TEX(v.texcoord, _MainTex); ...
US3S11L2——深度和法线纹理背后的原理
US3S11L2——深度和法线纹理背后的原理 知识回顾 —— 裁剪空间变换 具体内容详见:US2S1L13——观察空间变换、US2S1L14——齐次裁剪空间和NDC空间 等裁剪空间相关内容 观察空间:也被称为摄像机空间,遵循右手坐标系原则,观察空间中原点为摄像机位置,x、y、z轴正方向分别对应摄像机的右、上、后方 裁剪空间:也被称为齐次裁剪空间,是一个非常特殊的空间,它的坐标范围为 (-1,-1,-1) 到 (1,1,1) 的一个正方体范围 我们需要将摄像机视锥体变换到其中,其中相对复杂的是 摄像机 的 透视投影 和 正交投影 到 齐次裁剪空间 的 变换矩阵推导 其中,正交投影的齐次裁剪空间坐标的转换矩阵为: (1Aspect×Size00001Size0000−2Far−Near−Near+FarFar−Near0001)\begin{pmatrix} \frac{1}{Aspect \times Size} & 0 & 0 & 0 \\ 0 & \frac{1}{Size} & 0 & 0 \\ ...
US3S11L1——屏幕深度和法线纹理的使用
US3S11L1——屏幕深度和法线纹理的使用 深度和法线纹理的使用 使用屏幕深度和法线纹理,一般分两步: 让 Unity 知道我们需要使用深度和法线纹理 123456private void Start(){ Camera.main.depthTextureMode = DepthTextureMode.Depth; // 获取一张深度纹理 Camera.main.depthTextureMode = DepthTextureMode.DepthNormals; // 获取一张深度+法线纹理 Camera.main.depthTextureMode = DepthTextureMode.Depth | DepthTextureMode.DepthNormals; // 获取深度纹理 和 深度+法线纹理} 在 Shader 当中直接声明对应变量 深度纹理 1sampler2D...