前言
从在后世界末日世界中创造视觉上可信的环境到支持复杂的故事叙述,灯光在《最后生还者》中发挥着巨大的作用。本次演讲旨在通过我们的概念艺术灵感、照明管道中的实验以及我们为实现所需的渲染结果。该课程将为您提供我们的游戏内照明和电影照明之间的基本流程和差异。
灯光在游戏中起到了巨大的作用,从创造一个视觉上完美的环境和角色,再到支持复杂的故事叙事。

概述与背景
概述

这个演讲主要的目的是让大家了解我们的灯光流程,灯光的改进是如何从概念设计中汲取灵感,我们的游戏内灯光和电影灯光的经验,以及它们之间的差异。
背景

游戏故事发生在20年之后,那时候真菌感染在人类中爆发,军方已经在许多主要的战区建立了隔离区;所以他们设置了检查点,在那里对平民进行皮下感染测试。
对比

对比是其中一个关键要素,我们非常希望能够在游戏中展现故事、人物、环境以及游戏的玩法。

这里有一些环境概念,可以从很低的亮度中看出来,这片区域黑暗的想法。感染实际上隐藏在其中,所以灯光必须创造出真正令人毛骨悚然和忧郁的基调。


也有郁郁葱葱的,杂草丛生的环境,需要有充满活力的灯光,以显示微妙的自然之美,植被在20年之后重新爬满世界。
自然光至关重要

我们会问这个世界上还有什么光源存在?对于打光师来说,最大的挑战之一就是我们能够使用的人造光源很有限。

由于这些原因,大部分的电力或者人造光源确实远离了这个世界,所以自然光源变得至关重要。

关键的阳光和天空,它们是主要的光源,大部分的环境都是背光的,只能靠间接光进行照明。
间接照明管线
什么是间接光?(Bounce Light)

大多数人应该已经有了答案,所以我们快速过一下。
间接光是一种基于间接照明的灯光,它能够在游戏中创造柔和的阴影,并不同表面相互作用下显示出不同的高光于光源方向。

此外,间接光展示了模型和阴影微妙的细节之美,这正是我们想要的。如果你注意到这个概念艺术,你能够看到的只有室内照明,而没有直射光。
手电筒间接光

手电筒是游戏中的关键元素之一,这正是我们真正想要在低光条件下为玩家提供的支持功能。让间接光在手电筒上表现是这个项目的一个重大举措。
实现方案

让我们来看一下照明管线,所以我们仍然使用着非常相似的照明系统,我们就是在混合系统的基础上,之后进行了三个改进。我们烘培了静态照明和顶点照明在光照贴图上,关于动态灯光部分因为仅适用于直射光,比如实时光或者太阳光之类的。阴影是烘培阴影和实时阴影的组合。

我们使用了三种技术上的改进:
- 主导方向
- 角色的环境阴影
- 手电筒的间接光
主导方向

这是一种用来烘培灯光方向进入到环境的方法,条件是这块区域是没有实时阳光的环境光照的。这储存了3个模块,灯光方向、颜色和强度。这创造了更多的高光方向,在与光照贴图和法线贴图的组合之后创建出更真实的场景。
参考依据

以下展示的图片都只有环境光,没有直射光。如果你注意看灯光如何在表面上进行反射以表现高光。

环境光对于这些照片来说是很重要的,它提供了一个具有一般照明的区域。与定向光相比这种类型的照明它的半径与亮度非常舒适。

环境光同样也从一个场景的入光口进入,也被称为自然光。你可以在你家里的任何地方找到他,在一个走廊、仓库或者在一个非常阳光明媚的日子,大雾天或者城市的夜晚。

你现在看到的停车场照片,我主要拍的是天花板上的橙色光和车上的光,他们实际上来自于间接光。有一块橙色的防水布在后面,阳光穿透防水布然后照亮了。在右侧的车库照片,环境光也照亮了整个仓库。
对照测试

我们开始尝试一些东西,这是前两个测试关卡,我们曾经测试过主导方向。后面的窗户是光源,再次重申没有直接光,两个关卡我们都使用了同样的参数,左侧是打开了主导方向功能,右侧则是关闭。

我们来看看场景中的模型,只使用单一的着色器,也只使用一个平均色。对于我来说,灰色纹理是一个非常简单的棋盘格图案,加上几何法线,这就是全部,没有什么特别的。
所以这就只是一个灯光调试(debug)场景而已,你可以看到当左侧的功能打开时,高光全部都符合主光源方向,地板和天花板以及台面,所有的表面是都有同样的高光。
而右侧的功能关闭了,高光反射实际上现实是错误的,最强的坏值是甚至是与摄像机视角相反的,而并非与主光方向相反。这看起来很不对劲,我们不想这样。

这是只显示了光照贴图和法线贴图的情况,同样,当启用该功能的时候,你会注意到更多的几何体表现了正确的灯光方向,并且效果更强更好。另一边则表面光线特征是不能表现的,并且法线效果很弱甚至是错误的。

最后是具有漫射图,光照贴图,法线图,高光图组合的结果,我们证明了这是我们可以展现出来的东西。这个想法可以实现概念艺术中我们想要的效果,主导方向恰当地展示了光方向和强度带来的效果。

现在我们把摄像机转到180度,如果你注意右边的图的话,这是相反的角度,你可以发现现在的高光不是很强,因为没有面向光的方向。这是一种基于现实的正确方法,这就是我们想要的,并且几乎仍然正确地出现。
游戏中的主导方向

这是我们在游戏上的一些屏幕截图,第一个窗户在门外,窗户是入光口,所以地板和天花板在这个方向看高光很强。你也可以看到乔尔跟随地板上的灯光指示前进。

这是另一个正确的方向,光从窗外射入,墙壁和地板从这个角度来看高光真的很强。


这里也是一样,光源方向从外部进入,如果你注意到左边的墙壁,有一堆照片的那边,这里的高光更强。然后我们把摄像机转到180度,在同一面墙上跟我们之前看到的比起来要更干更弱。因为这是一个“冷面”,他不是面向光源方向的视角。另一方面,你可以注意到后面的墙高光更强,因为它符合光源方向。
周边阴影

第二个改进就是环境阴影,这适用于角色和动态对象。我们基于主要光源方向来制造的阴影效果,这对项目来说是一个巨大的胜利,因为他把这个角色融入了背景之中。
实现原理
两者都是由我们的图形工程师迈克尔(Michael Iwanili)开发的,我将展示他从《最后的生还者》的灯光技术中使用的技术。

他使用球体近似遮挡,对于每个球体分别遮挡了几个不同的组件。
周边分量

第一个是周边分量,这是一个余弦加权百分比的半球闭塞的球体,如果你完全逆向与光线入射更方向,你就完全处于阴影中。
方向分量

另一个是方向分量,它从一个阴影中的点沿着光源方向追踪一个圆锥体,检查与球体的交集。这样就可以得知光源方向来自哪里了。
对照测试
下面通过视频演示比较有无环境阴影的差异,如果你注意右边,你可以看到角色一路走过来。在右边的走廊上,有投下一个阴影。


左侧的角色并没有真正的着地阴影,右边则可以看出来,尤其是底部的灯光更明显。左边的角色看起来是漂浮着的。


他们看起来是漂浮的,并且看起来并不正确。因此,一旦这个功能被启用,它们就会正确地表现接地阴影,你可以看到边上的柱子接收正确的阴影。所以实际上,它在整个场景中都会使用,这真的很微妙,你到处走动的时候可以看出来。

我们使用了一个非常简单的胶囊体来替代计算阴影,我们不使用实际的角色模型,因为它们非常复杂。这样要节省得多性能开销,而且用柔和的阴影看起来很不错,我们真的很喜欢。对于每个角色,我们有大约14个胶囊来替代它们身体部位,这就是我们如何计算一个更节省的解决方案。

这是一个另一个显示此功能对于非人类角色也适用的功能示例。当功能关闭时,不仅是乔尔和艾莉,马也看起来不接地。

打开功能后,一切正常。我们还将环境遮挡阴影应用于一些其他的动态探测,但我们使用的是不同的方法,不过是一样的思路。

在整个效果中,我们渲染了四分之一的缓冲分辨率,因为自然的低分辨率自阴影效果很好。
余角参数

这同样来自迈克尔的分享,用于跟踪环境分量的余角参数,实际上是暴露给灯光师的。我们可以控制班阴影的大小,如果我想控制我的阴影更加柔和,我会把它改成更高的角度。对于像阴天这样的天气,这看起来很合适。如果有什么原因你想要你的光方向或者阴影更加显著,可以把角度调到更低。
手电筒光照反弹

第三个是手电筒的间接照明。
我们为什么需要这个功能?因为当玩家在非常黑暗的室内感到无聊的时候,我们游戏中有甚多这样的情况,所以我们想展示手电筒的间接照明。这无法通过静态光烘培实现,因为手电筒链接到玩家,因此手电筒的位置、强度和光亮都是每帧可以改变的。
实现原理

这个渲染技术是由我们的另一位图形开发工程师徐克(Ke Xu)开发的。我们使用了一种叫做“反射阴影贴图”的算法,它支持对完全动态的光源和场景多边形实现间照明效果。模拟间接照明的计算成本很高,因为每个游戏中的物体都会成为潜在的光源!
对照测试

很多的游戏关卡都有使用手电筒的玩法,通常我们只能负担得起渲染一个穿梭投射的聚光灯,并且是实际上是没有间接照明的实时计算。

但现在打开该功能后,你可以注意到当乔尔把它的手电筒指向橙色的墙壁的时候,它会将橙色反弹光反射到附近的模型上,并且在这个空间里看上去很合理。

同样当功能禁用时,我们有很多的植被和细节在过黑的地方,我们都想可以看到。即使我们试图创造一些令人毛骨悚然的感觉,我们仍然想展示微妙的细节,因为一个人的眼睛你有光源印象,任何的表面它都应该有简介照明。所以这很合适,我们也很喜欢。

打开后你可以看到所有的绿色光线从植被上被反射,如果我们想要为了性能目的,我们可以调整光线反弹的强度和半径,或者其他的参数。



这个功能同样也是渲染四分之一的缓冲区,因为这适用于全屏有时我们确实得到一些错误的效果,但大多是时候它都很好。有些区域我们都可以负担得起,有些区域我们负担不起,对于一些玩家来说我们不得不关闭这个功能。
手电筒的互动功能

对于手电筒,我们有一些互动功能。
首先手电筒上的遮光部分是全局的,它可以根据手电筒的实际指向对象的距离进行更改,就像一个真的手电筒。
第二是全局遮光纹理的模糊也可以根据距离而改变,离物体越近就越清晰,越远就越模糊。



第三是我们有一个手电筒耗尽的玩法。

手电筒耗尽的玩法是当游戏过去一段时间后,手电筒开始闪烁,表现低电量状态。如果玩家在屏幕上显示图标,他们需要按控制器把光修好。这实际上为游戏创造了一些不安全的和毛骨悚然的游戏体验,也表明在游戏中资源是有限制的。
美术与规范(灯光美术圣经)

游戏中有个概念是我们的资源是非常有限的,我先从关键要素快速了解一下我们的照明原则。我将在概念中展示关于创造艺术语言的指导方针。
色彩脚本

色彩脚本是一个用于讲述故事的画面插图集,我们在整个游戏中应用的颜色脚本阐述每个关卡的色调和氛围。我们在整个游戏中有完整的四季循环,我们从夏天开始,秋天到冬天,春天结束。

这是游戏中“大学”的概念之一。左手边第一列实际上是来自关卡设计师的白盒布局,你可以看到这很简单,我们只展示行政、价值和颜色。
这主要是为了试图弄清楚我们想让玩家在哪里和游戏应该去哪里而画的示意图。一旦我们弄清楚这点,我们就进入中间的一栏,概念艺术家开始构思一些细节,包括建模、着色和描述灯光。一旦看起来很合适,我们会继续开发天空。

天空被认为是应该在真正的早期阶段开发,他们真的很重要。因为天空决定了一天的变化(Time of Day),决定了天气状况。天空的研发对于我们的IBL照明管线来说也至关重要,打光师实际上可以知道他们可以尝试什么样的HDR图像,并于关卡天空进行匹配。它对于早期创建反射图(Reflection Cube Map)也是十分有用的。
三大元素

这是我们讨论形体、灰度以及颜色的的脚本,他们不仅对于环境和贴图质感来说很重要,对于照明来说也很重要,因为把这三个元素的灯光效果加在一起,我们可以把它做得更好也可以搞砸。
形状

首先形体与灰度,彼此的对比才能清晰地描述一个空间。你可以说一个氛围的节奏可以塑造一个环境并且把玩家引向我们想吸引他们的地方,我们想让他们注意看到地方。
灰度

一旦我们有了形状的概念,我们的重点就转向灰度。通过将两个灰度值差异放在一起,可以使你的物体从世界中划分;同样如果你相邻的灰度过于相似,则会失去形体。
颜色

再说到色相,如果使用和色值相似的颜色,又会很难再看清它们的形状。所以单独的色彩差异,实际上是有利于帮助形状阅读的,同时一些衔接的形体是适于帮助与旧元素进行融合的。

这是游戏的最后,因此请始终记住二维图形很容易应用美术原则,但当我们在游戏中有一个玩家时这将变成一个三维空间。我们鼓励开发者总是从玩家的角度来思考上文的三个元素。
游戏内灯光管线

通常,关键概念艺术是在关卡设计师的白盒之前进行的,但这也可以以另一种方式发生。关卡白盒一旦开始,我们就开始设计灯光以帮助关卡设计师在游戏布局中做出基于灯光的游戏体验决定。这个过程可以由灯光师来处理,也可以由关卡设计师自己处理,但最早的可能只是一些想法。
五大流程

一旦白盒关卡准备好交付给美术团队进行开发,我们就开始做五大流程。

我们得到的是酒店的概念设计图,你可以知道这个实际上是团队在顶部应用了一种蓝色然后去饱和。

但其实一开始的时候,我们只使用了50%灰值(五十度灰)的场景。这一个仅应用于整个场景的纹理着色器,用于我们第一个灯光测试,你可以看到形状开始被区分。

接下来在概念的基础上,我们开始区分灰度而不是颜色。我们将适当的灰度应用到大表面上,限制你可以看到的一切都是正确的方式和基础的表现,以及你眼睛应该区看到的地方。你不能得到一个游戏玩家的感知,我们想要引导一个玩家去哪里。你也可以注意到灯光略有不同,这将被修复,因为灯光烘培也会对灰度有影响。

同样的概念,现在我们可以从概念上简化平均颜色,所以我们做了一个色板。

我们将这些颜色应用于表面,但仍然保持灰度,这意味着我们仍然将灰度和颜色一起应用。在这之后我们再做一次灯光测试。现在你可以知道灯光烘培的颜色变化非常显著,但这是在我们调整之后。因为现在的颜色在烘培的计算上贡献很多,当烘培时光线在环境中不断反弹,而不是单单只有表面上的颜色。

现在,我们转到真正的着色器和贴图的灯光测试,你可以看到这一切都开始正常运转了。

最后我们通过很多的测试,我们应用了我们想要的后期调色,还有一些景深和背景的雾。这就是我们的流程。
我们之所以将这个流程尽可能的应用于区域构建,是因为我们不想让灯光太晚加入。因为一旦你从游戏中创造了空间和游戏流程,如果你想稍后对其进行模型的修改,然后纹理师就会又去审查,这很麻烦。灯光可以真的帮助他们从一开始就一起开发这整个环境。
老实说,如果我们在每个关卡都应用这种方法,那将会很完美。但由于生产时间的限制,我们将这个流程应用在关键区域。一旦我们建立了非常好的区域,这就会带动其余区域的质量。

这有一些其他的例子,比如这个称为“猎人城”的关卡。我们首先有个概念,然后我们可以看到形体,灰度以及颜色。
静态光照
灯光模板

此处关于灯光模板(Light Rig)的解释感谢 李玉良@彩虹糖 前辈解答:一般主灯光师打出 light rig,兼顾到大环境的气氛和色调, 下边的灯光师套用 light rig 的基础上 ,再根据每个镜头补光或者调整。light rig 能保证你这一整场(可能几十个镜头)的色调气氛统一性 。
我们实际上使用的是Maya的灯光编辑器,我们利用其放置灯光模板,但我们不在maya中烘培,我们有内部的灯光工具和管线来烘培。

这是我们在第一次烘培之后,我们有个内部工具叫做Nova Rainbow。这是一个类似于交互式烘培预览的工具。当灯光师有大量的数据并在这个工具打开时,我们实际上可以于几何体一起查看,也可以看到我们的光照探针。

如果你想要改变颜色、强度或者其他参数,比如说我们改变阳光的颜色,我们可以看到在真正烘培之前看到结果。


我们还可以为整个场景单独显示某种灯光,进行直接交互照明。或者我们可以有个特定的灯光或者灯光设置单独或者一起查看。

正常情况下直射的阳光会在游戏中被替换为实时的直射光阳光,他没有烘培到我们的静态光照贴图中,但我们将将阳光的阴影信息储存在我们的顶点滑块中,以便稍后用于混合实时级联阴影。在实时游戏中,级联范围外我们混合进了烘培阴影,烘培的光照结果。
光照探针

这是一个灯光测试,也是实时太阳光。

这是最终的结果,在把所有东西都放在一起之后。


这没什么特别的,很多人都知道我们使用了探针照明,这是一个为了角色和动态对象的技术。所以当我们烘培一个场景时,我们放入这个角色。因为他们不能预烘培,所以他们完全脱离了场景,当他们四处走动,他们看起来就像游离于场景之外。

我们使用了立方体贴图,立方体映射被附加到角色身上。我们之所以有这么多几何体叠到一起是因为每个角色都有不同的体积,比如我们交换头部,交换身体,或者你有个武器和背包,每个角色实际上都有一个立方体贴图。当你实际让你的角色移动,你可以简化为这样适当的数据。

现在我们放入光照探针,来自角色身上的立方体贴图采样了光照探针上的照明数据。我们可以设置与光照探针的混合距离。


现在你可以看到他们融合进入了场景,然后我们可以隐藏光照探针来调试。这就是你游戏中看到的样子。


光照探针有时也可以用于别的东西,比如粒子特效。当我们有一些粒子会有在场景中的灰度变化,以及一些有距离关系的粒子。光照探针实际上可以将适当的照明数据传输到粒子。
实时光照
渲染设置(后处理设置)


渲染设置是一个实时渲染过程,他们被一些保持的值控制。我们有一堆与照明有关的参数,比如说实时的阳光,我们可以调整动态的光线。我们也可以调整色调映射(Tomemapping)和后期处理,比如泛光(Bloom),色偏(Tint)等等。我们也可以控制环境规模,SSAO和DOF等。

这是我们如何应用渲染设置到特定的区域,比如我们这里有两个主要区域。我们使用一个内部工具来查看游戏布局,粉色的是走廊,我们选择一个渲染设置,然后我们内部作为另一个黄色部分,保存与之前不同的渲染设置应用于该区域。我们会把两个区域稍微重叠在一起,并设置混合时间。所以当玩家在这两个区域之间转换的时候,他们可以正确地使用渲染设置。





这是渲染设置的示例,色调映射是在我们应用之后;我们也可以应用雾,我们有天空雾和地面雾;然后再加入泛光和LUTs;加入一些胶片感,非常微妙也许再空中比较明显。




曝光

曝光和大多数游戏一样,我们有一个应用于场景的曝光,并尝试根据光线条件来管理屏幕像素。如果我们将曝光设置为0,在左侧外部空间看起来曝光很正常,但锁定为0的话在室内,很难看清楚并游玩。

我们提高曝光,现在室内正常了,但另一方面室外变得过曝了。

所以我们决定设置一个为大多数适用的曝光过渡,它更接近人眼感受。所以在这个关卡,我们必须停止自动调整,我们根据屏幕像素设置最小值和最大值。当玩家在场景中移动时,我们可以进行两次调整。
季节&天气&ToD
这里仅有图片欣赏,未讲解管线。





















电影灯光管线

两者最大的区别在于游戏中灯光是在PS3上实时运行的,所以帧率不得不以30fps计算,并且内存也需要考虑。但对于电影灯光来说,因为我们是捕捉镜头,因此内存是唯一需要关心的问题。所以允许我们有一个更高分辨率的实时阴影、几何体面数和着色渲染。

《最后的生还者》的电影基本信息总镜头是94分钟,几乎和一部电影一样长。我们总共有62个场景镜头,所有的电影灯光都是内部(引擎or项目组?)完成的,由我们的过场动画灯光(Cut-Scene Lights)方案指导。
过场动画灯光

- 对过场动画模式进行支持
- 具有可以调节参数的动画灯
- 只会影响人物
- 对环境没有影响
- 支持高分辨率阴影
- 每个镜头只有4个过场动画灯光


可以注意到这是我们的过场动画,我们实际上用了灯光模板,要么是保存的,要么是引用动画文件。因为他们可以让灯光师从相机画面上剪辑动画,所以他们可以保持四个灯。

他们可以从Maya直接操控引擎内的过场动画模式,这张图是在所有过场动画灯光放置之前。

我们先添加太阳光,在后面。

添加主光。

边缘光。

以及一些其他的特殊灯光。但这是一个容许无论是角色移动或者拍摄变化的灯光。

景深也是可以开启的,但是我们一般让动画师来控制,因为他们同时也需要控制镜头,他们更擅长这个。不过有时可能的话,灯光师也会覆盖设置。
电影管线

整个电影管线,我们从mocap开始,然后我们通过相机测试,之后将它交给动画团队,可能还有一些细节的角色造型。一旦动画团队准备好一个内容,我们就会发送给环境团队和灯光团队以及特效团队来完成我们各自的内容。之后进行动画捕捉以及后期合成。










我们再从Maya看看灯光模板,我们通常从阳光开始。

这是我们的过场动画灯光。我记得就是这三个光创造了这个过场动画。

我们把所有的灯光放在一起,这个灯光模板框架添加了适用于不同过场动画的滑块参数。

一旦上面的流程都完成,我们会发送到一个叫做Buildcraft的内部工具,这个工具可以让我们可以播放过场动画,也可以录制动画。
通常我们只录制漂亮的内容,好的内容是默认画面的然后全部捕获。如果一个灯光师想要做一个细节调整,他们可以录制他们关心的内容,比如捕获深度画面,高光或者单独的灯光。

当他们决定了要捕获什么,我们不会在这里进行什么大的调整,只会有比如一些颜色校正。

那么怎么提升动画品质呢?这是另一个过场动画用到的例子来解释我们捕获的多灯光通道。从这里可以看到,这里有三个灯光用于这个镜头,还有一个深度和角色遮罩内容。

所以再合成过程中我们可以把背景和角色分开来,这个在实时捕获的环节常常难以办到,所以我们可以在这里轻松地进行色彩校正等等。

这是我们捕获的第一个内容,单一的灯光pass。

这个是我们为整个镜头做的色彩校正。

这个利用角色遮罩给角色增亮的蓝光,景深光。

我们在过场动画灯光上添加另一个灯光来表示灯的光。实际上我们对其进行了调色,让它感到温暖。

我们加入一些辉光效果。

最后添加一些电影镜头的特性。电影镜头质量在合成中表现更好,所以我们过场动画在合成流程里添加,而游戏中在渲染设置里添加。

最后我们把最后的电影进行剪辑再放回游戏。
原视频
https://www.gdcvault.com/play/1020475/In-Game-and-Cinematic-Lighting
夹带一点私货:
自己最近试用了UE5最新的Lumen光照系统进行了一系列的灯光测试,基于原有环境对于氛围进行一些改变,有兴趣可以随便看看

https://www.artstation.com/artwork/yJ3GN9
来源:知乎 www.zhihu.com
作者:枕鹤
【知乎日报】千万用户的选择,做朋友圈里的新鲜事分享大牛。
点击下载