想要让手机和PC拥有相同的画面质量水平，一直以来都是开发者追求的，但现实是碍于当前软件和硬件的技术发展水平，开发团队必须要跨过相当大的技术门槛。对于一般开发者而言，这就像是一座天秤，画面质量与性能各自在天秤的二端，我们必须有所取捨。

在以前，游戏开发不像现在有这么多的资源能运用，往往一个画面要透过许多技巧或各种假画面，来欺骗玩家眼睛达到在当时技术门槛难以达到的高效画面。本文由Unity技术经理罗志达分享，主要内容是如何利用Unity 2018新的拍摄API来实现高质量画面低Draw Call的场景。

本文中的内容请参考演讲视频：
http://v.qq.com/x/page/a0738kpeuyn.html

项目介绍
下面使用的项目是Unity官方名为Space Shooter的演示项目，这是一个2D游戏射击游戏，使用非常简单的太空图片作为背景。在本文中我们把背景换成了视频后，保持了原来的性能消耗，但画面比起原来的版本要好许多。

改变前的画面：


改变后的画面：


虽然画面变好看了，但对于玩家而言还是太过单调，所以我们做了第二次的调整，把运镜的感觉与摄像头有限度的转动导入了本次的改变，效果好了很多，而且Draw Call并没有增长太多，效果如下：


RenderTexture.ConvertToEquirect()把这张Cubemap在缝合成为一张全景图(Panoramic images)。


最后会生成一张如下所示的图，把这张图包在一颗球中，从里面看就可以还原当时的场景。


最终效果

Recorder
这个测试项目，使用了Unity官方的插件Recorder，它完美的使用上述二个API，并且可以和Timeline整合在一起，搭配Cinemachine的Dolly track轨道安排的路径，依照规划的路线拍出想要的镜头。


Recorder


Unity2018及以上版本中录制360的选项


透过Dolly Track安排镜头的移动路线，依照路径录制场景移动

Post Processing后期处理特效
一般来说，在手机平台的特效都会建议少开，遮挡剔除(Occlusion Culling)或是场景LOD多使用，但在这个预烘焙案例中，反而建议是把所有特效全开，遮挡剔除和LOD能不开就不开，为的就是预烘焙的品质可以得到最好。


后期处理特效关闭


后期处理特效开启

但是由于后期处理特效有些是基于屏幕空间，因此需要注意的是某些特效不这合用在这种流程，否则就会烘出下面这种有问题的图。


并非所有后期处理特效都适合烘焙360

Masking遮罩技巧
有时候我们想让飞机飞过一座桥的下面，但一般来说这种预烘焙360图层已经扁平化，没办法做到在物体下面的效果，这时我们可以另外烘焙一层遮罩，来达成想要的效果。


绿幕制作法

静态图片的360场景
介绍完使用360视频制作的场景之后，我们来谈谈如何用静态的360图片来制作场景。使用图片的好处是占用硬盘空间比视频要少。

我们使用一个密室脱逃的游戏类型来当作Demo进行演示，主角Ethan在一个有六个房间和一个走廊的建筑结构中行走，每个房间都带有一个镜头，主角可以自由行走在这些房间，镜头会主动判断切换。

视频中Demo场景来自ArchViz Pro No.3：
https://v.qq.com/x/page/w0738pal2y6.html

你看到的画面实际上是并不存在真实的3D建筑模型，而是在七个不同的360图片之间作切换，并共用同一组碰撞结构，进而达成这样的效果，重点是Draw Calls还是维持非常低的20以内，很神奇对吗？

360场景原理
这场景是如何制作的呢？



首先必须有建模流程，我们从Asset Store资源商店中购买了一套著名的Archvizpro interior No.3室内设计模型作为本次Demo的模型，在还没烘焙成360之前，正常播放大约Draw Calls平均是2500-3000左右。我们在场景的每一个房间安置了Cinemachine的虚拟镜头(下图红点处)，然后各自用Recorder录制了一张全景图。


建模流程

场景拍摄完后，我们把所有的Mesh Renderer元件都移除，这会让场景只剩下Collider碰撞结构，每个房间的镜头位置都加上一个Sphere圆球，并把刚刚拍好的全景图各自贴回去对应的房间，材质Shader指定为Skybox-Panoramic。由于碰撞结构沿用场景原本的Colliders，镜头的位置也都精准的放在对的位置，因此你会发现这时候的镜头，看出去和碰撞结构的位置会完美的叠合一起。


将模型材质都清除只留下碰撞结构


被圆球包覆眼睛看出去和碰撞结构可以完美迭合

Shader着色器的选择
Unity内置的Standard Shader并不适用在全景图上，Skybox-Cubemap才适合，但Cubemap不适合用在视频格式的全景图，因此我们是使用也是内置的Skybox-Panoramic的Shader。

但目前这二个内置的Shader并没有绿幕Key的功能，因此我们从官网下载Skybox-Panoramic Shader的原始代码，然后自行加上Chroma Key或Alpha Key的功能，通常是技术美术来负责这项工作。


Panoramic Shader放360图片线条才不会歪掉

有了这个Shader之后，运用和前面视频的遮罩制作方式，一样把要留住的物件标记为独立的Layer，然后从Camera中过滤，留下要作为前景的物件，拍出一张带有Alpha的图片或如下图的绿底照片。



把箭头的物件都设为一个Layer，利用镜头过滤掉的物件


拍摄好的绿底Key图片

静态图片和动态视频不同的是，你可以用带有Alpha的图片，甚至用的软体来处理图片，Unity设置好后，可以很容易就把不要的地方去掉。


使用Alpha的图片设定

由于人的眼睛在固定的定点时，只有一只眼睛，所看到的画面并无深度信息，这好比场景被渲染到画面之后就已经扁平化了，因此不管叠了多少层，人眼都无法感知深度的变化，我们可以利用这点来叠上无限层数的前景，随心所欲的设计各种不同的遮罩区域，来达到几乎跟真实3D场景一样的前后效果。



但是要注意：这种方法镜头不能移动，但可以360度的转动。


利用Render Queue来排序前后关系

阴影处理
360原理是被一个圆球包覆，实际上没有真实的地板来投放阴影，因此许多AR或是这种360场景都没有做阴影处理。我们可以放一片网格在脚上跟着主角，阴影会产生在这片临时地板上，再透过Shader把阴影以外的部分去除掉，调低光源的强度让阴影带有一点半透明，就会产生不错的影子效果。


阴影效果

窗户投射的光源
为了要让主角更加融入场景，我们希望主角走过窗户时，要有光投射到身上的效果。

我们可以很简单的把这个房间的背景图复制一份之后，使用Photoshop处理剩下光照的部分并把图片设定作为Cookie。最重要的设定是Alpha Source要设定为From Gary Scale才能以图片灰阶为Alpha。

在镜头的位置摆设一颗Point Light之后，指定这张Cookie并只对主角有作用，就可以达到在对的位置投射窗户的效果到主角身上，完全不需要任何模型作为基础。


使用Point Cookie制作窗户光影

制作镜子反射
还原镜子的反射，我们使用了第二只镜头放在镜子位置的后面，并且只设定对Player物件有反应。因此主角走过去后会被镜头捕捉到，并做成一张Render Texture贴到原本镜子该有的位置，从画面上看来就可以造成几可乱真的镜子叠合假象。


镜子反射

自动切换镜头
Demo的镜头切换使用Cinemachin中里的Clear Shot镜头功能，它可以指定一个镜头群，并智能的判断该切换到哪一个房间的镜头。


Clear Shot制作自动切换镜头

互动制作
从镜子的制作过程中，我们可以发现到，如果有一些想要互动的物件，仍然可以把它们留在场景里不要删除，这些物件在镜头观看的时候还是会和360完美叠合一起，然后可以使用一般的开发流程来添加互动要素。



好处是：
1、不管模型多复杂，最后性能都很好。
2、不管什么奇怪的设备，只要播视频的都能运行。
3、项目可以分为二个，一个用来录制360，一个作为产品项目会很小。



注意事项：
1、录制360必须使用Unity 2018.1以上版本。
2、后期处理特效LOD能开就使开，LOD，OC不要开。
3、带有文字的场景烘完后从内部看字会相反，这时可以从视频来源先水平翻转一次。
4、强烈建议4K质量效果会比较好。



如果是使用360镜头拍摄的是否也能够做同样的处理？答案是可行的，但它的处理方式又会有很多地方需要注意。可以参考上面的演讲视频。希望本文在制作无模型场景方面能够带给你一些启示。



更多Unity的技术内容分享尽在Unity官方中文论坛(UnityChina.cn) !

360

锐亚教育 锐亚科技 unity unity教程