8 JiepengTan

尚未进行身份认证

我要认证

我是渔夫,游戏开发 [shader基础教程(超多案例)](https://study.163.com/course/introduction/1209813803.htm?share=2&shareId=480000001947412) github: https://github.com/JiepengTan/ gmail: jiepengtan@gmail.com

等级
TA的排名 8w+

帧同步教程 Lockstep Tutorial 00 总纲

Lockstep Tutorial前言本教程的目标是普及帧同步技术,含基本帧同步,以及预测回滚式帧同步,不含ECS配套的Blog配套的视频教程视频项目版本对应 关系阶段一视频id项目版本号0none1v0.0.12v0.1.13v0.1.14v0.1.15v0.2.16v0.3.17v0.3.1教程...

2019-09-03 23:48:08

中级Shader教程00 01工具推荐

书籍推荐数学知识 Mathematics for 3D Game Programming and Computer Graphics (Third Edition)opengl Packt.OpenGL 4 Shading Language Cookbook.2Ed.2014图形学 Real-Time Rendering, Third Edition 3.游戏开发优化 Uni...

2018-05-02 13:47:00

中级Shader教程28 GameUI 血瓶

1.实现原理1.颜色公式 col = a + b* cos(2*PI * (c*t + d)) 更多的颜色变换: 比如彩虹的颜色公式: col = .6 + .6 * cos( 6.3 * uv.y / _ScreenParam.y *2. + float4(0,23,21,0) ); 2.绘制高光 一个小圆减去一个大圆就是...

2018-04-28 17:29:18

中级Shader教程23 voronoi算法

1.基本Voronoi算法1.在空间中摆放众多的样本点 points 2.对空间中的每个像素pixel,计算pixel到points的最短距离 minDist 3.根据minDist进行着色伪代码:float3[] points = AllocMemory();UpdatePointPosition(points);foreach pixel in pixels ...

2018-04-28 17:28:36

中级Shader教程27 三种窗前雨滴效果

本篇主要技术点有: 栅格化屏幕空间 函数设计技巧:”凑” 2D旋转.代码实现:0. 栅格化float aspectRatio = 4.0;//每一行雨滴的宽高比float tileNum = 5;//平铺数量uv *= fixed2(tileNum * aspectRatio,tileNum);//栅格化uvuv = frac(uv);uv...

2018-04-28 15:32:18

中级Shader教程26 三种Caustic实现方式

0.提要Caustic的的特征是高光集中而且扭动,模拟的是由于水面的扭动导致阳光的折射集中产生的效果,如图,本篇讲述的是三种模拟算法,并非由光线追踪精确计算得到。 v2f vert (appdata v){ v2f o; o.vertex = UnityObjectToClipPos(v.vertex); o.uv = TRANSFORM_TEX...

2018-04-28 15:31:14

中级Shader教程25 两种涟漪实现方式

1.实现1.空间划分+相邻grid之间采样实现其中 y = sin(31.*t) * smoothstep(-0.6, -0.3, t) * smoothstep(0., -0.3,t)图形解析为: // create by JiepengTan 2018-04-25 // email: jiepengtan@gmail.com// all rig...

2018-04-28 15:29:48

中级Shader教程24 两种雨实现方式

1.思想1.和下雨特效制作一样,通过UV拉伸来呈现速度感,来表现雨2.实现1.简单版本float2 ruv = uv / float2(_ScreenParams.x/_ScreenParams.y,1.0);//原始uv//宽高比正常uvuv = (ruv * 2.0 - 1.0) * float2(_ScreenParams.x/_ScreenPara...

2018-04-28 15:28:53

中级Shader教程20 3D云

1.前置知识链接1.Noise和FBM请参考这篇文章中给出的链接 2.ranymarching 框架 3.多层透明叠加渲染 1.分析&实现1.使用常规raymarching +倒退+ 多层叠加透明渲染1.常用FBM *分布限制来定义距离函数Map(pos) 2.定义密度函数为 Den(pos) = clamp(-(Map(pos)) ,0....

2018-04-27 19:59:21

中级Shader教程19 动态雾

1.前置知识链接1.Noise和FBM请参考这篇文章中给出的链接 2.ranymarching 框架 2.实现原理1.利用FBM来模拟空间雾的密度分布 2.通过raymarch 距离根据密度从前到后多层颜色混合这里的Noise 使用triNoise,其实PerlinNoise 也行,不过perlinNoise,需要的指令较多 3.源码实现1....

2018-04-27 15:22:26

中级Shader教程16 水渲染

1.前置知识链接1.Noise和FBM请参考这篇文章中给出的链接 2.ranymarching 框架 2.分析1.基本形状构造这里利用了Noise本身随机的同时也连续的特性来模拟水面的变动 1.使用FBM来实现水面的基本形状 2.水的动态是通过在Noise中使用time作为一个维度,来实现水的扰动 2.着色1.水渲染需要考虑的...

2018-04-27 15:06:55

中级Shader教程17 海洋渲染

1.前置知识链接1.Noise和FBM请参考这篇文章中给出的链接 2.ranymarching 框架 2.海浪型状的构造1.基本形状构造1.基本周期函数 2.扩散方向 3.Noise扰动 2.性能分析1.还是和地形渲染一样,我们这里采用多种分辨率的地形函数 2.性能关键 .基本周期函数 .Nolise函数的实现 3.实...

2018-04-27 12:24:44

中级Shader教程15 地形渲染

1.前置知识链接1.FBM请参考这篇文章中给出的链接 2.ranymarching 框架 2.抽取地形shader 通用函数  在处理类地形raymarching的过程中,为了优化,在raycast阶段会有一个大循环,为了性能,我们在这里采样的精度低一点,在计算法线的时候精度高一点,因为计算法线的时候,只有一次。 所以我们分为三种不同精度的Map函数,同样为了...

2018-04-27 12:23:29

中级Shader教程21 优化:用shader分摊CPU压力

粒子大规模渲染优化0.优化总览大规模粒子渲染,和动画系统优化一样,需要优化和权衡的是GPU和CPU的负载,同样技巧也相似。动画系统的优化 1.DrawCall的减少    Batch 单个模型顶点数量太多,可以合批的数量不多    GPUInstance 手游限制 2.负载的均衡    CPU:可以通过预计算缓存的方式来优化如插件MeshAnimator ...

2018-04-26 10:25:15

中级Shader教程18 多层透明叠加渲染

0.说在前面1.我们通常说起颜色通常说“这个颜色的rgb值是多少”,而不是说“这个颜色的rgba值是多少”,不说a是因为我们默认改颜色的a = 1.0,即是不透明的 2.所以得提醒:使用rgba表示颜色时,我们最终看到的颜色不是rgb,而是rgb*a。这点对于理解多层透明混合很重要。 3.这个代码将会在后面渲染云和狂风中出现,如果想要真正理解并灵活运用该渲染套路,请重视! ...

2018-04-26 10:08:49

中级Shader教程14 天空渲染

1.实现原理1.使用FBM 来模拟基本的云层形状 2.在FBM的过程中对不同layer位置进行随时间不同程度的偏移2.源码1.单层FBM中不同的层之间移动速度随时间的偏移 float TimeFBM( float2 p,float t ){ float2 f = 0.0; float s = 0.5; float sum =0; ...

2018-04-26 10:07:37

中级Shader教程13 星空渲染

1.实现原理1.使用球坐标来进行空间划分 2.对每个空间划分的grid产生hash 3.根据hashID 定义星星的大小,闪烁周期,明暗程度等 4.在grid绘制圆 用smoothstep 来控制圆的大小 2.源码1.单层FBM中不同的层之间移动速度随时间的偏移 // 通过rd 来进行空间划分 这样在根据相机进行改变float3 Stars(in fl...

2018-04-26 10:06:36

中级Shader教程12 跳动的小球

1.实现原理1.空间划分 2.SDF2.源码简单代码如下:// create by JiepengTan 2018-04-14 // email: jiepengtan@gmail.comShader "FishManShaderTutorial/SDFBounceBall" { Properties{ _MainTex("Base ...

2018-04-26 10:05:42

中级Shader教程11 Default渲染框架

1.默认渲染框架文件Framework3D_DefaultRender.cginc说明: 该库封装了基本raymarching渲染,常用于测试SDF建模, 只需要自己定义Map函数(SDF描述),用于构建整个场景。如果想要使用默认的渲染 可以在shader中使用这几个宏即可 #define DEFAULT_RENDER #define DEFAULT_MAT_COL...

2018-04-26 10:04:36

中级Shader教程10 shader建模工具--SDF

1.作用SDF (Sign Distance Functions)主要思想是计算点到目标模型的最近距离. 在RayMarching中,如果已知射线点到场景中的左右物体的最短距离,就可以知道我们是否已经碰到的了物体,如果没有碰到场景,可以利用这个信息优化下一步步进的距离。 2.概要代码包含在SDF.cginc中 基本函数实现来自Inigo’s Quilez大神的blog...

2018-04-24 11:13:18

查看更多

勋章 我的勋章
  • 专栏达人
    专栏达人
    授予成功创建个人博客专栏的用户。专栏中添加五篇以上博文即可点亮!撰写博客专栏浓缩技术精华,专栏达人就是你!
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv1
    勤写标兵Lv1
    授予每个自然周发布1篇到3篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。