[{"data":1,"prerenderedAt":256},["ShallowReactive",2],{"\u002F2017-06-03-ue4-content-driven-mulipass-rendering-note":3},{"id":4,"title":5,"body":6,"date":231,"description":12,"extension":232,"meta":233,"navigation":236,"path":248,"seo":249,"stem":250,"tags":251,"__hash__":255},"blogs\u002F_legacy\u002F2017\u002F2017-06-03-ue4-content-driven-mulipass-rendering-note.md","UE4官方Multipass Rendering笔记",{"type":7,"value":8,"toc":216},"minimark",[9,13,24,27,30,34,37,44,47,50,56,59,65,68,71,77,80,83,89,92,98,101,104,107,112,115,121,124,128,131,137,140,145,148,151,154,159,162,165,168,171,174,180,184,187,190,193,197,200,203,207,210,213],[10,11,12],"p",{},"这是一篇记录性笔记，可能并没有什么实质性的内容。",[10,14,15,16,23],{},"看这个视频本质上就是出于一个误会，视频标题是",[17,18,22],"a",{"href":19,"rel":20},"https:\u002F\u002Fwww.youtube.com\u002Fwatch?v=QGIKrD7uHu8",[21],"nofollow","Content-Driven Mulipass Rendering","，并不是针对某个特效的Step-by-step的教程，而是一些原理上的解释。",[10,25,26],{},"故而其中有很多内容都是关于3D渲染的公式和实现的，因此也就不会进行深入的研究。之所以选择UE4这样的引擎来做游戏，就是为了避免过度的接触细节。就像是学习高级语言之后，编译原理什么的粗略了解就可以了。",[10,28,29],{},"当然，遇到了非实现不可的特效的时候也没有办法。说实话，不太想和那些Paper呀、公式呀什么的打交道：D",[31,32,33],"h2",{"id":33},"材质原理",[10,35,36],{},"视频中提到的两个概念很有作用，就是Scatter和Gather",[10,38,39],{},[40,41],"img",{"alt":42,"src":43},"clip_image001","\u002Fwp-content\u002Fuploads\u002F2017\u002F06\u002Fclip_image001_thumb.png",[10,45,46],{},"官方的RT示例中，水波纹扩散就是使用的Gather的方式进行运算的。",[10,48,49],{},"这是以前在理解上的一个误区，不能将整个运算目标当作一张贴图来看待，而应该去思考没一个区域（像素）应该处于什么状态。",[10,51,52],{},[40,53],{"alt":54,"src":55},"clip_image002","\u002Fwp-content\u002Fuploads\u002F2017\u002F06\u002Fclip_image002_thumb.png",[10,57,58],{},"以及",[10,60,61],{},[40,62],{"alt":63,"src":64},"clip_image003","\u002Fwp-content\u002Fuploads\u002F2017\u002F06\u002Fclip_image003_thumb.png",[31,66,67],{"id":67},"透视光学",[10,69,70],{},"视频中有提到水面的折射近似算法，就是所谓的Experience Based Magic Method。",[10,72,73],{},[40,74],{"alt":75,"src":76},"clip_image004","\u002Fwp-content\u002Fuploads\u002F2017\u002F06\u002Fclip_image004_thumb.png",[10,78,79],{},"在光学现象中，还有提到chromatic aberration，也就是色差的实现方式。",[10,81,82],{},"色差的基础实现使用RGB Offset，不过演示中使用了spectral photons来进行。但pectral photons究竟是什么却没有搞明白，粗略搜索了一下也不得其门而入。感觉上像是光谱聚合吧，使用光谱这样的线条来进行模拟而不是根据点来进行计算，可以减少运算量。",[10,84,85],{},[40,86],{"alt":87,"src":88},"clip_image005","\u002Fwp-content\u002Fuploads\u002F2017\u002F06\u002Fclip_image005_thumb.png",[10,90,91],{},"另外，色差是什么呢？可以参照维基百科的解释：",[93,94,95],"blockquote",{},[10,96,97],{},"色差是指光学上透镜无法将各种波长的色光都聚焦在同一点上的现象。它的产生是因为透镜对不同波长的色光有不同的折射率（色散现象）。",[10,99,100],{},"对于水面的模拟很有作用，不过实际上，这部分的原理并不是特别的重要，社区有个Ocean的项目对水面、水下的效果模拟都处理的比较好。",[31,102,103],{"id":103},"特效",[10,105,106],{},"在视频页面能够找到项目的下载地址，项目中就是在视频里面演示的那些效果。",[108,109,111],"h3",{"id":110},"flowmappainter","FlowMapPainter",[10,113,114],{},"基于RenderTarget绘制的FlowMap水面演示",[10,116,117],{},[40,118],{"alt":119,"src":120},"clip_image006","\u002Fwp-content\u002Fuploads\u002F2017\u002F06\u002Fclip_image006_thumb.png",[10,122,123],{},"总体和ContentExample里面的RenderTarget在原理上是差不多的，使用的FlowMap也是材质节点，如果有用到的话可以参考一下。",[108,125,127],{"id":126},"fluidsimulation","FluidSimulation",[10,129,130],{},"流体模拟",[10,132,133],{},[40,134],{"alt":135,"src":136},"clip_image007","\u002Fwp-content\u002Fuploads\u002F2017\u002F06\u002Fclip_image007_thumb.png",[10,138,139],{},"基于纳维－斯托克斯方程（Navier-Stokes equations）的流体模拟，这个方程可以参考下维基的解释：",[93,141,142],{},[10,143,144],{},"纳维－斯托克斯方程（Navier-Stokes equations），以克劳德-路易·纳维（Claude-Louis Navier）和乔治·斯托克斯命名，是一组描述像液体和空气这样的流体物质的方程。这些方程建立了流体的粒子动量的改变率（力）和作用在液体内部的压力的变化和耗散粘滞力（类似于摩擦力）以及重力之间的关系。这些粘滞力产生于分子的相互作用，能告诉我们液体有多粘。这样，纳维-斯托克斯方程描述作用于液体任意给定区域的力的动态平衡。",[10,146,147],{},"很复杂……",[10,149,150],{},"第一步，Advect，似乎是叫平流计算？不过日式的叫法移流方程式似乎更加的能方便理解，据说原理和上面的FlowMap的差不多。",[10,152,153],{},"第二步，计算散度，散度这个东西似乎以前物理中有学过。",[93,155,156],{},[10,157,158],{},"散度是向量分析中的一个向量算子，将向量空间上的一个向量场（矢量场）对应到一个标量场上。散度描述的是向量场里一个点是汇聚点还是发源点，形象地说，就是这包含这一点的一个微小体元中的向量是“向外”居多还是“向内”居多。举例来说，考虑空间中的静电场，其空间里的电场强度是一个矢量场。正电荷附近，电场线“向外”发射，所以正电荷处的散度为正值，电荷越大，散度越大。负电荷附近，电场线“向内”，所以负电荷处的散度为负值，电荷越大，散度越小。",[10,160,161],{},"就是这样的一个感觉。",[10,163,164],{},"第三步，计算压力；第四步，计算压力梯度。",[10,166,167],{},"这两步都是压力处理，在视频中讲解时似乎被算做了一步：D",[10,169,170],{},"每一步都会使用到部分前面计算的结果，全部都是通过RenderTarget进行中继的。",[10,172,173],{},"项目中有几个示例，分别是2D空间和3D空间内的流体模拟。",[10,175,176],{},[40,177],{"alt":178,"src":179},"clip_image008","\u002Fwp-content\u002Fuploads\u002F2017\u002F06\u002Fclip_image008_thumb.png",[108,181,183],{"id":182},"hitmaskrender","HitMaskRender",[10,185,186],{},"就是在被命中的地方展示受到伤害的贴图，由于有密集恐惧症，就不贴图了，原理上比上面的都简单，就只是利用RenderTarget来做一个Mask而已。",[10,188,189],{},"但是其材质蓝图也是很复杂的，官方这个展示在各个细节方面都很\"认真\"。不仅仅做了mask，还有做法线上的Mask处理。",[10,191,192],{},"不过不知为何有几个地方有莫名的蓝图失连……所以怎么也没法把项目还原到官方视频中的那个效果。还有一个地方就是可能因为视频制作的时间比较靠前，在获取目标点的UV时，没有使用后面有的Trace UV功能，而是制作了一个UnWrap的Material来操作。",[108,194,196],{"id":195},"paintingvoluemtextures","PaintingVoluemTextures",[10,198,199],{},"非常酷炫的使用VR进行绘制的云的效果，是VR的……没法测试。",[10,201,202],{},"原理上和流体的应该差不多。",[108,204,206],{"id":205},"volumetextures","VolumeTextures",[10,208,209],{},"就是官方展示的那个3D的UV动画效果，使用了Custom Node，然后里面是有些复杂的Shader……",[31,211,212],{"id":212},"总结",[10,214,215],{},"果然做特效是件很复杂是事情，3D图形学实在可怕，还好引擎已经将大部分东西都封装好了，只要不追求酷炫，基本就不太需要关心这些，大概……",{"title":217,"searchDepth":218,"depth":219,"links":220},"",2,3,[221,222,223,230],{"id":33,"depth":218,"text":33},{"id":67,"depth":218,"text":67},{"id":103,"depth":218,"text":103,"children":224},[225,226,227,228,229],{"id":110,"depth":219,"text":111},{"id":126,"depth":219,"text":127},{"id":182,"depth":219,"text":183},{"id":195,"depth":219,"text":196},{"id":205,"depth":219,"text":206},{"id":212,"depth":218,"text":212},"2017-06-03","md",{"layout":234,"status":235,"published":236,"author":237,"author_login":239,"author_email":240,"wordpress_id":241,"wordpress_url":242,"date_gmt":243,"excerpt":244},"post","publish",true,{"display_name":238,"login":239,"email":240,"url":217},"风铃","flinkor","flinkor@foxmail.com",1765,"\u002F\u002F?p=1765","2017-06-03 08:26:07 +0000",{"type":7,"value":245},[246],[10,247,12],{},"\u002F2017-06-03-ue4-content-driven-mulipass-rendering-note",{"title":5,"description":12},"_legacy\u002F2017\u002F2017-06-03-ue4-content-driven-mulipass-rendering-note",[252,253,254],"UE4","RenderTarget","Rendering","NJsTELXWuLwdbFnOd8Ez1DGEBE4ywsugN5G3tLrwTSg",1788763179999]