基于Unity快速搭建剪纸风格场景的探索实现

2020-04-16 05:26米星光陈文娟
关键词:视差景深后处理

米星光,陈文娟

(中国传媒大学 动画与数字艺术学院,北京100024)

1 引言

如今,对非物质文化遗产的抢救与保护已在世界范围引起了重视。中国作为拥有5000年历史的文明古国,更是以“保护为主,抢救第一,合理利用,传承发展”[1]表达对优秀传统文化传承与发扬的决心,并在立法、机构设置、文化普查、申报、传承人、宣传等角度都取得了丰硕的成果[2]。

在这其中,中国剪纸以其广泛的群众性、鲜明的地域性、强烈的造型特征[3],使得它成为了能够代表中国鲜明特色的文化标志。如在2016年上映的《功夫熊猫3》和2018年上映的《蜘蛛侠:平行宇宙》,在做中国本土化宣传时,均以剪纸风格的海报吸引了不少国人的眼球;2020年《花木兰》在全球范围内上映前,也使用了剪纸风格的艺术图作为宣传。这些都足以表现出中国剪纸所展现出的蓬勃生命力。

近年来,剪纸文化搭载电子游戏的形式也引发了人们的关注。一些游戏也借助剪纸的形式来制作宣传图,图1分别展示了两款游戏中的剪纸元素。其中,左侧是移动平台的游戏《自由幻想》在腾讯数字文创节展会的“艺术长廊”展区,为玩家们带来的由剪纸非遗大师李金波老师创作的幻想八仙剪纸作品,旨在用数字化与传统艺术结合的方式传承八仙非遗文化。但这样的剪纸要素只占据该游戏宣传活动的一部分,实际游戏画面并未采用剪纸的风格;而右侧的《尼山萨满》这款游戏的画面则展现出了鲜明的中国剪纸特色,但却对中国传统剪纸样式的创新不足,略显保守,并且在遵循传统剪纸风格的基础上没有充分利用现代2D游戏中的技术,导致最终呈现给玩家的画面表现力不足。

图1 剪纸非遗大师李金波创作的幻想八仙剪纸作品和《尼山萨满》的实机画面

伴随愈发强大的科学技术水平,电子游戏所展现出的画面带给玩家一次又一次的惊喜。与追求写实风格的游戏不同是,一些2D游戏表达出的则是自己独树一帜的美术风格,如二维与三维相结合的《奥日与萤火意志》、手绘风格的《空洞骑士》,都着实令玩家惊叹。类似这样的2D游戏,其画面设计往往能够在保持自身美术风格的基础上,模拟出具备纵深感的3D环境效果。

而精美视觉效果的实现,通常离不开以下技术:2D景深效果(2D Depth of Field)、屏幕后处理技术(Screen Post-processing)、 视差滚动技术(Parallax Scrolling)。景深效果本应属于屏幕后处理技术的一种,但由于在2D环境下所实现的景深效果,往往不同于三维空间中以屏幕后处理的方式实现的景深效果,因而此处特别强调是在二维的空间下所执行的。所谓景深效果,是针对一次只能聚集于单个物距的相机,这样的相机在对焦点前后有一个相对清晰的成像范围,而在这个范围外所呈现出的景物则是模糊的[4];屏幕后处理技术则指的是在渲染完整个场景、得到屏幕图像后,再对这个图像进行一系列操作,实现各种屏幕特效,这种技术可以为游戏画面添加更多的艺术效果[5];视差滚动技术即在二维的空间中创造出具有深度错觉的场景,它早在20世纪30年代的传统动画中就通过多平面成像技术有所运用[6]。这些技术使得开发者在二维空间下也能创造出恢弘的游戏世界。

剪纸作为一门基于二维平面的镂空艺术,它非常讲究线条构成,又强调夸张的造型,以及注重轮廓的唯美[7]。其中,剪纸的平面性让它很容易能够与视差滚动技术相结合。本文将尝试结合中国传统剪纸风格与现代2D游戏场景搭建所使用的技术,以创建具备更好视觉效果的剪纸风格场景为研究目标,探索剪纸艺术所能够带来的全新的表现形式。

而得益于游戏引擎的逐渐成熟,使得游戏制作者可以将更多时间用于更有差异性的开发工作上,而不需要在图形渲染、动画功能、物理引擎等游戏基础功能上投入过多的精力。其中,Unity游戏引擎发展到今天已经成为了开发2D游戏最为合适的工具之一。因此,根据中国剪纸的特点,本文将选取Unity游戏引擎作为实现工具,充分利用Unity整合的各项功能,以更好地实现本文的研究目标。

综上,针对现有中国剪纸游戏场景设计的不足,参考现代2D游戏中的视觉效果,在中国传统剪纸美术风格的基础上加以创新,以Unity游戏引擎作为技术实现工具,探索如何快速、高效地搭建出兼顾有剪纸风格与现代2D游戏视觉效果的场景,从而让剪纸艺术能够继续焕发光彩,成为不同时代人们共同的精神财富。

2 剪纸风格场景实现的算法思路

本文的研究目标是实现一个在二维空间下的剪纸风格场景,主要使用到了视差滚动技术、2D景深效果、屏幕后处理技术。

其中,通过视差滚动技术将场景中的元素分为多个图层,并让这些图层相对于摄像机的移动有着不同的速度,离相机越近得移动的越快,从而当相机移动时画面整体有了透视的错觉;2D景深效果能够营造一种在三维空间中特有的纵深感,这是通过给离相机越远的图层配置越高的模糊强度来实现的。由于本文中所实现的场景是二维的,因此不能像三维场景中那样,直接通过屏幕后处理的方式来实现景深效果;屏幕后处理技术则在场景搭建的后期提升整体的视觉效果,如使用泛光后处理技术突出灯光效果以及平滑光照的边缘过渡等。

同时,在整个场景搭建的过程中,设计自动生成算法来快速、高效的进行场景的搭建。自动生成算法包含两个方面:一方面,用于自动生成各个图层下的游戏对象,如利用一棵树作为复制原型,快速生成一整片森林。这一部分以下称为“自动生成多图层物体算法”;另一方面,用于根据不同图层离相机的距离,赋予这些图层不同的模糊强度,从而能够在短时间内构建出二维空间下的景深效果,而不需要人工地为不同图层进行模糊强度的配置。这一部分以下称为“自动生成多图层模糊效果算法”。

此外,根据场景中各元素的排布特点、对镜头的贡献度等,对整个场景进行优化,以保证该游戏场景在运行时帧数的稳定。

综上,本文所使用的算法思路步骤如图2。

图2 本文使用的算法思路步骤

3 场景搭建的具体算法

3.1 视差滚动技术

(1)视差滚动技术的一般实现算法

视差滚动技术能够在二维空间里营造出三维空间中的纵深感。常用的实现视差滚动效果的方法有四种,分别是图层法、精灵法、重复纹理法和光栅法。其中,精灵法和光栅法是在上世纪末受限于某些主机的性能而针对这些主机开发出的方法,对于本文已不再适用。因此,本文主要运用到其余的两种方法:

图层法,它实际上是最直接地模拟三维空间中实现视差滚动原理的一种方法。严格来讲,这种方法已经让空间从二维拓宽到了三维(如图3所示),场景中出现的所有图片元素,都包含了原本二维空间中不具有深度信息。这样,在相机移动时,由于每一图层与相机在深度轴向的距离不同,从而能够产生视差效果。一些显示系统还支持额外对单个图层进行速度控制,即给离相机近的图层额外添加一个与之前相比更快的速度,而给离相机远的图层额外添加一个更慢的速度。通过这种方式,提高各图层的速度衰减速率,这样使得视差滚动的效果在深度轴向较小的空间里也可以更为明显;

图3 《风语世界》中使用视差滚动图层的侧视图

重复纹理法,它将完整的图片分成一个个单元格,每一个单元格的位置都可以单独设置,这样就可以通过让这些单元格循环产生,或者在移出相机的瞬间从相机移出端将其位置调整到移入端,从而产生无限滚动的错觉。这一技术常常用于在俯视角飞行射击游戏中实现滚动的星空背景效果。

本文将借鉴“图层法”来实现视差滚动技术,并借鉴“重复纹理法”来对视差滚动进行优化,实现无限滚动的效果。

(2)基于Unity的视差滚动技术具体实现

在Unity中,如果选择在二维空间下搭建场景,那么对于该空间下的大多数二维游戏对象的渲染是通过名为“Sprite Renderer”组件实现的。不过,该组件并不会像“图层法”中那样通过深度信息进行排序。但取而代之的是,Unity会根据Sprite Renderer组件上的“Order In Layer"属性,来决定多个图片间的渲染顺序。而这实际上就让不同的图片间有了层级的概念,从而可以借鉴“图层法”中的思想,即根据相机的移动速度改变其它各个图层的速度。

在Unity中实现视差移动的伪代码如图4所示:

图4 实现视差移动的伪代码

这样,上述程序就能够控制各个图层对象基于相机移动的速度计算得出自身的移动速度。并且,该程序中还设置了视差缩放系数变量,通过调整该变量的值就可以控制由近及远的不同图层间的速度衰减量,从而形成不同程度的视差移动效果。最后,在决定改变图层对象的位置前做了平滑处理,以得到更柔和的视差移动效果。

(3)基于Unity的自动生成多图层物体算法的实现

如果希望能够让视差滚动效果更为明显,那么就需要更多的图层层级,且每一层级中都要包含有多个游戏对象。现代游戏中,开发人员通常不会以完全人工的手段摆放这些游戏对象,而是会通过一些自动生成算法来快速搭建出所需的场景。

如育碧公司在2017年游戏开发者大会(Game Developers Conference)上分享公司旗下的《孤岛惊魂5》在开发时所用到的自动生成算法[8],其本质上就是先由以人工的方式在场景中布置点、曲线以及面,再由算法根据这些人工的标记进行生成;而制作了《地平线:零之曙光》的开发商Guerrilla Games则在其官网上分享了他们快速生成场景的方法[9]:首先建立一套完整的笔刷系统,这套系统不仅能够在笔刷范围内生成植物、碎石等游戏对象,并且在绘制时还会考虑绘制区域内的地形(如太陡峭的斜坡上不能生成笔直生长的树),以及与附近已生成的游戏对象间的关系(如两棵树不应离得太近、树下应有合理数量的灌木草丛覆盖等等)。这样,制作人员就可以快速地利用笔刷来生成物体,而算法则会在这个过程中帮助合理地规划。

本文所构建的场景与上述算法的应用场景最大的区别在于维度不同。在三维空间下,需要在不同的空间位置生成物体;而在二维空间下,则需要在不同的层级生成物体。而分析上面提到的两种算法,可以发现它们都采用了人工标记配合算法自动生成的思路。对应于三维空间中在不同的空间位置添加人工标记,在二维空间中就是在不同的图层层级下进行人工标记的添加。

Unity中在给各个图层对象下生成子对象时,可以直接采用Unity函数库给出的Instantiate方法。该方法不仅可以配置复制原型、生成位置、生成旋转角度,还可以直接配置所生成对象的父对象。这样就可以直接通过该方法为每一个生成对象指定不同的图层对象,从而快速为不同的层级配置好多个游戏对象。本文选取如图5所示的树木作为复制原型,直接通过Unity函数库中的Instantiate函数生成的效果如图6。

图5 本文实现的项目所使用的复制原型

图6 直接通过Instantiate函数生成的效果图

从图中可以看到,如果仅仅将这些树木划分到不同的图层中,所能实现的效果非常有限。这是因为在三维空间中,依据“近大远小”的透视原理,位于远处的物体应该看起来更小;同时,树木的位置、旋转角度也过于单调,应该增添一些随机的因素。

因此,对上述自动生成算法进行改进。首先为每一个图层对象配置如下的变量:用于记录当前图层所需生成数量的变量,以及其对应缩放系数的变量。而这就是二维空间下对不同图层层级所添加的人工标记。基于此,改进后的自动生成算法伪代码如图7所示:

图7 自动生成多图层物体函数的伪代码

这样,就可以在自动生成时读取该图层的相关配置,为不同的图层生成具有不同位置及缩放的树木对象,从而实现“近大远小”的视觉效果。并且,在生成同一图层下的树木时,每一个树木对象都在限定的范围内随机生成一个不同的位置、旋转角度及缩放系数,以减弱画面的重复感。改进的自动算法执行效果如图8所示:

图8 自动生成多图层物体算法得到的结果

改进后的效果与之前相比较明显有所提升。但由于这些树木的色调完全相同,使得不同图层的树木难以区分,画面所营造的纵深感并不足。

(4)视差滚动技术的优化:无限滚动算法

正如重复纹理法中将完整图片分成单元格并让它们循环产生的思路,Unity中由于可以单独控制每一个游戏对象,因此也常常使用类似的方法,对移出镜头的物体不进行销毁,而是调整其位置,让其再次从其它方向进入镜头的范围。如使用两张背景图片,每张背景图片的大小刚好能填充整个屏幕,假设相机向右移动,那么当其中一张背景图片从左侧离开镜头范围时,程序会将它的位置调整到另一张背景图片的右侧。对另一张背景图片也执行相同的操作,由此就生成了无限滚动的背景。这一优化技巧在现代2D游戏中已经屡见不鲜。但基于本文中所实现的项目,其本身已经有“视差滚动”在游戏运行过程中持续执行,因此需要对无限滚动的一般实现方法做进一步的改进。

以地面图片为例,通过对两张地面图片中移出镜头的那一张进行位置的调整,一般情况下就可以实现无限滚动的效果。但由于本项目中视差滚动的影响,地面图片本身会有一个移动速度,这就会造成调整地面图片的位置时会出现错误的“割裂”的现象(如图9);此外,在制作美术素材时,美术人员通常不方便获知多少的像素单位能够正好填充游戏场景内的相机范围。当搭建场景时,可能需要更多的单位图片才能填充一个屏幕。因此,实现方法中也需要考虑两张以上的地面图片存在的情况。改进后的伪代码如图10所示:

图9 调整图片位置后出现的错误结果

图10 自动生成多图层物体函数的伪代码

上述伪代码只截取了检测物体是否会从屏幕左侧移出的情况,从其它方向移出屏幕的算法思路与其相同。

此外,由于像树木这样的物体并不存在精确接缝的问题,因此也不需要每一帧都对它们所处的位置做检测。所以脚本中还添加了控制检测频率的代码。这样,就可以针对不同类型的游戏对象配备不同的检测频率,这对优化计算量是十分有帮助的。

这样,通过无限滚动算法及视差移动技术,在游戏运行过程中,当相机发生移动时,不同图层的树木会有不同的移动速度,且离开镜头范围的游戏对象会调整其位置形成无限滚动的视觉效果(如图11)。

图11 无限滚动的效果

3.2 2D景深效果

(1)景深效果的一般实现算法

在三维空间中,往往利用屏幕后处理技术中的景深效果来营造画面的纵深感。但在二维空间下,如果直接使用屏幕后处理的方法进行景深处理,则得到的结果与期望的并不相同(如图12所示)。

图12 利用屏幕后处理的方式得到的错误结果

从图中可以看到,场景中所有的元素都被模糊处理了,而如果调节景深效果的相关参数,会发现无论如何调整,都只会出现完全模糊或完全清晰两种极端的结果。这是因为,在三维空间中,作为屏幕后处理技术之一的景深效果是基于场景中物体的深度信息来实现的。而正如前文中提到的那样,二维图片是通过Sprite Renderer组件渲染到屏幕上的,而该组件对于二维图片的着色处理并没有为其设置不同的深度。也就是说,即便将这些树木对象分配在不同深度轴向的位置上,以屏幕后处理技术为基础的景深效果也无法发挥它的作用。因此,为实现二维空间下的景深效果,需要采用一种与三维空间下截然不同的实现方法。

(2)基于Unity的2D景深效果具体实现

在过去的游戏中,会直接利用一些图像处理软件对二维图片进行模糊处理。这样做的好处是,在游戏引擎中对二维图片进行渲染时,着色处理仍然仅仅是对原图的纹理采样,对GPU的压力较小。但这样处理也有更为明显的缺点:首先,需要对每一张不同的图片进行模糊操作,由此极大地增加了工作量;第二,这些图片相较之前都会额外有一张模糊处理的版本,如果要求该图片在多个需要视差滚动的图层中出现,还需要通过设置不同的模糊参数制作出多个相应的版本,这不仅提高了内存占用,游戏自身容量也成倍的增加了;第三,如果在之后需要调整这些图片的外形,尽管可以返回到原图进行修改,但修改完成后又需要再次进行模糊处理。而直接在已经经过模糊处理的图片上绘制细节无疑是一场灾难。

基于上述原因,本文尝试采用能够进行模糊处理的着色器来实现二维空间的景深效果。与使用图像处理软件进行模糊操作不同的是,模糊着色通常的实现方法是在二维图片被渲染到屏幕上之前,通过对原图纹理采样得到的每一个纹素的颜色值同它周围纹素的颜色值做给定程度的均值处理,以达到模糊的视觉效果。通过这种方法,只需要在程序中调整模糊强度参数,就可以基于原图生成不同程度的模糊版本(如图13所示),这样极大地减小了工作量,并节省了游戏的占用空间,且方便了后续对原图细节的调整。

图13 应用不同模糊强度的效果

(2)基于Unity的2D景深效果具体实现

同自动生成多个图层的树木对象相同,分别为每一个树木对象分配相应的模糊材质显然是不利于开发效率的。本文实现自动分配模糊材质算法的思路是:将该算法与自动生成多图层物体算法相结合。仍然通过获取图层上的人工标记来得到当前层级的相关配置参数,再根据这些配置参数为生成的物体创建并分配相应模糊强度的材质。通过该算法所生成的模糊效果如图14所示:

图14 自动生成多图层模糊效果算法得到的结果

从Unity编辑器的Scene窗口可以看到(如图15),尽管该场景是一个没有深度轴向环境的二维空间,但是仍然能够搭建出一个效果较好的透视错觉。

图15 Unity编辑器的Scene窗口

3.3 场景中其他装饰物及角色的添加

在场景的主要部分完成后,为场景添加一些诸如光束、落叶、湖面等装饰性的元素,并将游戏角色添加到画面当中,最终利用屏幕后处理技术使画面中的光照效果更加明显并完善其边缘的平滑过渡。由此得到的效果如图16所示:

图16 添加装饰物及角色得到的效果

4 研究结果及对比分析

目前利用本文中的算法得到的效果如图17所示。同时选取了2018年推出的剪纸风格的游戏《尼山萨满》作为对比(如图18所示)。

图17 通过本文算法得到的效果

图18 2018年推出的游戏《尼山萨满》

从图中可以看出,《尼山萨满》这款游戏采用二维游戏中常见的横版视角,并尝试模拟出三维空间下的多层背景。但“远处”的场景元素在视觉上只有颜色深浅的变化,尽管通过为场景中添加灯光使得一些图片元素的颜色有了渐变的效果,但画面所表现出的纵深感仍然不足。

而通过本文算法生成的场景,具有如下优势:通过自动生成算法,场景搭建的效率大大提高;随着图层离相机的距离逐渐增大,不同图层树木对象的缩放系数整体上呈减小的趋势,从而有了“近大远小”的视觉效果;同一图层的树木之间有微小的旋转角度、缩放系数的变化,减弱了画面的重复感;最后,模拟了三维空间中的景深效果,越“远”的树木看起来越模糊,并且当游戏运行时,不同图层的树木会根据相机的移动对应得出不同的移动速度,距离相机越近的图层移动得会越快,这样进一步增强了场景的纵深感。

5 结论

本文针对中国剪纸游戏中所存在的问题,从现代2D游戏中所用到的技术入手,并以中国传统剪纸艺术为基础,提出基于Unity的自动生成兼顾剪纸风格与现代2D游戏视觉效果场景的算法。从实现的结果和与其他游戏的对比分析表明,本文的算法不仅仅能够快速高效地搭建出一个场景,其所实现的画面风格也能够更好地营造出场景的纵深感,并且通过对现代2D游戏中技术的综合运用,使得整体的视觉效果得到了提高。但目前在视差移动算法中所控制的缩放系数主要靠人为设定,得到的画面效果形式较为单一,在今后,将继续研究如何进行风格化的视差移动缩放函数的设计,以更好的实现不同视觉效果的剪纸风格场景。

猜你喜欢
视差景深后处理
车身接附点动刚度后处理方法对比
基于自适应窗的立体相机视差图优化方法研究
一种结合物理模型和景深估算的图像去雾算法
视差边缘优化的SGM 密集深度估计算法∗
果树防冻措施及冻后处理
Kobe—one of the greatest basketball players
基于分割树的视差图修复算法研究
基于柴油机排气后处理的排放控制技术应用研究
发动机排气后处理技术
简明FOTO词典:景深