火焰特效基础纹理,火堆材质纹理制作

火焰特效在游戏场景与技能中属于出镜率比较高的类型。场景中火焰特效用来制作篝火、灯火或者某些墓地诡异的火苗等;技能中,有火球释放、受击效果等。

特效原理分析:
制作火焰需要了解火焰的动态、火焰中心生成内外焰、高亮高热、火苗形态随机喷射、纹理面积逐渐衰减、燃烧时伴随着黑烟与残渣四处飞扬、有小火星作点缀等。接下来先从火堆材质纹理制作开始学习。

火堆材质纹理制作
先来制作火焰的基础纹理。由于网上有很多特效贴图的素材库,有条件的同学可以在各大CG论坛中下载,这里讲一个在没有素材库的情况下制作火焰纹理素材的方法。
打开Photoshop(编者使用的版本是CS6),使用快捷键Ctrl+N新建一个高度和宽度都是512像素的空白图案.
新建图案后,使用快捷键D,将颜色表复位为前景色黑色,背景色白色。使用快捷键Alt+Delete将当前图层使用前景色——黑色填充,图层整个填充为黑色作为纹理底色。
找到编辑窗口右下侧“图层”面板,在下面工具栏中单击“新建图层”按钮,新建空白的图层,黑色背景层上出现空白图层。选中这个新建的图层1开始纹理制作.
使用快捷键Alt+Delete在新图层中填充黑色,在Photoshop菜单栏找到“滤镜”菜单,选择“渲染”类的“分层云彩”。
整张图片全部变成了黑白噪波纹理。随后选中左侧工具栏中的橡皮擦工具,在编辑窗口上方设置不透明度为50%。在图层中使用橡皮擦工具对噪波纹理进行修整,最终修整为如图所示的样式或者差不多的样式。这是火焰的基本纹理。建议画不好的同学还是去CG论坛上找找现成的火焰纹理进行下面的制作,有耐心想学习手绘贴图的可以尝试自己绘制纹理。

单击Photoshop“文件”菜单,将纹理图片存储为TGA格式的文件,勾选保存通道,选择32位的格式存储(24位不会存储Alpha通道)。基本的火焰纹理就制作完成了。接下来需要给这个基础火焰贴图加一个纹理叠加层,建议还是在网络各CG论坛中搜索一些火焰的纹理图案。

火焰特效基础纹理,火堆材质纹理制作

火焰特效基础纹理,火堆材质纹理制作

准备好这两张火焰纹理,打开Unreal Engine 4编辑器,把这两张纹理贴图导入到引擎Content根目录Textures文件夹中,做好文件命名,准备将纹理贴图制作成材质。
如图所示,在Materials材质文件夹下建立一个新的材质球,将它命名为Fire,双击Fire材质球图标打开材质编辑窗口。由于火焰本身是光源,不会受到其他光源影响,高热高亮是它的基础属性,所以材质中,高亮叠加及无光模式是纹理表现的必要属性。

火焰特效基础纹理,火堆材质纹理制作

在材质属性窗口中将Blend Mode混合模式设置为Additive高亮叠加模式,光照模式Shading Model设置为Unlit无光模式,勾选Two Sided材质双面显示。

火焰特效基础纹理,火堆材质纹理制作

按住T键,在材质编辑窗口中单击鼠标左键,创建Texture Sample纹理表达式,在纹理表达式的属性窗口中添加刚才在Photoshop里制作的基础火焰纹理。
由于材质是用在粒子系统中的,还需要添加Particle Color表达式来允许粒子系统颜色模块控制材质颜色。将纹理表达式与粒子颜色表达式用乘法表达式连接,相乘结果连接到材质Emissive Color自发光通道,如图所示。材质预览窗口中可以看见纹理基本样式了。

火焰特效基础纹理,火堆材质纹理制作

按住T键,在材质编辑窗口中单击鼠标左键,建立纹理表达式,属性窗口中选择另外准备的火焰叠加纹理,把这个贴图纹理添加到表达式中。
将火焰纹理表达式与火焰叠加纹理表达式的Alpha通道相乘,乘法结果与Particle Color的Alpha通道进行乘法运算,结果连接到材质Opacity透明通道。

火焰特效基础纹理,火堆材质纹理制作

由于案例中火焰叠加纹理是JPG格式,没有Alpha通道,所以将JPG纹理表达式的R通道与火焰贴图Alpha进行相乘,这样也是可行的。R、G、B通道与Alpha通道一样,属于单通道类型,单通道之间可以相互连接而不会出错。
实际应用中,火焰的材质纹理并不是完全静止的,火焰在燃烧的过程中不断地改变自身形态,参照这个原理,静态纹理之中还需要添加一些动态。
复制(Ctrl+C)红色火焰叠加纹理表达式,在旁边粘贴(Ctrl+V),按住P键,单击鼠标左键,在编辑窗口中建立Panner坐标平移表达式,将Panner表达式连接到复制出来的叠加纹理表达式UVs节点,Panner属性窗口中将X轴数值设置为0.05,使纹理从右至左滚动。

火焰特效基础纹理,火堆材质纹理制作

将Panner与Texture Sample表达式同时框选,然后复制粘贴出来,在粘贴出来的这一组中,将Panner属性窗口中的X轴数值归零,Y轴数值设置为0.1,使纹理从下至上滚动,与前面的一组滚动纹理在速度与方向上做区别。在任意一个Panner表达式前添加一个TexCoord纹理坐标表达式,用来调整纹理图案的UV拉伸。

火焰特效基础纹理,火堆材质纹理制作
TexCoord表达式属性窗口中,U与V数值分别设置为0.1、0.2,把纹理拉伸,将纹理X轴压缩至10%,Y轴压缩至20%大小。
将这两组纹理滚动表达式的R通道连接到Add加法表达式,使两个纹理图案相加。
再次复制火焰叠加纹理表达式并粘贴。单击鼠标右键查找Rotator旋转表达式并添加到编辑窗口。连接Rotator表达式到火焰叠加纹理表达式的UVs节点。完成以后,框选复制这两个表达式并粘贴,选择任意一个Rotator表达式,属性窗口中将Speed的数值改为-0.1,区别两组纹理的旋转方向,Center Y的数值改为1,使纹理不规则旋转并错开两组纹理的旋转位置。将这二组旋转纹理表达式的R通道连接Add表达式进行加法运算。

火焰特效基础纹理,火堆材质纹理制作

将连接滚动纹理与旋转纹理的两组Add加法运算结果,用乘法(Multiply)表达式连接起来。可以把控制纹理运动的表达式集合看作一个整体模块,统称为“纹理扰乱模块”。将连接了两组Add结果的乘法表达式,连接到新乘法表达式的A节点。复制火焰基础纹理表达式并粘贴,纹理表达式Alpha通道连接到乘法表达式B节点,使动态纹理强制在火焰基础纹理范围内运动。

火焰特效基础纹理,火堆材质纹理制作

如图所示制作完纹理扰乱,添加Multiply表达式,A节点连接纹理扰乱动态的结果,B节点连接一个数值为0.2的常量表达式。这组表达式是扰乱动态的控制开关,常量表达式用来控制强度。

火焰特效基础纹理,火堆材质纹理制作

例如,这里常量的数值是0,便不会显示扰乱动态,相当于将动态纹理开关关闭了。常量参数是1,会完全显示扰乱纹理的动画,相当于把纹理动态开关打开。这里常量表达式的数值取0.2,意思是只需要扰乱纹理动态20%的效果。数值为1时开启100%效果。
如图所示,扰乱纹理开关表达式右边,我们添加了加法(Add)表达式,按住U键并单击鼠标左键添加TexCoord表达式,将这个TexCoord表达式连接到加法表达式A节点。加法表达式的B节点连接前面扰乱纹理开关的乘法输出结果。将这个Add表达式的结果,分别连接到基础火焰纹理表达式与火焰叠加纹理表达式的UVs节点。现在能够在材质预览窗口中看见纹理表面有一层水波样的动态纹理,这种制作扰乱纹理动态的方式称为纹理噪波。

火焰特效基础纹理,火堆材质纹理制作

如图所示,是火焰材质节点总图,虽然比较基础,一般来说也够用了。接下来在粒子系统中制作火焰。

火焰特效基础纹理,火堆材质纹理制作

游戏UI设计的流程

场景火堆制作,火堆主体制作