
图形
文章平均质量分 82
Jave.Lin
积跬步至千里
展开
-
Unity Shader - 搬砖日志 - URP PBR (抄作业篇,持续更新~)
PBR 主要渲染方程Lo(p,wo)=∫Ω(kdcπ+ksDGF4(wo⋅n)(wi⋅n))Li(p,wi)(wi⋅n)dwiL_o(p,w_o)=\int_{\Omega}(k_d \frac{c}{\pi} + k_s \frac {D G F}{4(w_o \cdot n)(w_i \cdot n)}) L_i(p,w_i)(w_i \cdot n) dw_iLo(p,wo)=∫Ω(kdπc+ks4(wo⋅n)(wi⋅n)DGF)Li(p,wi)(wi⋅n)dwi.原创 2022-02-25 22:10:15 · 6471 阅读 · 1 评论 -
Unity Shader - Post Processing 15 - Height Fog (Plus) - 后效 高度雾 改进版 (Parallax)、模拟闪电在云层中SSS
文章目录环境问题Parallax 原理效果ProjectReferences环境Unity : 2018.2.11f1, 2019.4.30f1Pipeline : Built-in RPGraphic API : DX / OpenGL ES之前 使用 后效实现过:深度 + 高度雾 版本的效果,具体可以参考:Unity Shader PostProcessing - 11 - 雾效/深度雾效/高度雾/深度+高度雾问题因为之前写的高度雾会有一个问题:不论我的高度雾设置多高的雾底下的 G原创 2022-01-10 14:14:52 · 3711 阅读 · 4 评论 -
光照 辐射度量学 - Radiant Intensity, Irradiance, Radiance 的概念
Radiant Intensity - Radiant 就是 主动的 对四面八方的放射总量,加上 intensity 就时程度的意思,就时,总体来说,就是:辐射度的意思Irradiance - 就是某个表面 被四面八方照射到的总量,就是:被辐射度的意思Radiance - 就是上面 Radiant Intensity, Irradiance 中单个射线方向的光子光程ReferencesReal-time Global Illumination 实时全局光照学习笔记1...原创 2021-12-31 17:42:59 · 3897 阅读 · 0 评论 -
[解读] GuiltyGearXrd‘s Art Style : The X Factor Between 2D and 3D - GGX 3D 渲染 2D 风格
---这篇我们将 2015 GDC中的 《罪恶装备》介绍的视频内容都笔录一下---# 目的对视频笔录的目的:便于后续重新回顾、搜索、确定方案时,可以快速的查看到想要的内容,而不用重新查看一遍视频的内容---# 注意本篇因为笔录视频内容,会包含 ==**巨量**== 的图片,所以如果在浏览本篇文章之前,==**您的浏览终端,如果是流量有限的话,就需要注意一下**==原创 2021-12-12 14:35:35 · 8736 阅读 · 0 评论 -
[搬砖] SIGGRAPH 2021 - Shading Rig: Dynamic Art-Directable Stylised Shading for 3D Characters
今天在研究NPR的人脸光影问题的时候,偶然发现 SIGGRAPH 2021 也新的方案,但是具体实现原理我还没去了解过深,先占个坑Shading Rig: Dynamic Art-Directable Stylised Shading for 3D Characters有讲解,Toon Shading, Vertex Normal Smoothing, Shading Rig 后的区别,如下图:SIGGRAPH 2021 Real-Time Live! - SIGG 2021 中有讲到上面的原创 2021-11-24 16:01:34 · 456 阅读 · 0 评论 -
Unity PostProcess Shader - 14 - InnerGlow - 基于后效的内轮廓效果,类似 PhotoShop 图层的内发光
文章目录思路ShaderCSharpCamera PP 脚本Outline Renderer 提取器OutlineManager效果之前写的一个类似Photoshop中的图层的 外发光 效果管线:built-in 管线unity 版本:2019.4.30f1思路只要某个像素的 kernal size 范围内的,如 5x5 的 kernal size,只要某个 pixel(x,y) 像素不是全黑,并且 kernal size 核内的 sum 值小于 kernal size 平方,都算是边缘原创 2021-10-14 15:44:35 · 469 阅读 · 0 评论 -
Unity PostProcess Shader - 13 - Outline - 基于后效的外轮廓效果,类似 PhotoShop 图层的外发光
之前写的一个类似Photoshop中的图层的 外发光 效果,其实准确的来说,我这个应该叫:基于像素颜色的外轮廓的描边,和描边的思路很像而已管线:built-in 管线unity 版本:2019.4.30f1思路只要某个像素的 kernal size 范围内的,如 5x5 的 kernal size,只要某个 pixel(x,y) 像素作为的 5x5 范围内的像素有一个不是为全黑的像素,都算是边缘原创 2021-10-14 15:25:00 · 859 阅读 · 0 评论 -
Occlusion Culling 相关
大地图,超级多物件,如果 All 的方式来 Bake 的话,很有可能如下图的结果原创 2021-07-30 16:14:39 · 209 阅读 · 0 评论 -
图形新手入门题
尝试使用 渲染系统(WebGL, OpenGL, Unity 的 Graphics,DX 等),实现以下内容:绘制 一个纯白色三角形绘制 两个三角形,并组合为一个四边形绘制一个 纯白色 的四边形暴露一个 颜色 来调整四边形的颜色给四边形添加一个 纹理将 uv 数值调整一下,分别看看对 uv 的 缩放 和 位移 时,四边形的纹理是如何的表现了解 什么是向量实时的 输出 两个 2d 或是 3d 向量的 点乘结果,并调整两个向量,观察 结果 有什么 规律了解 什么是单位向量实时的 绘制 两个原创 2021-03-13 23:37:16 · 282 阅读 · 3 评论 -
Unity - DrawCall, Batch, SetPassCall区别
一般我们 在实时渲染中,DC也就是 DrawCall 都会尽可能的降低他,以为着,CPU 与 GPU 的绘制沟通会减少啥叫:DrawCall已 OpenGL 为例,就是调用带有绘制功能的 API 的次数如:DrawCall : 10 次,那就意味着调用了 glDrawXXXX 的 API 10 次啥叫:SetPassCallUnity 中,就无缘无故多了个叫:SetPassCall 的家伙其实早在以前的游戏引擎里,没有 pass 这么一个说法,说是 techni 的说法因为这些都是封装的功原创 2021-02-05 19:09:04 · 3545 阅读 · 1 评论 -
Unity Shader - Planar Shadow - 平面阴影
思路将模型压扁后,绘制即可完善多个 Planner Shadow 重叠绘制时的 alpha 问题使用 stencil buffer 来规避已经绘制过的即可References暂无原创 2021-01-23 14:14:09 · 3962 阅读 · 3 评论 -
Blender - Subsurface Scattering(次表面散射) - 实现比较好的奶酪材质参数说明
文章目录什么是次表面散射建模、添加 SSS 材质什么是次表面散射Subsurface Scattering - 次表面散射,简写 SSS以前没去了解过,但是发现,如果要制作光通透效果,还是要了解实现原理,对于参数调整也会得心应手Subsurface Scattering (SSS) 的说明,我参考了一篇写得很不错的:【插播002】Subsurface我自己总结理解为:光波在射入物体后,部分光波在物质中穿透,最后总物体的从射出,然后我们的眼睛(相机)捕抓到这些光波的颜色。Radius(光原创 2020-08-23 16:57:13 · 4837 阅读 · 0 评论 -
LearnGL - 15.3 - 渲染顺序
文章目录渲染队列核心排序函数不透明几何体半透明几何体其它几何体查看半透明效果正常效果不正常的效果LearnGL - 学习笔记目录前一篇:LearnGL - 15 - Skybox - 天空盒 - 优化天空盒的渲染队列 - 有说一丢丢关于渲染顺序的优化,这个是直接使用 渲染队列值 来排序的这一篇:我们对将区别对 不透明几何体、半透明几何体、其他几何体 的排序本人才疏学浅,如有什么错误,望不吝指出。渲染队列之前有提到过,现在再复制一篇: enum class RenderQueueType {原创 2020-08-12 12:03:23 · 366 阅读 · 0 评论 -
LearnGL - 15.2 - Refraction - 折射效果
文章目录先看看效果折射现象refract 函数的使用Shader 调整my_lighting.glsl添加材质属性添加了着色器信息结构体添加了计算折射的函数提取了着色器函数外部调用ReferencesLearnGL - 学习笔记目录前一篇:LearnGL - 15.1 - Reflection - 反射效果 - 了解了立方体贴图(环境贴图、天空盒)反射效果这一篇:实现类似折射的效果本人才疏学浅,如有什么错误,望不吝指出。扯一些闲话:前几天和小舅子玩了玩 PS4:《Hell Driver》原创 2020-08-12 10:27:45 · 807 阅读 · 0 评论 -
LearnGL - 15.1 - Reflection - 反射效果
文章目录先看看效果思路构造 cube map、纯颜色环境光计算反射向量添加对环境反射的强度 ReflectionK完整的 my_global.glsl完整的 my_lighting.glslReferencesLearnGL - 学习笔记目录前一篇:LearnGL - 15 - Skybox - 天空盒 - 了解了如何构造一个天空盒这一篇:实现类似环境反射的效果,我们可以使用纯颜色、天空盒来做反射采样的颜色。总体来说我现实的这种比较简单,不过很多都是基于之前的内容类实现的。本人才疏学浅,如有什么原创 2020-08-07 14:14:19 · 364 阅读 · 0 评论 -
LearnGL - 15 - Skybox - 天空盒
文章目录先看效果思路实践准备一个 Cube再准备好 CubeMap(立方体贴图)天空盒子的 Shader效果1在应用层设置传入的视图变化矩阵前,删除移动的量在GLSL shader层移动视图变化矩阵的移动量效果3添加其他几何体看看深度问题效果4效果5天空盒边界接缝处瑕疵问题边界缝隙解决ReferencesLearnGL - 学习笔记目录前些篇:LearnGL - 11.1 - 实现简单的Gouraud-Phong光照模型LearnGL - 11.2 - 实现简单的Phong光照模型LearnG原创 2020-08-06 22:45:16 · 637 阅读 · 0 评论 -
LearnGL - 14 - MultiLight - 多光源
文章目录C++ 应用层的代码改动和核心代码修改前修改后Shader - my_lighting.glsl 核心改动改动前改动后效果放置多个光源效果添加了灯光 Gizmos 显示控制添加了渲染队列控制渲染状态整体操作演示ReferencesLearnGL - 学习笔记目录前些篇:LearnGL - 11.1 - 实现简单的Gouraud-Phong光照模型LearnGL - 11.2 - 实现简单的Phong光照模型LearnGL - 11.3 - 实现简单的Blinn-Phong光照模型Lea原创 2020-07-31 09:43:56 · 582 阅读 · 0 评论 -
LearnGL - 13.1 - SpotLight - 聚光灯
文章目录演示完整 ShaderSpot Light Gizmos - 聚光灯的 Gizmos 绘制C++ 生成网格代码LearnGL - 学习笔记目录前一篇:LearnGL - 13 - PointLight - 点光源 实现了 点光源 的最简单的着色方式这篇:我们尝试给 “聚光灯” 类型的光源本人才疏学浅,如有什么错误,望不吝指出。其实 聚光灯 与 点光源 很类似,以为区别比较大的是: 聚光灯 有光照的张角范围,而不像 点光源 的张角是全方位的范围。所以相比上一篇来说,代码的添加与调整原创 2020-07-29 22:04:05 · 885 阅读 · 0 评论 -
LearnGL - 13 - PointLight - 点光源
文章目录点光源与方向光比较光衰减距离衰减作用范围衰减对应的 Inspector 面板参数演示光源的切换ShaderReferencesLearnGL - 学习笔记目录前些篇:LearnGL - 11.1 - 实现简单的Gouraud-Phong光照模型LearnGL - 11.2 - 实现简单的Phong光照模型LearnGL - 11.3 - 实现简单的Blinn-Phong光照模型LearnGL - 11.4 - 实现简单的Flat BlinnPhong光照模型这些演示光照计算中,都是原创 2020-07-28 17:28:01 · 851 阅读 · 0 评论 -
投影矩阵的推导(Deriving Projection Matrices)
文章目录概述: 什么是投影?正交投影(Orthographic Projection)透视投影(Perspective Projection)总结原文:Deriving Projection Matrices在学习 LearnGL - 学习笔记目录 之前找过一些关于 透视矩阵 的教程,发现有很多写的不错的文章,如:OpenGL Transformation,但这里我只列出一个写的 最清晰 的,就上面原文的内容 Deriving Projection Matrices,因为作者将每一项的推导过程写的相转载 2020-07-27 17:54:42 · 1799 阅读 · 0 评论 -
LearnGL - 11.5 - 矩阵04 - 法线从对象空间变换到世界空间
文章目录Unity 中的处理OpenGL 处理总结ReferencesUnity 中的处理在 Unity ShaderLab 中,你可能会看到内置的函数:// Transforms normal from object to world spaceinline float3 UnityObjectToWorldNormal( in float3 norm ){#ifdef UNITY_ASSUME_UNIFORM_SCALING return UnityObjectToWorldDir原创 2020-07-22 18:33:35 · 979 阅读 · 2 评论 -
LearnGL - 11.3 - 实现简单的Blinn-Phong光照模型
文章目录Blinn-PhongPhong 的高光计算量Blinn-Phong 的高光计算量在 GGB 看看数值效果Blinn Phong in vsBlinn Phong in fs运行效果气球猫的效果环境光Phong 中环境光效果稍微调整一下环境光的处理完整的气球猫 三种 ShaderPhong ShaderGouraud Phong ShaderBlinn Phong ShaderLearnGL - 学习笔记目录前些篇:LearnGL - 11.1 - 实现简单的Phong光照模型LearnG原创 2020-07-21 11:05:27 · 571 阅读 · 0 评论 -
LearnGL - 11.2 - 实现简单的Phong光照模型
文章目录Phong、Gouraud-Phong 的区别LearnGL - 学习笔记目录前一篇:LearnGL - 11.1 - 实现简单的Phong光照模型 了解了 Phong 光照模型的基本认识。这篇:我们将对 Gouraud-Phong 光照模型实现一个简单的实现本人才疏学浅,如有什么错误,望不吝指出。Phong、Gouraud-Phong 的区别在前一篇了解到 Phong 的实现,主要都是依赖 Vertex Shader(顶点着色器)阶段来计算的。而 Gouraud-Phong 比较大原创 2020-07-21 11:05:20 · 549 阅读 · 0 评论 -
LearnGL - 11.1 - 实现简单的Gouraud光照模型 & dot 点积/点乘的作用
文章目录PhongReferencesLearnGL - 学习笔记目录前一篇:LearnGL - 11 - 光与颜色前置篇这篇:我们将对 Phong 光照模型实现一个简单的实现本人才疏学浅,如有什么错误,望不吝指出。Phong在百度百科中也有简介:Phong光照模型Phong 着色器模型,中文也叫:冯氏着色法,该光照模型是很简单的光照模型,只有:环境光、漫反射、高光。环境光 用于模拟物体反射周围的物体颜色,在 phong 中,只是纯颜色值作为环境光直接叠加。漫反射 用于模拟光入射到物体原创 2020-07-21 11:05:10 · 2498 阅读 · 0 评论 -
LearnGL - 11 - 光与颜色前置篇
文章目录光子眼球大脑接收物体颜色总结ReferencesLearnGL - 学习笔记目录本人才疏学浅,如有什么错误,望不吝指出。说到颜色,就会联系到光。个人理解:颜色,就是我们的大脑对某种生物信号的识别,这种生物信号是由:眼球感光后的视网神经编码的生物电信号。分不同光波编码可见光大脑接收解码光子眼球大脑接收呈像光子光是什么?是如何产生的?用通俗之言解读,让你瞬间走进光的世界 - 说的是能量溢出也就是说光子是基本上是从一个物质上能量溢出后而喷发出来的微粒子而光子是按一定的波形运动的微粒子原创 2020-07-16 11:34:03 · 574 阅读 · 0 评论 -
Introduction to Turing Mesh Shaders
顺便一提:UE5 中的 Nanite 技术,虚拟多边形,官方暂时也未公布技术细节,说明几何体可以不限制顶点数量、多边形的数量,可以做到非常密集的的数量,密集到一个像素还可以容纳到数个多边形。目前我也完全不知道是怎么个思路,TQL。多人认为 Nanite 是用 Mesh Shader 来实现的::如何评价虚幻5引擎的Nanite虚拟微多边形几何体技术?。技术不断在升级改革(科技服务在升级、在变化)。唯独不变的还是数学的内容,所以说,数学的魅力有多大(运算模型不变)。Mesh Shader 是201翻译 2020-07-01 19:19:27 · 1811 阅读 · 1 评论 -
LearnGL - 08.0.1 - Camera - GLM版前置篇
文章目录GLM 简单介绍Git 仓库使用ReferencesLearnGL - 学习笔记目录本人才疏学浅,如有什么错误,望不吝指出。上一篇:LearnGL - 08 - Camera - linmath.h 版,了解OpenGL 的一些几何变换,其中包含了摄像机的封装。这一篇:因为 上次封装使用的 Camera 使用的线性代数库 是: linmath.h ,使用起来很不方便,所以这边我们先了一下:GLM,后面再实现一篇 GLM 的 Camera,并将之前所有用到 linmath.h 的地方的内容,都原创 2020-06-29 23:37:58 · 312 阅读 · 0 评论 -
LearnGL - 06.2 - Matrix - 矩阵03 - 逆矩阵、行列式、伴随矩阵、余子式、代数余子式、练习
文章目录逆矩阵-inverse matrix行列式-determinant伴随矩阵-adjugate、adjoint matrix余子式-Cofactor、Minor余子项余子式代数余子式-Algebraic cofactor、Minor伴随矩阵-二维的例子ReferencesLearnGL - 学习笔记目录本人才疏学浅,如有什么错误,望不吝指出。上些篇:LearnGL - 06 - Matrix - 矩阵01,了解了矩阵就是定义一个坐标空间的轴向LearnGL - 06.1 - Matrix原创 2020-06-24 22:15:05 · 2185 阅读 · 0 评论 -
LearnGL - 06.1 - Matrix - 矩阵02 - 向量空间、向量空间的维度、为何矩阵乘法要有 [M x N] * [N * P] 的 N 要相等的限制
文章目录矩阵乘法为何有维度限制?什么是向量空间?什么是向量空间的维度?理解为何有这个限制LearnGL - 学习笔记目录本人才疏学浅,如有什么错误,望不吝指出。上一篇:LearnGL - 06 - Matrix - 矩阵01,了解了矩阵就是定义一个坐标空间的轴向这一篇:这篇再讲一丢丢关于矩阵的乘法内容,这些都是个人看的零散资料总结的内容。矩阵乘法为何有维度限制?就是 3x3 不能和 4x1 的矩阵相乘。但是3x3 的矩阵可以和 3x1 的矩阵向量。第一次遇到这个限制的同学,在看教科书上可能只会原创 2020-06-22 15:43:48 · 424 阅读 · 0 评论 -
LearnGL - 06 - Matrix - 矩阵01 - 齐次坐标、缩放、旋转矩阵(欧拉 Euler 角)
文章目录点在坐标系下的定位3x3扩展4x4添加偏移量齐次坐标缩放矩阵旋转矩阵在 Shader 中实现一些旋转旋转顶点运行效果旋转纹理 UV运行效果总结ReferencesLearnGL - 学习笔记目录本人才疏学浅,如有什么错误,望不吝指出。上一篇:LearnGL - 05.3 - 封装 Main.cpp 中重复 GLFW代码,让新建的项目更方便的开展。这一篇:这篇我们在讲一丢丢关于矩阵的内容。本来我不想写关于矩阵的内容。因为要排版很多内容(Katex挺多),-_-!!!,但是想了一下,还是加上原创 2020-06-19 22:20:06 · 1373 阅读 · 0 评论 -
Unity Shader - Ray Marching - T7 - AO
文章目录运行效果单纯AO光照遮蔽值无AO有AOProjectGGBExcelReferences自学Raymarching汇总:Unity Shader - Ray Marching Study Summary - 学习汇总说个题外话,今天面试虽然没成功了,让自己发现更多的问题。但收获非常的大,让我调整得更好的方向。真的非常感谢这位面试官!此篇为Raymarching告一段落的文章,后...原创 2020-04-29 22:09:33 · 735 阅读 · 1 评论 -
penumbra shadows in raymarched SDFs - 光线步进中使用有向距离场实现软阴影
文章目录Intro - 介绍原文:penumbra shadows in raymarched SDFsIntro - 介绍许多步进用的距离场(distance fields)函数,他们都是本身提供了全局信息。这意味着,当要着色着色某一点是,它可以使用距离场函数(distance function)很简单就探索出周围几何体。这不像传统的光栅器(扫描)...翻译 2020-04-29 10:40:32 · 1133 阅读 · 0 评论 -
OpenGL - 阴影映射 - Tutorial 16 : Shadow mapping
文章目录Basic shadowmap - shadow map的基础知识Rendering the shadow map - 渲染shadow mapSetting up the rendertarget and the MVP matrix - 设置渲染目标和MVP矩阵The shaders - Shader着色器Result - 渲染结果Using the shadow map - 使用sh...翻译 2020-04-10 10:58:24 · 1686 阅读 · 0 评论 -
OpenGL Tutorials - Billboards
原文:OpenGL-Turorial - BillboardsBillboardsBillboard 是3D世界中的2D元素。它不是一个在所有其他东西顶上显示的2D菜单,也不是一个可以让你旋转的3D平面;但介于他们之间的东西,如多数游戏中的:血条。而Billboard区别在于他们的位置是可以指定的,但它们的朝向会一直的朝向镜头。Solution #1 : The 2D way解决方案1:...翻译 2020-03-24 23:52:52 · 795 阅读 · 0 评论 -
OpenGL红宝书的部分学习记录
我看的OpenGL红宝书为:《OpenGL编程指南》-- 原书第9版OpenGL Programming Guide – The Official Guide to Learning OpenGL, Version 4.5 with SPIR-V Ninth Edition一直觉得OpenGL红宝书就不是给初学者看看的。它比较适合有基础,而且有认识OpenGL底层开发人员的公司去阅读。...原创 2020-02-12 14:26:33 · 1327 阅读 · 0 评论 -
Parabola 抛物线-简单公式实现
学习过程中发现一个简单抛物线的公式,好方便(不物理的重力抛物线)#Code IEnumerator Parabola(NavMeshAgent agent, float height, float duration) { OffMeshLinkData data = agent.currentOffMeshLinkData; Vector3 sta...原创 2019-05-06 18:30:30 · 1948 阅读 · 0 评论 -
Graphic资料
Raytracing - 从目前科技来说,光追才值未来的渲染核心技术 - [Announcing Microsoft DirectX Raytracing!](https://devblogs.microsoft.com/directx/announcing-microsoft-directx-raytracing/) - MS里的 Raytracing 的开发博客更多相关光追的内容,另请搜索。.........原创 2018-12-12 08:10:35 · 525 阅读 · 0 评论 -
切线空间
Hello,我是Jave,最近在恶补图形基础知识内容,偶然法线一遍不错的关于:切线空间的文章,于是着手翻译,这也是我第一次翻译这么长的文章,如果文中翻译不当,或是我标志没懂的地方,欢迎大家指正、指点。混乱的切线空间1.假设我假设你熟悉一些基本向量数学和三维坐标系。我还将在整个文档中使用左手坐标系(OpenGL使用右手坐标系)。对于像素和顶点着色器,我假设您理解DirectX着色器的语法(下文...翻译 2018-12-10 22:25:04 · 2588 阅读 · 6 评论 -
Unity Shader - Flat, Gouraud, Phong Shading
Shading modeFlat shading(平面着色)只要三角面的代表点(如:三角面中的第一个index点)被光照到什么颜色,就决定了该三角面的整个面的颜色。某特殊情况,大家应该可以想象到:如果一个很大的三角面中,第一个index点一个聚光灯照到,那么整个大三角面绘制出来的就是光源色如果一个很大的三角面中,几乎被一个聚光灯照射到整个面,但就没照射到代表点(第一个index...原创 2018-07-25 12:34:26 · 1062 阅读 · 0 评论 -
Unity Shader : My Simplest shader(1)
Code/*author : Jave.Lindate : 2018-07-23Testing texture, tintColor, filterAlpha(TTF) img shaderThis is Simplest shader which have texture and tint color, and filter alpha, for ui(2d/3d)...原创 2018-07-24 10:40:04 · 331 阅读 · 0 评论