生存类游戏如何做用户界面设计？从《漫漫长夜》说起

时间：2021-01-21 10:49:30 来源：作者：网络转载

守夜人：长夜 PC版

大小：更新：2020-10-09

分类：正版游戏

《漫漫长夜（The Long Dark）》是由Hinterland Studio制作的一款口碑、销量双丰收的生存类游戏，游戏在2014年的众筹阶段就以“生存”+“沙盒”的特性赢得了不少关注度，关于这款游戏有不少值得称道的地方，颇为硬核的慢节奏生存游戏，小团队的游戏开发之道，常年保持更新的销售模式……当然还有它专注于沉浸感的用户界面设计。

近日平面设计师Iuliana U在gamasutra发表了一篇关于《漫漫长夜》用户界面设计的文章，他指出了游戏UI、HUD界面设计上的卓越之处，但也指出了游戏动画效果方面的不足。GameRes对文章进行了编译。

如何在不破坏沉浸感的前提下，向玩家传递十几种不同的状态信息？如何把握玩家主动控制权与未知事件之间的平衡？如何让玩家在游戏过程中不至于感到自己像是戴着一顶平面显示仪？通过对《漫漫长夜（The Long Dark）》的研究，我们也许能够找到一些答案。

《漫漫长夜》是由Hinterland Studio制作的一款第一人称末日生存游戏，游戏旨在模拟真实的灾难后生存环境，营造探索、绝望与孤独的氛围。依靠独特的视觉风格、孤寂的冥思氛围和高水准的游戏打磨，《漫漫长夜》在生存游戏红海中脱颖而出。

游戏的UX和UI在正式发售前经历了数次迭代，目前仍在调整。早期的视觉风格走的是模拟物理对象的路线，四年后，游戏依旧维持极简主义风格。

《漫漫长夜》的基调

主题与游戏理念：生存，孤独。绝望，世界末日，寂静，寒冷，饥饿，自然VS 人类，挣扎，探索
交互方式：直接控制角色
游戏视角：第一人称3D
游戏时间：真实时间，昼夜循环，无暂停功能
主屏幕：HUD，库存
胜负状态：健康值降到0即失败
趣味要素：沉浸，探索，挑战，资源管理
挑战要素：资源稀缺，生存需求随着时间流逝增多，携带数量有限，天气、掠食者的潜在危险，地图庞大、地形多样，行进速度缓慢
视觉要素：3D
视觉呈现：黑、白、蓝的经典冬季配色，独特的字体，大写字母，极简主义，“黑板粉笔画”式的UI元素，突出显示数字与进度，水彩画视觉纹理，风格化的3D物体，棱角分明的物体占多数，在灯光、阴影、轮廓等方面均有体现
色调：冬季主题，黑白蓝相互搭配，较少使用红、黄、蓝、绿。
字体：专门设计的字体，多数文本使用大写，说明文字小写
相似游戏：孤岛惊魂3、森林

字体与色调

《漫漫长夜》主要以蓝色与白色为主，在亮度上互有差异。这为UI的制作带来了一个问题，它们在明亮及黑暗的极端场景中都能清晰显示。制作组用两种颜色来解决这一问题——几乎所用UI元素都用实心的白色显示，搭配高对比度的黑色背景。

表强调的颜色同样维持清冽、柔和的风格，且极少使用。当你留意到游戏中的彩色UI元素的时候你就能理解了，它们并未提供足够高的对比度，尺寸太小则很难被发觉，外加上游戏强调沉浸感的原因，使开发者摒弃了这些花里胡哨的、不必要的颜色、背景及装饰。

游戏的绝大部分信息都采用文本形式，开发者为此特地创建了一种字体，该字体拥有不同的字母高度与样式。多数情况下采用大写字母，搭配常规的说明内容与附加信息。颜色旨在传达文本信息的重要性，而字体样式则起到了辅助作用。

在以上设计中我们可以得出一些经验：

保证用户界面与游戏内视觉风格的一致性；
多尝试不同的方法来为游戏找到合适的搭配；
颜色如果不提供任何信息的话，它未必要纳入UI设计的考量中；
UI沉浸感的塑造未必要用现实物品来做参考系；
UI美学能提供更好的游戏体验及实用性

HUD界面

游戏内多数HUD的设计是围绕实际情况设计的，部分元素会随着时间消失。HUD界面主要分为7个区域：位置、风向、库存、患病情况、行进状态、一般信息以及健康状况。

「位置」简要显示玩家当前所在区域的名称，同时在玩家进入新地区的时候发出提示；「风向」标示风向变化，当玩家站在挡风区或试图勾引掠食者的时候，会弹出图标提示；「库存」显示库存变化，如新入手的材料或即将过期的材料；「患病」区显示玩家可能造成或治愈的伤残信息；「行进状态」有多个图标，用于标示跑步/耐力，蹲伏，斜坡站立，体重，武器状态等；「通用信息」则标示事件通知，如碎冰、徽章、奖励条件等。

「健康状态」则是主屏幕中固定的UI元素，其包含体温、疲劳值、口渴、饥饿以及与指标升降相关的状态5个要素。

游戏中极少使用红色，它们被专门用来指示危险、损坏、警告信息，它们附着在图标上，无需借用文字就能向玩家传达信息。

在此我们能学到的一项重要经验就是把指示器的利用率最大化，将数值条做成圆形裹在图标上以节省空间，大图标不仅具备视觉享受还易于理解。另外，条形UI通常缺少用于示意的数字，虽然玩家可以在菜单中找到相应信息，但在HUD界面不需要显示，有时候数字反而会让玩家更难以理解状态的上升or下降。

所有UI元素组都应有一套不同的样式来做区分：区域文字大于位置文字以便于标示区域的大小；掠食者比挡风的图标更大、更显眼，以便于突出重要性；「患病」用不同颜色表示重要程度，红为危险，黄为警告，白为次要；每个UI元素的颜色/透明度/纹理大小/形状都需要能与玩家有效沟通。

鉴于《漫漫长夜》这些年来一直在改进，它拥有一套令人印象深刻地界面，透过它你能看到一个有总体规划的UI样式、风格是如何帮助游戏保持吸引力的。无论系统增加了什么新功能或作出什么调整，先期的规划能让游戏界面保持一致，它避免各个模块的UI不统一或让HUD界面过于杂乱。

在这里，我们得到的设计经验是：

充分利用色彩心理学来表示游戏状态、情感、影响以及重要程度；
为数值条加入创意成分，用不同的样式获得更有趣的效果；
通过不同的视觉样式来表达不同的信息类型；
制定UI整体原则，在添加新功能或元素时遵循该原则；

此外，这一套HUD界面还有什么可以改进的吗？

首先从各UI元素的摆放位置说起，屏幕左上角的空间应该得到更多的关注，目前它只用于标明区域名称，这一信息对游戏而言并不重要且可在地图中获取，可以考虑把重要的UI元素放在此处。

风向指示图标可以考虑水平放置以减少空间，该组别的各个元素虽然都与空气流动状况有关，但看起来更像是彼此独立的事件，可以考虑用红、黄、白三种颜色来表示掠食者的吸引力程度。

扩大物品图像及数量能够让库存情况更加一目了然，甚至能将它们与左上角的区域名称共用以减少UI的空间。

「患病」可挪移至左侧，这对于玩家来说是至关重要的信息。目前游戏的处理方法是它们会随时间消失，只在「健康状态」栏上显示一个不起眼的标记，这导致玩家可能会忽略严重损害到健康的状况。

「行进状态」的摆放位置与其重要性相适配，但可以考虑重新排列图标来提高效用，比如跑步/蹲伏这对对比明显的图标可以占据同一位置。

「通用信息」中的部分信息可以并入到库存等模块中，确保最关键的信息才会显示于屏幕中央位置。

游戏对健康条的迭代次数最多，它的表现也令人满意。唯一的问题是健康条上缺少增加/减少的指示，提醒玩家健康状态的下滑有助于避免玩家因意外死亡而抱怨。

环形菜单

玩家按住鼠标时，屏幕上会出现一个包含完整HUD信息的环形菜单。与一般的环形菜单一样，该菜单包含了数个常用的功能，中间的按钮可回到上一级。

该类型菜单的优先级高于底部固定的弹出式菜单，设计一个快捷菜单能够屏蔽不必要的UI元素，还能容纳更多的功能选项。

《漫漫长夜》环形菜单的主要选项有光照、食物、武器、设置诱饵、导航、营地、医疗物品、水以及身体状况，二级选项会标示在同一环形切片中，灰色则代表不可使用。

该菜单没有用文字标示，而是采用图标围成一个圈，细致的物品设计以及特有的形状、颜色，即便尺寸不大也能一眼辩出。

玩家也能自行将底部菜单中的功能添加到环形菜单中，它们会自动填入相应的环形切片之下，开发者还为每个选项或物品上方添加了相应的工具提示。

在此处我们能获得的经验是：

确保环形菜单的图标易于识别；每种食物与医疗物品都有易于识别的形状与颜色；
通过环形菜单取代屏幕底部的菜单，减少HUD界面的UI元素；
通过图标而不是文字能够加快导航速度，如果不能完全取缔文字，可以在菜单外部增加提示；

此外，它还有什么可以改进的？

诸如休息、诱饵这一类表示动作的图标与某些物品图标过于相似；而且诱饵选项不易选取，作为一项重要的捕猎功能它应该被放置在能快速触发的位置。

部分物品在无法使用时会被设置为半透明状态，将其改为黑色轮廓更易于理解，且符合整体的UI 风格。

环形菜单还可以单独设置一个常用项目的环形切片，例如水、食物、木炭这些常用的项目，而无需每次都需要点击数次才能访问。

动画

在生存游戏中，沉浸感至关重要。游戏必须有一套相适应的UI、UX，你不能挪用其他的图标或UI元素来呈现游戏的样貌，你必须在与玩家的交流中发挥创意。

动画、声音以及临场的视觉效果在沉浸感的营造上占据重要地位。在《漫漫长夜》中，玩家的视觉会因为某些不利状况变得模糊，腿受伤后角色会跛着脚走路，遇到障碍行进速度会变缓。需要留意声效和语音设计之间的协调性，角色对饥饿、寒冷、疲倦等状态做出相应反应，能大幅度增加沉浸感。

《漫漫长夜》借鉴了不少《孤岛惊魂》系列的UI、交互、动画设计，游戏中有数种不同类型的动物，每种动物都规划了一套行为模式。

当玩家用石头捕获兔子的时候，你可以将其击晕，然后看它在角色手里颤抖不已的模样。尽管玩得多了玩家就会适应这一状况，但头几次依旧会感到惊喜，它们与生存游戏的基调不谋而合。

与野狼的对决旨在检验玩家的反应速度，玩家有数秒的慢速时间选择武器，反应速度越快，遭受的损伤越少。

熊的攻击无法被规避，游戏会进入预置的脚本动画，恢复知觉后玩家身体状态以及库存物品多数受损。

在这里我们获得的经验是：

UI/UX设计并不局限于图形，声音与交互也能传达相应的信息；
为不同的动物、资源设计单独的事件，可以增加游戏的玩法、丰富游戏的UX。

但《漫漫长夜》在这方面有相当大的提升空间。

很遗憾，上述图片是《漫漫长夜》仅有的几个沉浸式交互设计。其他内容均由一个图标或进度条表示，以至于不少负面评论都指出《漫漫长夜》是一个“进度条游戏”。

游戏显然需要更多的动画来增加沉浸感。哪怕是使用简单的视角动画来模拟入睡、苏醒的状态都比现在的黑幕淡入要好。像治疗、饮食这些每五分钟执行一次的动作也可以设计简单的动画，而是不用进度条表现。

《孤岛惊魂3》中有不少简短但有效的动画效果，比如收集、剖尸、治疗等动作，它们让玩家能更确切地感受到与游戏对象的交互，还能表现角色的情感，为伤口包扎绷带治疗动画传达疼痛感，迅捷的植物采集动画表现娴熟度，剖尸动画的血腥场面表现生存游戏的绝望。

《漫漫长夜》同样无法显示角色当前的装扮，无论玩家穿多少层衣服或手套，视觉上都是一双套着衬衫袖子的手，对这一情况加以改进能大幅提高游戏的沉浸感，而不是仅仅在屏幕上显示“+5温暖值”。

善于利用摄像机前的双手能为玩家创造更多沉浸感，但《漫漫长夜》的视角里很少出现玩家的身体。《镜之边缘》则是一个正面例子，这是一款专注于攀爬、跳跃的跑酷游戏，你可以从游戏中观察到开发者是如何利用双手与双脚塑造沉浸感的，《漫漫长夜》可以有所借鉴。

总体而言，《漫漫长夜》依旧是生存游戏设计的一个正面例子，它有不少出色的UI/UX设计。

原作者：Iuliana U
原文地址：
https://www.gamasutra.com/blogs/IulianaU/20210112/376097/Long_Dark_Survival_game_HUD_UI.php

资源转载网络，如有侵权联系删除。