上海散爆网络科技有限公司开发的少女前线：云图计划Roguelike战略手游。全平台公测于2021年9月23日开始。这是一款非常典型的二维风格游戏。界面设计继承了《少女前线》中扁平化、科技化的设计风格，但细节发展了。
许多类似世界观的二次元游戏几乎标配了科技感的设计风格和精致的二次元美女绘画，这款游戏也不例外。根据游戏世界观的描述，我们在游戏中的角色无一例外都是人形女孩。它们有不同的外观、派系和技能特征。这种基调和世界观设置将不可避免地导致一种平坦的技术界面设计风格。我们在半周谈话系列文章中谈到了如何进行技术风格的动态设计（点击此处进行回顾）。今天，我们将讨论这个优秀的例子，看看这些设计技术是如何结合实际情况来具体反映的。
融合科技设计是许多二维游戏中流行的设计风格取向。原因本质上取决于他们的世界观。与经典概念中的科技风格相比，许多这类游戏的界面风格往往有更广泛的设计细节。这应该源于早期同类型日本二次元游戏中相关界面设置的影响。EVA”这类二次元风格牵引所带来的的影响。
因此，虽然这类游戏的界面设计可以归类为技术感，但它仍然不同于严肃或成熟的技术设计。最大的区别是琐碎细节的处理，以及文本和纹理的处理形式。如下图所示，杀出重围：人类分裂的界面风格在细节处理上更加细腻。
尽管如此，它们仍然使用技术感中常见的斜切硬角图形设计，以及许多动态技术感，如闪切割、故障风、图形生长等特点。从这个角度来看，这种游戏无疑是一种技术感和特定类型风格的交叉产品。在特定的背景下，简单地说，它们是技术感。云计划的设计风格自然是一样的。它与女孩的前线分享了同样的世界观（云的故事发生在2058年，少的故事发生在接下来的四年左右），云服务器世界的故事发生在未来的科幻小说背景下。所以自然会有很多元素的设计。从下图开头的几个片段中，我们可以一窥《云图》中强烈的科幻风格设计：
就界面设计的沿袭和发展而言，《云图》有着与前辈不同的细腻感。也取百家之长，交互体验也有了很大的提升。比如类似风格游戏《明日方舟》中的主菜单交互形式:
同样的形式也用于云图，但图形设计更加清晰细腻：
在科技风格的细节设计中，采用了常用的动态设计技术，却做出了自己的特点。例如常见的闪切、生长动作，在人形数据页入场动画中：
突破成功的提示：
以及成就经验条的成长动画:
还有一些结合了诸多科技感设计特点的，进行了更加细腻设计的。
以及扇区解锁时的过场动画中：
这些动画的细腻之处在于，卖二手手游账号平台对原有图形进行了非常细节的生成式演绎。并且结合了三维以及生长、闪切的制作手法，且节奏张弛有序。还有利用科技感动效的特点，对界面信息逻辑进行直接联系的设计。如关卡节点切换时的效果：
《云图》界面中最亮眼的设计，是更贴切的三维界面设计。类似设计特征可以从类似风格的二次元游戏，如《战双帕弥什》和《明日方舟》中看到。如下图的《战双帕弥什》主界面入场。可以看到主界面中控件的带纵深透视的设计样式：
以及下图《明日方舟》中主界面“真3D”跟随陀螺仪响应的效果：
但是《明日方舟》中的三维界面仅仅还停留在静态表现上，唯一有互动效果的就是如上图所示的，跟陀螺仪响应互动。即它会随着玩家持握手机时晃动而跟着摇摆。不过这也仅仅给玩家一些特殊感受，并没有太多实际效用。
“二次元”的核心应该是角色设计。在《原神》中，是性格迥异，画风“媚宅”的角色群，在《碧蓝航线》中则是画风精致的舰娘立绘，等等。在《云图》中自然也不能缺了二次元美少女们。《云图》中的二次元美少女拥有多种具体表现形式：战斗中的二头身三维角色、立绘以及大招时的赛璐璐风格动画等。她们以“人形”的概念存在于游戏世界中，也拥有多种演绎途径：战斗结束时的循环小动作：
精美的立绘，甚至2D动态立绘：
以及最精彩的，大招时的赛璐璐风格动画：
很大程度上，吸引玩家去玩这款游戏的主要因素，恐怕是这些内容。至少可以说，主要吸引玩家的是围绕着以这些内容为核心的一系列体验。不过若没有与这种品质的美术相匹配的界面体验，这些精美的纸片人所构建的品质，说不定会被拉下几个档次。
如上文所述，我们在《战双帕弥什》和《明日方舟》中就见到3DUI的应用。除了上文列举过的那些，还有如下图所示，《明日方舟》中利用错层动画，想要体现纵深感的动态设计：
当然，别的类型的游戏中这种形式也很多见。只是在手游上的实践还很少有堪称比较合理和圆润的设计。那种带有三维纵深的卡片式设计，当没有与之匹配的一整套体验设计时，总有一种画蛇添足之感。正如我一向坚持的那样：“没有必要的情况下，请不要在手游狭窄的画面内用带纵深的三维界面”，甚至我认为在任何平台上，无所顾忌的使用三维界面，是一种无视游戏体验的行为。当然，我反对的只是“因为想用而去用”的情况。也有必然需要这种形式去表达的情况。比如在《全境封锁》中那样，恰到好处的去融入一些带纵深效果的三维界面设计，体验自然是提升的，尤其它还是有效的。如果在有限的画面内，毫无理由的，仅仅因为“好看”而去设计三维界面，那是我所拒绝的。
不过在《云图》中，我们再一次看到三维界面的应用时。感受到它这次不再是静置的，或者仅仅只是带有一些纵深透视的片状物。而是充分利用了镜头穿梭的方式去结合实际功能，进行了细致设计的真三维界面。如在战斗内界面，开战前的一整个镜头穿梭效果：
这个“镜头”将整个场景和场景上方界面层进行了完整的演绎。玩家跟随镜头的动作，完整预览了场景的效果，可以更快辨明界面中关卡节点与场景之间的对应关系。而且这种演绎方式所造成的视觉冲击也非常强烈。当场景更加复杂与纵深时，这个穿梭的效果更有冲击力：
与之相配合的是真三维的关卡节点界面的交互形式：
也就是说，这是一个视觉效果和交互体验完整结合的设计。与这种设计形式相匹配的，是一整套的设计语言。最简单的理解就是，其他界面都处于这个空间内的同一视角。如函数卡界面：
结算时的一系列镜头动作和界面穿梭入场：
可以明显的观察到，这套界面在战斗内有统一的透视角。不仅如此，在外围系统中，这种三维透视关系也得到了很好的统一。它们未必在静置时有明显的纵深透视，或与战斗内保持统一视角，但其转场动画都保持着“镜头穿梭”的动态设计样式：最典型的莫过于几个大系统的出入场：
而在一些非场景化设计的系统中，也依然保持了这种纵深推进的动作趋势：
还有些界面内，则是省却了界面的纵深感，直接利用镜头动作来表现空间切换关系，如下图所示的队伍编辑界面的打开与关闭切换：
而在抽卡这类界面中，需要非常强情绪表现时，就将镜头动画与特效进行了非常充分的利用：
这种设计形式是一种很恰当的设计语言，很好的诠释了该游戏的“科幻”元素。可以说，这种应用手段是极其成功的。整个操作过程中并没有感受到这种设计手法的“炫技”或者感觉到“画蛇添足”。最核心的缘故在于，它们是基于操作体验所做的合理设计。针对体验的细微设计，除了上文提到的那些之外。还有一个老生常谈的问题。那就是完整的穿梭或者演绎，往往会使动效有较漫长的时长。在头几次播放时会引起玩家的兴趣，但频繁的重复之下，一定会引起审美疲劳。《云图》显然考虑到了这一点。虽然有时界面上没有明显的提示，但这些“漫长”的动效可以通过点击空白来跳过。连续点击，快速领取：
过场点击跳过：
总结来看，《云图计划》界面动效设计的主要特点和优势在于：1.继承了这类“二次元”游戏的“科技感”设计风格，但有明显的细腻改善，使整体气质上与同类产品在品质上拉开了差距。2.在三维界面的设计上有非常清晰的思路，有的放矢，与整体操作体验进行了深度结合，不再流于形式。3.与同类游戏相比，它的动效设计并没有非常明显的“风格化”设计。而是将特定“二次元”细分类别结合特定“科技感”风格进行了更细腻的、收敛的设计。以上。