从《底特律：变人》看严肃科技风格的动效设计方法【半周谈】085

本文将继续按照演变规律这一线索，去看看科技风格到底有哪些具体的表现形式。

将以《底特律：变人》为例，分析未来科幻题材游戏中科技风格的主流表现手法。

《底特律》是一款讨论科技风格设计时，无论如何都无法绕开的游戏。与它有相似重要程度的游戏还有很多，各位有机会在本系列的后续文章中一一读到。

这款游戏的时代设定为不远的未来，偏硬科幻，其游戏过程中的各类表现看起来都是理论上可能会被实现的。所以一些极其夸张的，显然脱离未来科技可能性的东西，或者显然超脱了游戏设定的科技水平背景的东西，都不会被纳入这种风格调性设计考虑中去。

比如游戏中多处出现的“全息界面”，就是现实中无法实现，但在游戏设定中成立的视觉形式。或许也可以理解为仿生人视角的一种AR显示：

如下图所示，在卡拉剧情开头，以她的主观视角展示的画面，除了本身就是典型的科技感loading外，还能从侧面解释，在第三人称视角的设定中，我们所看到的“全息界面”，或许就是仿生人视角的AR界面：

因此，或许排除全息显示技术，游戏里展示的场景，真的有可能在不远的未来成为现实。正如游戏开头的仿生人所言："这不只是个虚构的故事，这是我们的未来"。这确实非常硬科幻。

我们看到的是一款收敛的，符合其时代特征的设计。它具备该拥有的技术手段所要表现出的特征，同时不会杂糅其他元素，诸如我们上篇所说的《精英危机》中糅合的“复古”元素一样，它只是单纯的“未来”、“高科技”。

非常明显的，这款游戏界面中使用大量三角形作为其风格支撑的基本元素。这一图形元素分布于界面、动效的各个角落中去。原因很容易理解，三角形是一种非常容易体现出科技类风格的图形元素。

游戏的入场界面里，尤其是按钮、衬底类动态入场，都利用了三角闪切的效果：

而且这种三角还有多种扩展，如变成平行四边形，作为各个控件的衬底或者整体造型图形：

进一步的，在一些有特殊含义的控件中，这一图形逐渐变得不规整，借由特别的造型来体现特别控件的情绪：

但是这些图形依然以直线造型为基底。从未出现弧线或曲线，这算是严肃的科技感中，图形造型的一大特点。

游戏中很大的一部分界面，借由下图所示的控件类型来承担：

这种图形与三角及三角的扩展图形不同，由平直的多个矩形构成。通常在主体矩形的周边会有略显零碎的小矩形补充，另外还辅以横平竖直的线条。这一造型也多见于科技类风格界面设计中，亦属于常见风格图形。

下图所示的类似进度条的控件，也是同一种构造思路。除了风格统一外，这种零碎但整齐细密的界面构型，也能体现出冷静、严肃的科技风格：

上一部分中，我们提到科技风格中对3D物件的利用。关于三维的利用其实不仅限于直接使用3D模型，还可以将界面本身设置为三维。本作中的做法就是如此，以上几个界面中就有较为明显的表现，这些界面的三维效果中，除了一些跟随人物移动、伴随摄像机摆动外，还有下图这样被直接设置在场景的某个坐标上，玩家视角发生变化时，其三维特点极为明显：

与我们通常索求三维界面的设计方案不同，这种做法有迹可循。如果不是刻意提起，你或许并不会注意到这些细节，这就是它的神奇之处。当然，这其实一点都不神奇，本作设计师只是做到了因地制宜的表达而已：形同我们刚才提到的仿生人AR的说法，全息影像的效果是本作中高频出现的表现形式，那也就意味着这个游戏所构建的虚拟世界中，所有跟界面、设备画面相关的图形表现，大概率都会是以全息的、三维的形式展现。当你作为玩家完全沉浸在这个世界里时，出现一些与这个世界的透视视角完全不同的界面才会是咄咄怪事。

除了基本图形设计，三维化界面外，本作还用到经典的闪切、生长动画，其动作很有自己的特点，如闪切和生长同时进行、多个色彩的辅助使用等，看图即懂，无需多言：