【学习笔记】3A游戏《战神:诸神黄昏》的UI开发-7.GAME
6681 1
实名

通过了实名认证的内容创造者

发布于 2024-6-22 21:29:39

您需要 登录 才可以下载或查看,没有账号?注册

x

289fbc25d086944f6518bef8271632a0.gif

2023年度GDC大会,圣莫尼卡工作室的高级技术设计师 Zach Bohn 分享了圣塔莫尼卡工作室的《战神:诸神黄昏》UI开发管线,到深度探讨自定义UI如何设计,以及UI迭代以提供更好的用户体验的过程。整体干货非常多,因为原分享是英文口语,有很多专业名词的机翻理解起来有些困难,我做了中文语境的翻译并记录了笔记。

2e91b9c7fadd5a88917d7784c56ecf1c.png


项目背景
项目名称:《战神:诸神黄昏》God of War Ragnarök开发团队:索尼互动娱乐圣塔莫尼卡工作室(SMS)分享人介绍:Zach Bone (Sr.Staff Technical Tesigner,UI/UX )
作者先后参与了不同类型游戏的UI开发,包括独立游戏,手游以及现在的3A大型游戏,包括蜘蛛侠、赛博朋克2077、以及现在的战神-诸神黄昏,在这些项目中担任高级TD设计师,负责构建和维护UI架构,以及实现游戏中看到UI效果和元素。



UI团队介绍
游戏开发团队:⼤约300⼈ UI团队规模:11⼈(不含1个程序)PD:1⼈ UI负责⼈:1⼈ TD:3⼈ UI:5⼈ UX:1⼈ 协作⽅式:简单来说TD负责技术和落地⽅案的制定,UX负责功能玩法的交互原型设计,UI根据原型负责视觉设计产出资源,TD在Maya中进⾏3D搭建,最后程序来实现功能逻辑开发。




开发管线与数据管理




关于技术/引擎的工作方式介绍:出于性能和稳定性的考量,我们游戏里的所有资源(内存)都是预分配的,并非动态加载。你可以把内存看做一个容器,容器切分为多个wad,游戏中的资源都通过waddef进行分配。
比如,我们游戏有大量关卡,每个关卡可以是一个wad,我们不会同时加载不同的关卡。我们也有多个wad用于一个关卡的加载。如果某个关卡太大,比如陨石坑这样的超大型XPL区域,它可以被分为两个或者更多的wad,以便正确加载。也有部分wad是需要一直开启的,我们把这些叫做永久性的wad,管理着游戏进度与核心系统,UI就是其中之一。
所有游戏资源(包括UI)都必须符合特定的内存预算,否则就会造成内存溢出导致游戏崩溃。



虽然我们的UI资产都是2D的,但我们通过Maya实现了3D的UI开发管线。当然相比2D的开发管线,用Maya的3D管线开发UI会更难,因为Maya这个软件就不是为UI打造的。但这也让我们用上了针对游戏优化做得更好的材质和特效系统,设计师也能得到更好的发挥,实现更好的视觉效果。而2D管线会有很多性能限制,比如不能加粒子效果和特定的混合模式。



虽然SMS有很多工作室已经在使用新的可视化脚本系统,但我们还是基于Lua脚本进行开发,这是一个SMS使用了很多年的typelist脚本系统。
关于3A游戏的数据管理:熟悉unity的朋友应该都知道,通常都是将数据存储在与特定脚本直接关联的检查器窗口(inspector window),直接与一个特定脚本连接,它们本质上是运行时关联脚本变量(runtime associated script variables)。



但在3A游戏领域,包括任务、装备、日志数据通常存储为静态数据,它们在整个游戏中永远不会改变,始终是静态的。对于设计者而言,它通常是用JSON、Excel或其他简单的标记语言编写文本文件。好处是可以多人编辑再进行合并检查差异。



静态数据的另外一个优势是可以在游戏运行时进行修改,让迭代更加敏捷。缺点是需要重新编译,特别是对UI来说需要较长的时间。但这能够敏捷更新UI,给开发提供更好的灵活性。



在《战神2018》的基础上,《诸神黄昏》新增了大量的内容和拓展,在UI方面主要体现在地图、技能、更全面的无障碍设置。TD团队只有我和另外一个同事,需要维护相比上一代游戏翻倍的代码量。而且我们需要在内存预算一样的情况下实现全部内容。这是非常大的挑战,但这也是巨大的成就,我们在过去4年里新增和重构了大量的系统和功能。

游戏设置



为了给玩家提供更好的快速启动设置,我们从顽皮狗的游戏中获得了很多灵感,并进行了一些创新。



常用设置就是一个很好的案例,我们希望玩家可以快速完成设置。所以我们把全部标准选项都放在同一个页面,因此语言、字体、文本大小的设计都非常重要。我们低估了无障碍选项的技术难度,为此我们的工作受到了很大影响。



右侧是全部UI的LUA文件可视化占比图,最大的就是我们都设置菜单。我们需要近8000行Lua代码来定义这些设置选项。通常情况下Lua并不是存储这些信息的理想格式,而是我之前提到的静态数据库。



最后介绍一下无障碍预设界面,我们注意到顽皮狗在做同类界面的时候选项太多了,很容易让玩家感到无所适从。为了改善用户体验,我们创建了可以一次性更改多种设置的预设,包括视觉、听觉、动作等。



和《战神2018》类似,我们的游戏前端画面设计非常规范,提供了所有的基础功能和开始新游戏的选项,和游戏引导过场动画放在一起。我个人很喜欢这样的设计,因为它可以给你一种无缝的游戏开始体验,而不是还要跳到另一个加载界面。对玩家来说,尤其是叙事性主导的游戏,可能会打断开始游戏时的兴奋感。由于这是一套完整的视觉表现,需要有额外的性能开销,所以需要创意团队在前期就加入进来。
但没想到的是,《战神2018》的剧情回顾视频给我们造成了很大的挑战。最终引擎如何处理流媒体视频成为我们很大的挑战。因为我们的引擎预分配包括视频在内的所有内容。而游戏整体需要播放的视频很少,因此我们支持的最大视频分辨率只有720P。虽然有可能需要在很大的屏幕上播放,我们也知道有一些玩家会用4K屏幕玩游戏。这需要做出取舍(平衡),否则会导致我们需要改变流媒体视频内存预算,进而导致整个游戏的内存预算增加。



我们的游戏支持大量的选项设置,大概有65-70个选项,很难对其进行合理的分配。最终,我们将游戏性等标准类别与文本、颜色、无障碍访问和音频提示等新的特定类别结合在一起。



但我们还是灵活地设计每个类别的具体内容。例如自动拾取既出现在Gameplay中,也出现在无障碍访问中。这是大量游戏测试的结果,也和我们的想法一致。如果我们发现玩家很难找到某个特定的设置,我们就会把它复制到其他类别中。因为这些类别中有很多不同的设置,其中有些是由玩家控制的,有些是通过预设控制的。我们需要一种方法来知道某个设置是否已从默认值更改,这就是蓝色文字的作用。鲜艳的颜色可以提示玩家哪些设置与预设不同。这种方法非常简单有效。





我们给《诸神黄昏》做了无障碍选项的控制器映射,这个工作非常复杂,因为需要重构游戏的底层逻辑。因为之前整个游戏中的每个操作按键都是写死的,这是牵一发而动全身的修改,为此我们花费了大量的时间。现在设置会变得更加灵活,指定按键可以设置成瞄准、躲避或者互动。更全面的控制器重映射是目前用户要求最多的功能。并不是所有游戏都支持数十种无障碍设置,但我们也看到一些非常棒的独立游戏在这块也做得很好,比如《蔚蓝Celeste》,虽然它只有一些基本的选项设置,但玩家根据情况进行更改。或者《Overland末日之旅》可以把通用字体换成更适合阅读障碍玩家的字体。




新手引导


在《诸神黄昏》中大约有70种不同的引导教程。其中大多数是简单的侧边栏提示信息,另外我们也有大约15个菜单引导教程,引导玩家了解装备、技能、转职等内容,让引导变得更有效。



一些关于新手引导教程的建议:1.前后一致:同样的情况下以一致的视觉效果展示教程,这样玩家就能知道当他们需要建议时该去哪里找。2.一次只教一件事:根据经验多个教程结合在一起效果不佳。3.稍微延迟教程的激活时间:如果玩家已经知道怎么做,就没必要再展示教程了,这样可以避免打断玩家的游戏沉浸感,和对教程的厌烦。4.使用直观醒目的设计:例如跳动的剪头,可以引导玩家视线该看哪里。5.限制玩家行为:需要设计新手教程的逻辑架构,能够合理限制玩家操作,确保只有特定操作被允许,以便让玩家进入流程的下一步。6.保持菜单教程的简短,不要超过7个步骤,让玩家可以快速回到游戏。

字体



我遵循的字体规则:只需要两种字体第一种是标头字体,是符合游戏艺术风格化的字体,需要谨慎使用。在《诸神黄昏》中,我们的标头字体是BERSERKER,这是我们自己设计的,捕捉了北欧神话符文的感觉,而且只在两个地方使用,分别是游戏的标题文本和区域公告消息,当你切换区域时可以带来史诗感。
第二种是正文字体。正文字体应该是可读性高的字体。我们的正文字体是Gill Sands,这款字体覆盖了大部分西文地区,不需要为不同地区单独选一个字体。然而,有一些地区通常需要专门的字体,因为 EFIX 字体不具备这些字形。泰文、阿拉伯文、日文、韩文和中文通常需要完全独立的字体。



我们在《诸神黄昏》节约内存开销最大的一个方法,就是利用定制图标字体,用Font Forge将黑白图标加载到一个字体表格,然后在游戏里通过统一字符编码(Unicode)调用。我们无需为200多个图标花费纹理成本,而只需将字符添加到 2048 x 2448 的贴图中,然后再进一步压缩即可。
利用这样的字体另一个优势在于,我们最后为作家制作了宏,以便他们能够将内联的特定图标嵌入到文本字段中,在新手教程里,他们用宏来替代,这样玩家就可以在游戏里所有地方认识这些符号,这个方法很好用。



圣莫妮卡工作室(SMS)未来将会如何处理字体:我们会扫描游戏里的所有文本,然后将每一个符号放入纹理表。《战神2018》图标字体以及之前展示过的标头和正文字体都是这么做的,《战神2018》大小是1024×1024,我们的图标字体更多,所以大小是两倍。



在我们的游戏里,每个语言都有各自的wad,每次切换语言,我们都会重新加载一个wad槽,每个大概有10MB大小。但即便是压缩之后,我们运行的时候仅支持三种字体都接近内存上限,这给我们带来了痛苦的局限。
因此,我们开始研究一些基于GPU的渲染,比如slug。我们根本不需要创建纹理表,只需插入 OTF 或 TTF 文件,就能直接渲染字形,这给我们带来了支持多种潜在字体样式的巨大优势。能够支持多字重的字体,这是视觉设计师一直想要的。而且还可以解锁表情符号,这意味着我们所有的黑白图标都可以添加颜色,这对视觉设计师来说是一个巨大的福音。

HUD



在游戏内我们希望UI的存在感降最低,强调剧情故事的电影沉浸感。但我们也需要为玩家提供大量必要信息。与上一代战神相比HUD在视觉上变化不大。最值得注意的是我们改变了通知系统。我们将所有内容都放入了一个全局队列,任何时候画面上都只能显示一种通知类型。不过我们得到反馈,玩家有时需要等待很长时间才能看到这些信息。大量的信息在排队。如果你去过Vanaheim,并且获得大量资源,相信你一定会遇到这种情况。因此,我们对这一系统进行了修改,使信息划分更明确。任务更新放在左上方,右上方显示队列。如果某一时刻的信息很重要,我们可以将它们绑定在一起,或者允许它们同时存在。



因此《诸神黄昏》的HUD设计主要是新的定制UI,这些设计都有具体的玩法用途。Muspelheim、The Raven Arena以及Mystic Gateway都是非常好的案例。



与前作不同《诸神黄昏》能够在九大区域之间自由探索。我们的目标是做到既直观又快捷。



为了便于理解,这是《战神2018》区域探索的功能展示,奎爷必须去到一个特定地点:提尔的神殿(Tyr’s Temple)通过物理互动来调整前往的区域,感觉很有史诗感。不过从UX角度来说就很有局限性,玩家们只能从一个点进入一个区域,这就使得玩家需要花费大量的时间来回溯和重访这些区域。



因此,在《诸神黄昏》所有的逻辑直接被移动到了大门上,这个UI是Lua逻辑与一些视觉脚本的结合,因为很多状态相关的动效展示。区域图标的锁定和解锁状态都直接在门上显示。
但是,在游戏研发过程中,很多玩家在达到大门之后失去了目标,这是很糟糕的。玩家为何在这里投入那么多时间?在游戏测试期间拍摄的视频中,我们发现玩家会暂停游戏,试图弄清楚他们应该去哪里。为了解决这个问题我们只添加两个元素,就能为玩家提供他们想要的信息。首先,如果特定区域内有任务,门上就会出现任务图标。其次,我们还在右侧保留了所有可做任务的信息,让他们更清楚地了解每个区域的任务。



关于定制UI的建议:1.用户需要帮助的时候可能不会告诉你2.找到让玩家沉浸在游戏中的方法,而不是只给菜单选项。游戏测试和录制一些玩家游戏视频是非常有价值的,因为他们可能不会告诉你他们需要帮助,而是默默忍受,我们也是观看了测试视频之后才发现这个问题。玩家们任何时候暂停游戏都会打断游戏沉浸感,这种情况下,我们给玩家提供正确的信息来确保他们的游戏体验,对于剧情向游戏来说这一点很重要。



另一个定制化UI案例,很多不同类型的游戏里也看到,主要是已有设计的变体,比如说boss血条。奎爷每次只打一个boss,因此只需要一个血条。



不过也有例外:他与两个女武神战斗,但那次战斗有点特殊,因为他们共享一个血条。所以我们设计了一个不一样的血条就好了。



几个月后战斗团队又找我们,说我们遇到了这样的情况:奎爷要和两条水龙战斗,你们能否支持?我们当然可以做,不过对于超过两个boss的战斗,我们并没有很好的解决方案,因为屏幕空间就那么多。



在游戏研发的最后五个月,战斗团队再次找到了我们,说遇到了与三个boss战斗的场景,问我们能否支持。我们当然可以支持,但却只有两个血条的空间,我们最后用了Valkyrie的血条,以实现这种极具挑战的boss战斗。



因此,在设计UI的时候,你需要考虑拓展性,你永远不知道何时需要在设计上进行预料不到的拓展,同时你也需要知道极限在哪里。

局外界面的设计心得
在说菜单设计之前,我们来看看2018年的《战神》团队情况。众所周知,当时的战神研发团队是遇到了困难的,如果想了解更多情况还有一个专门的纪录片。



UI方面主要有两个核心问题,《战神 2018》是一款有深度的 RPG 游戏,拥有丰富的UI界面和菜单结构,但UI小组当时的资源非常有限。但整个游戏的UI其实是在六个月内完成的,这是不错的成就,但实际上是有代价的。因为当你的速度太快了之后,就会错过一些东西。
2018年的《战神》在全球范围内受到好评,但UI方面却拖了后腿。所以,我们并不害怕坐下来探讨哪些做得对,哪些是行不通的。



《诸神黄昏》开始研发的时候,UI方面我们有四个具体的目标:1.角色界面更有视觉冲击力;2.确保字体始终是可读的;3.优化布局,让UI更容易区分和识别;4.UI很容易操作。



回顾《战神2018》的角色界面:奎爷在和UI争抢空间,而不是两者和谐共存。从顶部的菜单到左右侧的信息卡,他只有很窄的展示空间,而且经常被UI元素遮挡。



为了让奎爷有更多空间《诸神黄昏》中我们把角色移到了右边,这可以更好的分离UI与角色模型。同时菜单被移到了底部,属性面板被折叠并放到了另一侧。



底部的菜单根据界面层级深度做相应的隐藏,这可以让我们对角色进行缩放,看角色的近远景视角,并确保奎爷永远不会被UI遮挡。



《战神2018》UI的最大问题就是文字从远距离看是看不清的,虽然发布之后进行了优化,有了一定的改善,但作用只能说是聊胜于无,这种UI布局根本不支持放这么多的信息。因此,在新项目的时候我们决定不再让这种事情发生,特别是小字号的文本最让玩家崩溃。



最开始我们决定正文字体不小于24点。同时支持文本缩放。无论玩家坐多远,或者有视力障碍,我们都希望每玩家都能阅读界面上的内容。顺便说一句,文本缩放的功能非常成功。



截至今天,我们看到近60%的玩家启用了这个功能,远远超出了我们的预期。
一旦决定加入字体缩放功能,那就意味着需要打造与之一起缩放的技术,这通常被称之为动态布局,内容的位置会变化以适应其他内容。



例如,我们把一个文本字段的y轴位置基于上方文本字段的高度来显示,大多数UI系统都不支持这个看似简单的概念,但我们做到了。
屏幕中间的卡片就是很好的案例,它能够响应很多种情况,从属性、描述,到bink video以及lore entries。不管我们在这个卡片增加什么内容都可以处理,这对本地化也很友好,某些语言一个简单的描述都有可能成为一大段文字。



作为对比,在2018年的《战神》中,所有的布局都是静态的,我们无法改变信息的布局。中间的属性卡设计的时候是考虑最满的布局,这在游戏后期看起来很好,但在游戏刚开始的时候,装备还没有成型时看起来有些尴尬。





最后,从平面设计角度来看,导航存在一些不一致的地方,操作起来有些不连贯。虽然需要根据不同的情况进行不同的位置布局设计,但同样一个意思的按钮在不同的地方长得都不一样。比如武器菜单的图标,装备界面又换成了完全不同的图标,在附魔界面又变成了一个列表。



在《诸神黄昏》上,我们有一个非常一致的侧边栏,出现的所有地方都是一致的,从武器和装备菜单到技能树一直到摊贩。我们还做了一致的动效过渡,主菜单上下滑动,而上一级菜单始终在左侧进行左右滑动。
装备附魔界面:装备附魔界面是我认为《诸神黄昏》最成功的界面设计。



装备附魔系统是《战神2018》核心长线的系统,类似腰带或手环装备带有一定数量的附魔槽,附魔之后可以带来各种加成,从基础的属性增益到一些决定性的属性加成,通过附魔槽与装备绑定,可以从根本上改变战斗。它可以让装备变得非常有价值,但同时也带来了奇怪的用户体验问题:你无法同时看到装备的所有附魔,需要对每一个装备逐个查看,玩家很难对装备有整体的了解。这种设计导致玩家在这个系统上的交互欲望低于预期。



战斗和UI团队想要在《诸神黄昏》解决这个问题,于是我们做了前后关联的的树状结构设计,可以同时看到9个附魔槽。
这种设计也遇到了一些挑战,我们第一版做的设计和其他游戏的装备界面差不多,我们的目标是不论你在界面的哪个位置都可以有连贯性的操作。因为每个附魔槽都是不同的,需要展示每一个可能装备的道具,但这行不通,玩家和开发者都不喜欢这样的设计,就像2018年的《战神》那样,无法掌握附魔的所有情况。



因此,我们需要打破一些传统。我们认为,用户体验比好看更重要,所以我们直接将UI叠在奎爷身上,我们还开发了一种新的菜单结构,允许同时展示两个列表。左侧是物品列表,右侧是槽位列表。这样玩家们可以选择一个物品,然后选择一个镶嵌的槽位,这个设计受到玩家的认可,大家也开始使用这个系统了。
但这依然存在一些问题。因此,下一次迭代采用了一种上下结构关联的方法,我们允许玩家直接浏览菜单列表,这就能让他们回到正常的流程里,玩家可以选择一个插槽,然后选择要放入的道具。如果你想修改,可以快速解锁你的所有的道具。这对资深玩家来说非常重要,尤其是在游戏接近尾声的时候,战斗变得相当困难,需要超级专业才能完成游戏。



我们的总监非常喜欢这个设计,希望我们的所有套装系统也能使用同样的框架。这是一个融合了系统功能和用户体验的设计。这是一个成功的设计,因为没有玩家讨论这个界面的设计,相反他们讨论的是附魔的搭配以及可能提升的空间,当没有人留意到界面的存在时候,可能就是成功的设计。



这里分享两个心得:1.如果这是一个玩家长期参与的核心系统,如果还不够好那就继续迭代。2.打破以往的规则,有时候用户体验比艺术效果更重要。

技能界面:这个案例是技能界面,以及《战神2018》玩家参与度较低的系统是如何重做的。



在之前游戏的技能界面右下角有一块奖励加成信息,可能很多人并不记得。从战斗的角度来说这个加成系统是非常有趣的,玩家拥有了更多可能性。该系统的初衷是在玩家已经解锁大部分技能后,在游戏的尾声持续保持战斗的新鲜感。但由于与玩家优先级不匹配,根本没有人参与该系统。在这个界面上,我们已经对玩家进行了数小时的培训,只需要关注技能的情况。但问题是这些奖励都是由属性决定的,而属性是在完全独立的画面上显示的。因此,这种和玩家优先级不匹配的情况让我们的努力变得毫无用处。



《诸神黄昏》中我们想再试一次。原因和之前说的一样:我们希望在玩家已经解锁了大量技能之后,在游戏的后期保持战斗的新鲜感。为了提高玩家的参与度,我们做了一个不同寻常的设计。我们把这个系统完全隐藏了起来,玩家在完成一连串与特定技能相关的任务后才会解锁技能模块。一旦他们完成了任务,下一次打开技能菜单时,我们就会通过教程介绍该系统。该系统不再是简单激活的被动奖励,而是需要玩家主动参与。玩家必须从一个经过精心策划的列表中购买一个技能,这能让玩家进行大量的尝试,但也给我们造成一些限制,确保玩家不会因为加成系统变得过度强大。



技能界面的一些建议:
1.交互呈现很重要,尤其是需要主动参与的系统。2.隐藏设计给高端玩家或者后期游戏探索带来很大的帮助,因为这可以带来新鲜感。3.最后别忘记对玩家进行教学,因为你要让玩家知道这是新的,是他们之前没有见过的。

日志界面:最后一个案例,我认为是没有合理交付的一个功能,也就是日志。



这是《战神 2018》中的样子。因为页面是平的,你看不出我们是作假的,所有的内容都是“假图”。



这是《诸神黄昏》的日志,很多方面两者都是类似的,但这里的内容是实时渲染的。我们觉得这是3A游戏,我们希望做到极致,我们希望这些内容是立体呈现的,因此我们决定让这本书可以翻页,我们不知道迎接我们的将是个大坑。



一开始很简单的,你可以通过定制化渲染目标来实现翻页效果,酷毙了。



当书本翻页的时候,就会有左右页,但翻页需要处理前后两页的内容。



然后,由于每个类别的内容都有不同的标头,我们不得不对每个类别做单独的资源。



最后我们还允许不同标签之间翻页,让这个问题变得更加的复杂。虽然玩家看起来效果类似,但它们背后使用了完全不同的脚本类别(scripting class),这导致游戏研发最后阶段出现了一些问题,直到现在你还可以通过某种方式,让UI完全没有渲染。不过大部分时候这个问题都是不会出现的,只要不要操作太频繁。
实际上大部分玩家根本不会注意到这个效果,所以这里的教训是:1.不要只是因为你能做就去做,不要为了改变而改变!2.请一定要评估这个改变对于游戏体验的影响!



我们今天谈了很多,从圣莫妮卡工作室的UI开发方式,到深度探讨自定义UI的设计,以及UI的迭代以提供更好的用户体验的过程,以上就是今天的分享。
分享来源:2023/GDC/Zach Bone译:心添

- END -

声明  文中所有图片版权归原作者所有,仅供分享交流不作商业用途,侵删。商务合作微信:Seven-game






—— 点击下方公众号名片,即刻关注我们 ——
国内极具影响力的CG艺术家自媒体
使用道具 <
啱买完菜翻来  发表于 2024-6-26 14:35:42  
2#
回复 收起回复
使用道具
您需要登录后才可以回帖 登录 | 注册

本版积分规则

快速回复 返回顶部 返回列表