从2D到3D 开发者讲述“街霸V”的美术秘笈

Gamelook报道/《街霸》系列自1987年推出首款作品至今已经诞生了5代，共计数十款的作品，系列全球累计销量超过3365万套。最新的作品《街霸5》也已经在今年的2月份发售，可以说已经成为了格斗游戏中的招牌。这款游戏从最早的2D像素画面一路进化到现在的3D水墨风格，期间也是经历过诸多变革，而在日前举办的CEDEC2016上卡普空第二开发部第一开发室的龟井敏征也向我们讲述了街霸系列在这些年在美术方面的秘籍。

capcom的龟井敏征

根据龟井先生的介绍街霸系列最早诞生在1987年，但是一直到1991年推出的《街霸2》才逐渐被人所熟知，成为一款现象级的格斗游戏，之后也是相继推出了「II」系列、「ZERO」系列、「III」系列、「IV」系列，一直到现在的SFV。不过，虽然游戏的画风发生了数度的变化，但是有两个特点却一直被延续了下来，那就是“发达的肌肉”以及“夸张的表现手法”。

SF系列作为一款格斗类的游戏，具有极强的即时性，所以要让玩家能更快的产生对于游戏的认知，而游戏角色就是最重要的一部分。在SF系列中登场的角色根据性格、性质、气质等元素，在设计的时候其实已经被记号或者说是符号化了。而SFV当然也不例外，所有的角色都是依照上述的关键词进行设计的。

首先的话就是角色动作的设计必须是通俗易懂的，换言之就是角色一个动作做出去了，要让玩家明白这个动作会产生什么样的效果。

具体来说，以“阴”的刺拳为例，手臂和前臂以及拳头的状态以及关系是怎样的，是否会感觉到别扭。这里龟井也用点阵时代的风格来进行解释，在那个时候，整个拳头的高度也仅仅只有10个像素点，为了更好的表现出前臂的旋转以及发力，特意在前臂处设计了2个像素的肌肉，来增加画面的张力。

当然了，和点阵时代的设计不同的是，到SFV中游戏整体的设计全部是由3D打造的，这里甚至有一本可以称之为内部教材的美术解剖图作为参考。

列如像下图中手臂的动作方向以及前臂的剪影都能在这份“教材”中找到参考。

这里也有几个需要注意的点，以“隆”的手臂为例，从上方往下看上臂比前臂要粗，而从侧面来看，前臂却要略粗于上臂。虽然在实际中这是不可能的，但是这样的表现手法更能够表现出手部在出拳时的旋转，呈现出更加强的力度。

按照龟井先生的说法，SFV其实是按照超现实主意视觉路线去设计的，但是在某些部分也并非那么的合理，比如说SFV中角色的身高就和官方设定中的数值有所偏差，比如说“隆”的身高是175cm，而“维嘉”的身高是182cm，但是在实际模型制作的过程中，两个角色的建模的高度却是一样的。

这其实是因为角色的姿势不同，带给玩家感官上的体验也完全不同。

而在动作设计这块，主要有三要素：性能、格斗技以及节奏重心。首先是性能，在SFV中所有与运动相关的行为，都必须满足力学的规定；而在格斗技方面也要满足武术风格简单易懂的设计；最后的节奏重心更多的是要考虑动作是否帅气。

以“桑吉尔夫”为例，由于其背景设定是俄罗斯人，所以在设计这个角色的时候，其行动很多时候都带着当地的习惯，比如说移动时的就有明显苏联人行进的样子，如果从正面来看的话，面部以及身体其实会在很大程度上朝向一边偏移。这样在普通的3D游戏中来看，会显得特别的扭曲，所以也对步伐进行了调整。

这里主要是将身体的晃动调正，来体现出角色厚重的身躯。所以对于SFV来说，最合理的角度是偏移5°。

之后是必杀技的设定，这里用一句话来形容就是：在贴合每个角色背景（成长出生地以及格斗风格等设定）的同时，做到通俗易懂，并且还要能带给玩家感动，最好是能用一句话形容出来的。比如说上图中“美嘉”所使用的超必杀，用一句话来形容就是“臀部三明治”。

除此之外，现在的SFV事实上还继承了系列作品的很多要素，其中之一就是背景图像，上图是SFZ中的战斗场景，仔细拆解能发现很多有意思的地方。角色以及背景的颜色按照RGB三原色0~255的亮度来看，背景的亮度明显低于角色自身，但即使是这样，在背景中也并没有采用黑色。这里其实也是通过明暗的对比，来突出角色本身。

登场人物和背景图像的柱状图 横轴为亮度纵轴为像素量

而在SFV中，虽然并不像SFZ中那样极端，但是也进行了数码调色的工作（COLOR GRADING）。下图就是一张SFV中的战斗场景。

如同我们所看到的，背景是以暗红色为基调，色温相对较低。对此，我们故意将角色图像的色温稍稍调高，以起到突出角色的立体感。

根据龟井的说法，在SFV中数码调色总共有4个部分，这里可以称之为“Multi Color Grading”，分别对应左右和远景。这里痛过GPU进行渲染，并根据演出的意图，展开不同的调色工作。

当然，有的时候由于舞台背景的不同，有时候可能只有2~3块调色的情况出现。而且更多的是近景远景呈现不同调色的情况。

在视角方面，由于游戏的背景和角色都是3D的，如果只是按照视角的金元来扩展视野，那么整个战斗场景就会感觉像是半球状的，而事实上，2D格斗的场景却应该像是在一个平面上的。所以在SFV中，根据角色所处于的位置（屏幕中间或者版边）的不同，角色的胖瘦也会有所不同，一般来说越是中央就越瘦，越是靠近版边反而越胖，甚至连摄影的角度都会有略微的不同。

在SFV中也是结合了透视投影法，简而言之就是越近的东西越大，而越远则越小，与平行透视法不管远近大小都一样两种技法像结合的描绘手法。而且双方的比重基本相同。

讲完了传承，下面是讲变革，相对来说SFV和SFIV在画面表现上还是比较相似的，但是也有着诸多的不同，上面也说了。SFV的角色造型是按照“通俗易懂”“符号性”的理念进行设计的，而在角色的绘制上则是采用NPR（Non-Photorealistic Rendering非真实感绘制技术）的手法。下面就是SF系列的概念美术：

SFV是采用UE引擎进行打造的，这里主要是采用Deferred Rendering，其特点之一就是内置光源镜头。实际操作中通过附属的光源设置。进行着色的话，就能呈现出很多的效果。

而在细节方面，其实还能看到笔刷的痕迹，在前作中，为了实现这样的笔刷痕迹，主要是通过细微的凹凸呈现地图纹理，在Photoshop中使用“细小的皱纹”的滤镜来实现，最终效果也是呈现出独特的阴影效果，而且这样的阴影看起来会更加有层次感。

而在SFV中一开始也尝试了这个手法，但是由于分辨率的提升，这样细小的笔触反而看不到了，所以也想了其他方法。这里开发团队选择的是面向Photoshop的插件“SnapArt”。其对油彩风格的渲染效果也较好，可以帮助开发团队对画面迅速的渲染。

它可以给任何一张图片渲染真实世界中包括优化、铅笔画、钢笔画、漫画等艺术效果，Snap Art是一个可以替代繁重的手绘工作并比动作和笔刷更有效的插件。可以替代繁重的手绘工作并比动作和笔刷更有效的插件。

更多的样式和简易的管理，通过样式预设艺术，您可以得到各种各样的物理介质，如油漆，水彩，铅笔，木炭。在这些，你可以选择厚涂颜料，或现代最先进的技术，如漫画和风格化的风格，蜡笔。以及其它改进的预设，同时我们增加了多个蜡笔预设的。

然后是边框线的描绘，轮廓线可以说是NPR中的经典要素，在《重力少女》系列中其实也有所应用，当然在SFV中也通过色彩来对其进行描绘。

这里龟井先生也以SFV中的图来进行图解，上面这张是最初的效果。

对此左右移动n个像素，这里具体以描线的粗细来决定n的大小。

通过对图像进行合并拆分，取得最基本的轮廓。然后由美术进行色彩制定。

将轮廓与原图进行合成，得到的效果，这里再测试的时候精良选择色差与原图较大的颜色，以方便观察和调整。

最后这就是完整版的线描。