【ashkeling专稿，未经授权不得转载！】

ashkeling报道/对于很多动漫风格的游戏而言，在硬件和技术快速进步的情况下，如何在使用照片级写实风格的同时保留动漫风格，是一个令人头疼的问题。动漫的身体配上写实风格的面部，会个人很不协调的感觉，但反过来，将写实风格的身体配上精致经典的动画面孔，就可以带来与众不同的感觉。

此前的GDC演讲中，网易天下事业部的Chen Zhou分享了如何在创作物理基础世界的同时保持游戏内动漫感觉的技巧，他认为，将先进的现代化渲染技巧运用到卡通渲染游戏里的概念，同样适用于其他美术风格。

以下是Gamelook听译的全部内容：

Chen Zhou：

我们今天的话题是找到动画风格与基于物理渲染之间的平衡，首先，简短介绍一下我和我的团队：我的名字叫Chen Zhou，2014年加入网易，在天下事业部就职，这是网易旗下的一个知名工作室，在杭州、广州和上海都有团队。

作为技术负责人，我的工作主要聚焦于游戏引擎和图形研发，与美术师和TA合作打造视觉良好且在性能预算范围内的游戏。

过去这些年，我从事并参与发布了多个在线手游，可以看到，其中大部分是漫画或动漫风格，目前我们在从事《ob电竞》项目，这是一款多角色RPG。

这个项目中，我们试图将我们的动漫风格与照片写实主义元素融合起来，用几乎100%可玩的角色和超过100个关卡，包括带有压缩光（compressed lighting）的室内设定、现代都市和昼夜条件下的室外环境。这就说到了我们今天的话题，游戏定位是所有移动设备平台和PC，用我们的内部引擎Messiah打造。我需要指出的是，由于游戏仍在研发之中，所以今天呈现的任何图片，都不代表最终品质。

今天的分享包含两个部分，第一部分是动漫艺术风格的一些基础知识介绍，包括它的典型特色、传统的Cel Shading技巧与局限，以及将Cel Shading与PBR融合可能的解决方案；第二部分，我会介绍我们的打造物理基础渲染游戏世界的目标和方法，同时用单通道延迟渲染管线为所有角色保留显著的动漫特征、定制着色模型的特殊光照和阴影技巧，还有游戏内视角看待我们为所有环境集成角色打造的管线，最后是一些总结。

动漫美术风格的特征

什么是动漫美术风格？换句话说，是什么让这些角色给人的感觉是他们来自动漫？

它来自一个传统2D动画的经典主题，我们可以从这个场景看到很多的特点。先看角色，这是一个具有明显线索的平面，用了最少化的颜色和阴影；另一个线索是轮廓线，这对于创造形式和结构感很重要。比如，一个曲线可以是角色的鼻子，如果进一步观察，会发现整张脸处于非预测投影状态，也就是说，嘴巴和鼻子的大小和位置都远离中心，嘴巴略微偏右。

再往上看头发，角色的头发有镜面反射，我们将其称之为闪亮的束发带（shiny headband）。然后是眼睛和眉毛，他们有一部分被头发挡住，但在此之上进行了重绘，因为头发可以看穿，而且是为了保持脸部动漫形象的整洁，大多数情况下，它们只使用一个主光源，阴影都有头发挡住光线形成的硬边缘。

这些特点是动漫过去几十年形成的典型传统，它们也就是用户期待的动漫美术风格。实时渲染这种艺术风格，已经有过很多的方案探索，主要是因为动漫游戏在市场上的兴起和流行。

我们从2014年开始做首个这类风格的游戏，为了上手，我们是从2D Sprites开始尝试的，因为它比较简单，而且可以让概念美术师有100%的掌控力，我们为每个Sprite使用了变体动画。着色很简单，只是纹理采样加上场景环境贴图的全局光，这种方式在当时对移动设备的性能带来了很大的帮助。

卡通渲染

近些年来，其他游戏开始使用其他技术做2D动漫，比如增加局部光照和套索，这给Sprite堆栈带来了更多的多样性。

到了2015年，在GDC演讲“Guilty Gear XR艺术风格”演讲的启发下，我们开始在我们的游戏里探索Cel Shading。Cel Shading又叫做卡通渲染，是一种非真实渲染技巧，旨在让计算机图形看起来像是手绘的，它的基础原色非常直观，将颜色渐变到基础色和阴影色，然后通过几何体光源方向的NDOT了使用阶跃函数。随后我们可以在后处理阶段为几何体增加轮廓线，使用边缘探测或或具有顶点偏置的自然背面任务。

我们在此前的游戏里实时卡通渲染方面探索了大量的技巧，如图所示，其中大部分聚焦于角色渲染，比如固定或单角色光照以得到每个角色的最佳外观，我们可以用smoothstep函数在皮肤的光暗之间创造细微梯度，以模拟表面散射效果；或者使用多通道包裹纹理让美术师更容易控制，或预集成面部阴影以密封最亮的光线方向，以及在HDR管线定制化色调映射来加强颜色准确性。

所有这些技巧的最终目的，就是为了保证最终着色效果与动漫风格的手绘概念艺术尽可能接近。

卡通渲染对于制作看起来向动漫的游戏来说是非常好用的，尤其是角色制作，因为大部分2D动画都聚焦于角色，而不那么重视环境，然而对于游戏而言，并不总是这样。在我们之前的一款游戏里，那是一款设定在现在都市的MMORPG游戏，卡通渲染就限制了我们的环境设计，因此降低了OB欧宝体育电竞官网探索体验，它很难创造带有大量细节的复杂场景，因为手绘基础色是卡通渲染很重要的一部分。这些步骤没有OB欧宝体育电竞官网标准，所以由于美术师的差别，结果也是不同的。

最终但同样重要的是，移动设备硬件性能提升，很多现代渲染技巧开始在所有平台可行，但我们发现在卡通渲染方面很难基于一款游戏而引入这些技巧。

基于物理的渲染（PBR）

与传统卡通渲染相比，基于物理的渲染带来了一些局限，它既描述了数学理论又包括实用部署。

PBR将素材与光照分开，因此为各种光线环境创作资源更容易，用可以用现实世界物理参数大量定义很多的材质，最重要的是，PBR的标准化制作流程已经被游戏行业广泛采用。这种普遍接受度意味着游戏资源创作可以外包给很多外部供应商，这对于创造一个大型游戏世界是很有帮助的。

所以我们开始探索创造一个物理基础的世界、同时保留动漫魅力的可能，这是我们《ob电竞》手游以及基于同IP新游戏的概念艺术对比，尤其是面部、眼睛和头发，是给我们一种动漫感觉的主要因素。试想，一个写实的面部放在卡通身体上让人会感觉很奇怪，但反过来给人的感觉却非常和谐。

网易的目标与方法

写实风格的材质和衣服，比如丝绒或有光泽的材质是可以接受的，只要为角色带来和谐的外观，复杂光照阴影是加分项。为证明这个观点，我们在一群核心《ob电竞》手游OB欧宝体育电竞官网当中针对两种概念艺术进行一项调研，所有受调查的人都同意这两个版本是同一个角色，70%的人更喜欢右侧的新版本，其中大部分都是动漫粉丝。

这就说到了我们游戏图形的目标，总和动漫与PBR的外观和感觉，打造大量的适合各种光照环境的材质，充分利用现代渲染技巧，然后保证图形质量灵活适应从低端移动设备到高端PC，并努力保持较低的开销、适配尽可能多的设备类型。

这就是我们在游戏里得到的画面，可以看到整个环境都是写实风格，然而上述提到的动漫艺术风格都可以在角色身上被找到。所以总体而言，我们的方法使用写实延迟渲染框架创造图形管线支持各种因素，比如阳光、局部光和全局照明、阴影和环境幻觉。

GBuffer布局

通过为角色部分增加特殊着色模型，比如渲染皮肤、发型和眼睛，我们部署了定制化渲染技巧来模仿动漫特点，可以带来非常相似的外观和感觉，而且我们为角色和环境美术师打造了游戏内管线检查70%的材质纹理，确保整体着色结果在游戏世界里从各个角度和位置看起来和谐。

这是我们的移动设备简化GBuffer分布，它是为了兼容尽可能多的设备而设计的，低端设备到最高端设备的附件大小差距相当于四倍。我们将颜色buffer保持在128节，以满足Mali GPU的性能指南。得益于现代移动GPU的TBD结构，分散的着色器可以从很小的内存读取渲染目标数据，进行计算并写回构成结果。

GBuffer生成延迟光照，构图是在单个渲染通道部署，这一点很重要，不仅是用有限的内存和带宽进行延迟渲染，还为了一些我们稍后即将介绍的动漫风格通道。

主光源

大多数情况下是室外的太阳和月亮，以及室内的一些局部光，以支持角色各种着色模型，比如皮肤、眼睛和头发。我们用混合前向渲染和延迟光照的方式处理前向渲染部分，当生成GBuffer的时候，我们用烘焙光贴图计算间接光线，让静态模型存储光线信息，让动态模型理解，材质散射也增加到了GBuffer。

对于动漫风格的着色模型，他们是在生产GBuffer的时候通过间接和直接主光源着色的，结果同样存储在GBuffer，就像我们在常规的前向渲染管线所做的那样。

预计算主光源的主要原因是，并非所有动漫风格着色模型的参数都能存在有限的GBuffer里，这一步还提升了光照通道速度，因为集成不同着色器需要的分支更少。

动态光源

延迟渲染的很大一个优势在于，我们渲染大量的动态光会比较轻松。这些局部光可以让角色和环境看起来更自然，我们将所有的点光源放在一个副通道。阴影产出的光线数量根据设备性能决定，为阴影光捕捉阴影贴图，在必要的时候更新，其他非阴影光通常被标记为遮蔽光，对于iPhone 11以后的设备，其余小组可以增加GPU片段着色器的并行，处理所有光线。

扁平面部

动漫角色最值得注意的特点就是平整的脸部，我们用了两三个技巧将普通转为面部矢量，曲线密度纹理由美术师控制， 这样他们就可以精准控制面部光线，顶点法线是不够的的，因为它们可能被骨骼动画修改，因此集成之后没那么精准。

扁平面部可以与多种局部光协调，呈现更为细节的角色动作，比如呼吸。

光泄露

扁平面部与物理继承的材质在前视图中的搭配非常好，但有时候从特定照明角度下观看就会得到过曝的颜色。带有特定法线矢量的前向光线从数学上来说是正确的，但当我们从右侧看的时候，结果图片就变了样。

重加权光照

这里是一些图表来展示这个问题，对于正常人的遍布，光反射是一系列的值，整个扁平面部作为一个平面。所以我们的解决方案是，对于局部阴影，我们使用了BxDF非阴影局部光，对于主光源，我们用阴影贴图预计算通道。通过这些，我们得到了看起来更自然的视觉效果。

控制皮肤颜色

对于脸部以外的皮肤渲染，我们采用了不同的着色模型，让身体的皮肤看起来就像是环境的一部分，我们使用与物理材质同样的光照方程式，但有意控制了颜色。我们没有像在传统卡通渲染中的那样让美术师给一个阴影颜色或渐变纹理，颜色操控是代码输入的，然后转变成一个像素着色器的公式。

这一点很重要，尤其是对于多角色游戏而言，因为每一个美术师的手绘颜色都不一样，就会导致在游戏中同一个点放多个角色的时候出现很多的颜色变体。对于这个着色模型，我们预留了动漫特色的从光到暗的硬过渡，然后我们根据直射光和间接光的饱和度，通过直射光亮度和逐渐增加的饱和度改变Hue，尤其是对于暗部区域和边缘。

通过操控颜色，我们得到了增强的结构细节和更好的对比度。

阴影渲染

接下来，我们谈谈阴影渲染，大部分的动画渲染游戏不会为他们的角色做递增阴影测试，因为他们通常使用设计良好的算法计算一个通用的阴影量。然而对于PBR细节阴影和环境遮挡是重要组件的时候，我们需要确保两者和谐共存，因为角色身体的很多部分使用写实风格的材质。

和很多的游戏一样，我们为主光源使用Cascadia Shadow Map。由于动漫风格的角色分配经常带有特别近的拍摄，角色脸部可能会占据整个屏幕，阴影也需要是高质量的，尤其是层次关系带来的自阴影，我们必须为动漫风格的面部创作硬轮廓阴影。

这展示了同样的角色，但灯箱有不同的扭曲，从0.2到0.8。如图所见，传统0.8的结果依然会在脸部周围形成软阴影，这是我们不希望出现在动漫风格当中的。

自适应阴影系统

为了实现更精准的特写阴影，我们为一些场景部署了视图自适应阴影系统（view adaptive shadow system），这是通过在屏幕空间计算一些Pivot Point capsule实现的，然后在生成阴影贴图的时候调整中央位置和截体大小。

自适应系统几乎可以胜任游戏里的所有拍摄，这就是我们实现上图0.2效果的方式。但仍然有需要手动调整的边缘案例，我们为美术师提供了一键方式调整阴影，他们可以在合适的地方配上时间框架。

头发阴影

光照和阴影可以在过场动画期间为单个照片定制化，然而由于白天系统的时间，它并不适合室外环境。我们增加了头发阴影替代通道，以便在面部创造一个好看的自阴影，并增加光照条件。

带有和头发相同批复数据的简化mesh被调用到GBuffer和光照之间，根据相位矢量和主光源方向，光照有些顶点位置偏移。我们从GBuffer取得基础数据，并且通过只重新计算来自光探头的间接光覆盖结果。我们弱化间接光结果，以便始终存在头发阴影，哪怕是从背光角度看，这只能用于面部，因我们可以通过着色模型ID来决定。

粒子阴影

除了自阴影，我们还希望在我们的游戏里出现环境阴影，这就要说到粒子阴影项目，这时候光线在脸部是不规则的。比如角色站在一棵树下，那么他的脸上就应该有阴影深度，这些阴影是完全不受控制的，让动漫角色脸部看起来一团乱。

我们的解决方案是，在一个渲染对象里为面部使用一个预计算的通道，我们在片段着色器里为每张脸打造一个多边形，从阴影贴图找到平均阴影值并将其存到一个像素中。当对比动态物体上的阴影贴图时，自阴影通过调整光域深度来筛选，当我们家在对应像素的时候，脸上就有一个扁平阴影，每个像素有8个浮点都完整预计算交给GPU。

值得注意的是，有一个是代表最后一帧是否是同一个角色，这可以让我们的引用切换更顺畅，这对于游戏内导航是很有帮助的。

Hair Anisotropic Specular

Anisotropic Specular头发光泽是典型的动漫特征，也被称之为闪亮束发带，我们用Kajiya-Kay模型分享头发，但并不为标准的镜面光泽采用传统的半角矢量，因为当附近有多个局部光的时候，光泽就会发散，头发挡在每个方向，虽然很写实，但确并不能传递动漫艺术风格。

相反，我们使用一个来自视图方向和主光源方向的固定矢量，将主光源光泽放入GBuffer然后重新使用，而不是为其他局部光使用ggx，通过这样，我们就可以得到图3的效果。

透视头发

透明头发是动漫风格另一个重要的特征，因为眼睛和眉毛对于传递角色个性是很重要的。一些漫画书作家选择在头发上画出来，实现半透明层次的一个标准方式是使用Alpha混合，但在这里并不好用，因为阴影和会被混合，让头发看起来脏乱。

我们是通过在GBuffer生成通道使用可编程混合实现的这个效果，头发的优先级最低，所以GPU可以选择继承的着色模型ID，然后辨别眼睛来执行不同的混合频率。

多层透明

由于我们使用的是递延渲染管线，传统半透明材质是在光照通道之后混合的，这就会导致不连贯的光照结果，因为只有限制光被计算在内。为了正确部署这些材质，我们将三角形面部数据存储在着色模型ID中，然后运行专门的模糊通道，以便在正确的多颜色混合中做模式识别。

最终，颜色通过stencil mask（镂空掩模）融合到了场景中。

轮廓线

整洁的轮廓线是动漫风格的另一个特点，而且在写实渲染中是不存在的。考虑到渲染目标大小，我们试图通过在裁剪空间加入法线将轮廓保持在一两个像素大小，顶点法线数据被轮廓顶点着色器存储在顶点颜色备用。

我们在GBuffer画线作为标准渲染元素，带有特别的着色模型ID。通过这样我们保留了根据不同环境随后渲染这些线能力，还保留了对的线性文本buffer以便在光照和后期处理使用，比如景深。

但是，由于这些线很细，他们可能会在抗锯齿处理之后消失。为了处理临时抗锯齿，我们在这些像素上做了一些特别处理。

自适应面部修改器

在着色技巧之外，面部动画也为动漫感觉带来了贡献。为鼻子、眼睛和嘴巴使用非透视立体投影，在2D当中是常见的功能。动漫角色通常有大大的眼睛，但鼻子和嘴巴较小，这让他们的3D模型从前面看很自然，但侧面就变形了。

为此，我们基于动画美术师从固定角度操作的四到六个姿势，打造了自适应面部修改器（adaptive facial modifier）系统，并且根据源动画数据在运行时（runtime）调整骨骼数据，我们运行时简化计算。

ob电竞APP下载内管线

由于我们在打造一个接近100个可玩角色的游戏还有超过100个关卡，我们需要检查这些角色是否能够和谐地集成到所有环境中。在我们角色标准的PBR之外，我们使用了大量的定制化着色模型，所以在我们需要检查的事情方面，我们打造了游戏内验证管线。

对于角色，我们为美术师提供了一个看起来像引擎的开发者工具，让他们在复杂的光照环境下快速校正问题。我们还有一个快速的Parade模式，检查特定环境中的动漫着色模型连贯性，因为这些非标准参数可能根据美术师有很多差异。

至于环境设计，工具有一个选择快速在一个关卡中按特定密度随机放置角色，我们可以将一堆角色放在navmesh之上并对其自动旋转，或者播放随机动画。在更大的关卡中，角色摆放在固定的兴趣区域，并且可以当游戏内摄像头飞过整个地图的时候更新。

这就是我们处理大量角色和环境结合深度的方法，用实时工具帮助角色和环境团队获得及时反馈，并迭代和打磨游戏。

总结

最后，我们来看总结。

在今天的分享中，我们谈到了动漫美术风格的一些典型传统，实现动漫风格特征的不同方法以及我们在《ob电竞》上的选择。我分享了我们重新创作3D动漫特征的一些关键技巧，以及如何与PBR渲染和谐共存。将现代图形技巧带到风格化渲染的思考过程，也可以运用到其他艺术风格当中，希望今天的分享能给同行们带来启发。