分类
游戏设计

游戏UI体验的关键:快

这篇文章只是随笔记录一些AT君对游戏UI的个人理解。

“游戏UI”分两种:玩法的UI和外部的UI

“体验快”分两种:静态的快和动态的快

静态的快:玩家见到一个界面后,能够快速的明白这个界面的每个部分是干吗的,哪里是重点,比如一个穿装备的界面,我身上的装备在哪儿?包里的装备在哪儿?怎么才能穿上或脱掉?还有其他的交易界面、仓库界面等等都是类似的。关于这方面的设计资料很多,如《Don’t make me think》。

动态的快:我想要干的事情不在目前的界面中,那么我要去那个界面需要几步操作?AT君个人就对微信的一个体验非常不满:我正在看朋友圈中别人分享的一篇文章,然后去便利店买了个饮料需要微信支付,那么我就要从文章中退出到朋友圈,再点“我的”,再点“钱包”,再点“付款”,这一切完成之后还要原路返回才能接着去看我的文章。这是微信让我非常不爽的一点,就是因为我在“看文章 -> 去付款 -> 回来接着看”这个路径过长导致的。游戏中也是如此,比如《炉石传说》我在打BOSS,发现卡组不对要调整,要经过多少步操作?我在爬天梯的时候想要调整,又需要几步?大家可以试一下,《炉石传说》的体验也不是很好。

静态与动态的矛盾之处:假设游戏中一共有100个功能,每个界面上放5个功能,那么游戏就一共有20个界面。每个界面上的功能越少,“静态的快”越容易达到,每个界面上的功能越多,“动态的快”越容易达到。由于总功能个数是不变的,因此如何达到其中的平衡就是个很关键的问题。可以通过把相似功能聚集在一起、界面可以互相调出、一些功能不做成静态界面而是动态的对话框等方式来缓解这些问题。

教程的作用:教程的目的不是教会玩家用UI,UI应该是不需要教就能会用的。从用户体检的角度来说,教程是在帮玩家建立心智模型,举一反三。因此如果一些常用的功能需要经过好多步操作才能达到的时候,教程就会显得有一些尴尬。

游戏内外UI的不同:游戏外的UI更类似于APP,完成的都是辅助的功能,重点是帮用户解决问题,因此花费的时间越少越好,就像搜索引擎一样,尽快把用户送到该做的事情——玩游戏里面去,减少玩家在外部界面乱逛的时间。游戏内的UI是玩家要长时间使用的部分,最高境界是玩家在与游戏交互的时候根本想不起来自己是在通过UI来玩游戏,因此重点是用起来自然。所以“快”主要是针对外部UI来说的,游戏内UI最重要的是

重要功能放在核心循环中:如果有一些外部UI是在核心循环中,比如一个游戏要在游戏中打怪,游戏外升级买装备,那么升级加点和买装备就应该放在每一关的开始/结束这里,这样玩家不需要每一关通关后都要退到主菜单去升级花钱,然后再返回主菜单去游戏中继续赚钱。

分类
转载 UI 游戏设计

[转载]游戏UI探索:玩家想要啥

本文转载自游戏邦,我对其有一些注释和订正(红字部分)。原文地址在这里

作者:Marcus Andrews

原标题:Game UI Discoveries: What Players Want

游戏邦标题:保留功能性应是游戏UI设计首要考虑因素

传统的HUD设置是尽量保持UI透明度,让玩家可以充分地沉浸到游戏中。EA DICE已经在该领域勇敢地迈出自己的步伐,但是这是种充满风险和艰难的尝试,几乎无法获得100%的成功。可见UI这个领域仍然存在较大改进空间。

如果要向他人描述“将界面放入游戏世界”的真正含义,最简单的说法即“就像《孤岛惊魂2》的做法一样”,但究竟什么才是真正的设计方法?如何利用这些方法?在下文中,你可以看到许多游戏的UI设计分析,以及我最后的总结。

术语

要理解这篇文章的内容,你需要熟悉几个术语。

terminology(from gamasutra)

图片中上方的疑问是:UI的表现是否在3D游戏中有视觉呈现?左面的疑问是:UI的表现是否存在于虚拟的游戏世界中?

  • (左上)非3D呈现,且不存在于游戏世界中时,为非叙事表现(Non-Diegetic Representations)。游戏世界之外的界面,只能被现实世界的玩家看到和听到。示例:多数经典的仰视显示器(游戏邦注:下文简称“HUD”)元素。
  • (右上)非3D呈现,但存在于游戏世界中时,为立体空间表现(Spatial Representations)。呈现在游戏3D空间中的UI元素,包括叙事和非叙事两类。《求生之路》中的角色轮廓便是非叙事立体空间UI的实例。
  • (左下)是3D呈现,且不存在于游戏世界中时,为亚呈现表现(Meta Representations)。亚呈现指的是可以存在于游戏世界中,但不一定能引发玩家形象化空间感的呈现内容。最明显的例子是屏幕上的喷溅效果,比如用喷溅到镜头上的血液来呈现伤害。
  • (右下)是3D呈现,且存在于由世界中时,为叙事表现(Diegetic Representations)。包含在游戏世界中的界面,可以被游戏角色看到和听到。示例:《死亡空间》中的全息界面。

游戏分析

孤岛惊魂2

《孤岛惊魂2》(游戏邦注:2008年由Ubisoft发行)是在界面叙事化取得极大进展的游戏实例,而且还是款FPS游戏。《孤岛惊魂2》中使用的主要叙事化方法是让游戏内置小器具与HUD界面产生联系,包括地图功能、时间和武器状况。

孤岛惊魂2(from gamasutra)

以上是叙事化界面元素的范例。它通过手表来呈现时间,游戏中的导航通过GPS和实体地图来完成。需注意的是,即便地图在游戏世界中实物化呈现,上面的图标和指示器的移动和行为却是以游戏玩法为基础。

优点

新颖的元素

从视觉效果上来看,看到英雄从自己的手臂中挖出子弹头和查看手中的指南针确实很酷。Ubisoft在预发布营销中展示叙事化界面的方法也是个新颖的因素。这就是卖点,就是该游戏能够与其他FPS游戏竞争的实例。

与其他角色互动

不过,与其他角色互动比你自己同游戏角色互动的效果更好,因为这可以让你看到其他角色正在做的事情。当你受伤的时候有个友好的角色前来相救,感觉就更棒了,这便是沉浸效果的实例。

缺点

在界面的时候上,《孤岛惊魂2》中似乎存在冲突,因为游戏中也有个传统的非叙事HUD来展示弹药、互动机会和生命值等内容,与其叙事界面相结合。这个HUD显得非常传统和非叙事化。

不受玩家控制的非叙事元素淡入和淡出使其干扰性达到最小化,当然,这样做的结果是玩家完全无法对其进行控制。以下屏幕截取自该游戏,展示了游戏过程中非叙事HUD元素的展示方式。

非叙事HUD(from gamasutra)

《孤岛惊魂2》所呈现的问题是,FPS游戏中极为缺乏用来承载界面的屏幕实用面积。镜头无法支持以叙事化方式呈现某些东西,尤其是在现实主义科幻题材游戏中。

最终分析

从《孤岛惊魂2》这个例子上来看,制作100%叙事化界面的可玩游戏似乎是毫无希望的,尤其是在FPS领域。因而采用某些折中方法似乎是必要之举。如果叙事化界面设计是游戏开发初期的目标而不是硬性的成品需求,那么这种折中方案会取得显著成效。如果你正在增添非叙事化UI以支持叙事化解决方案,或许得重新下考虑整个解决方案。

死亡空间

《死亡空间》(游戏邦注:2008年由EA发行)是最新的全叙事化界面实例。与多数游戏相比,《死亡空间》有个明确的方向:所有的界面元素都应当“位于游戏世界中”。

游戏界面使用的是经过大量变动修改的传统HUD系统:它像全息图一样被嵌入到游戏中,在这种文本式的叙事化解决方案中,界面存在于游戏世界中,在理论上可以为游戏角色所见。这里的UI可以解释为由角色的太空服产生的全息图。这种方式可以运用到几乎所有界面上,只要它是全息的。

死亡空间(from gamasutra)

除了全息界面外,《死亡空间》还将界面绘制在玩家虚拟形象的实体上,这种解决方案很适合叙事化第三人称游戏。

健康值显示在角色身体上(from gamasutra)

定位器(from gamasutra)

上图中的定位器可指向玩家需前行的路径,据该游戏执行制作人Glen Schofield所称,它可以在全息3D地图失效时,为玩家提供导航功能。

优点

场景

《死亡空间》利用其科幻场景来让界面显得叙事化。从原则上来说,它可以被解释为“以非典型的方式呈现典型UI”。

视角

使用玩家化身作为画布,在其上绘制UI元素,比如生命值和静止状态,这是种改善沉浸性的绝妙方法,但似乎这种方法对场景和第三人称镜头有很大的依赖性。

保留功能性

《死亡空间》清晰地显示出某些叙事化界面的好处,而且这种界面依然有传统界面的功能性特点。

缺点

需提供额外方案解决功能性故障

全息化3D地图在帮助玩家导航方面失败了。这个服务玩家需求方面上的失败迫使开发团队执行补充功能,“定位器”使用的并非是与其他内容相同的叙事化方法(游戏邦注:即全息图),而是叙事化空间立体方法(这个定位器需投射于地面)。

好处

我们很难发现此类UI除了它所能提供的功能性之外,还有什么特别的好处。毫无疑问,制作全息化界面需要耗费大量的资金,因而需要谨慎考虑这个选择。

最终分析

《死亡空间》引发了以下问题:执行叙事化用户界面可获得多少好处?我们很容易想到,其实《死亡空间》中所有的界面元素都可以被视为传统HUD元素。《死亡空间》也可能因为只是将传统界面解决方案从非叙事化转变为叙事化的方法而受到批判,因为它并没有真正推动传统设计方式的发展。

我将《死亡空间》视为叙事化界面能够为游戏带来好处的价值标杆。或许叙事化界面可以产生的好处要比在《死亡空间》中展现出来的更多,但是每个开发团队都需要认真权衡这种方法是否值得一试。确切地说,《死亡空间》可以说是将相当传统的界面融入到游戏故事中,并采用了叙事化的表现方式,至于这种做法的价值和取舍,这要取决于各人的看法。

军团要塞2

《军团要塞2》(游戏邦注:2007年由Valve发行)这款游戏之所以值得分析,是因为我认为它在界面这方面采用了非常直接的方式。开发者的想法似乎是“使用各种有效的方法来告知玩家信息”,因为他们的界面解决方案中采用了各种界面设计方法。

弹药、生命值和关键的游戏模式信息永久性地显示在HUD的固定位置上(游戏邦注:这属于非叙事化界面)。游戏中还有个第二层次静态“弹窗”非叙事化HUD元素会根据玩家的动作出现,比如当玩家站在控制点上或装备建造元件时。

除此之外,《军团要塞2》还使用了叙事化界面,尤其是可以在游戏中建造物体的职业——工程师。在这种情况下会显示蓝图3D全息图,以便玩家清晰地了解物体建造完工之后的模样。值得注意的是,非叙事化HUD元素会同期显示在屏幕上。

《军团要塞2》还大量地使用了“空间立体非叙事化”元素,比如玩家头上的图标和其他的标志。值得注意的是,姓名标签并非空间立体化的,而是固定显示在玩家镜头的十字准星下。

medi-gun及其随后的“uber charge”的呈现方式要更为特殊些。medi-gun中发出的彩色光束明显是叙事化,但同时也是医疗者和被医疗者间联系的空间标志。同样,“uber charge”颜色也可以被视为medi-gun发射出的叙事化效果,但也是让所有玩家知道谁正受到影响的空间标志。

军团要塞2(from gamasutra)

优点

结合各个类型的UI元素(游戏邦注:包括叙事化、非叙事化和立体空间等)确实可以在不将所有内容放入HUD的情况下提供大量的信息。

缺点

正是出于上述原因,《军团要塞2》有时看起来显得“混乱”。

最终分析

就叙事化的质量来看,《军团要塞2》很难进入排行榜,但是可以算是个很成功的游戏。《军团要塞2》展示了混合界面的强大之处,其开发团队并没有把注意力全部放在叙事化的方向上。《军团要塞2》还表明玩家更能够忍受叙事化界面中的不当之处。

魔兽世界

《魔兽世界》(游戏邦注:2004年由暴雪发行)成为了发布UI代码供第三方使用的先驱者,该游戏不仅允许玩家可以在屏幕上移动各种UI实体,而且还允许创建新的UI元素,甚至是那些默认UI所无法获得的全新数据。这种大胆之举使得暴雪开创了庞大的“插件”系统,玩家可以根据具体的目标来创建独立的UI元素。

与《军团要塞2》相似的是,《魔兽世界》所采用的方法似乎是不顾美学或叙事化质量,向玩家提供所有其想要的信息。《魔兽世界》UI的所有层面似乎有个统一的做法,经典2D非叙事化HUD与空间立体非叙事化信息相配合,比如姓名标签和生命条等。

以下是《魔兽世界》的默认界面,相当传统的非叙事化2D解决方案,同时还有空间立体非叙事化和亚元素。

《魔兽世界》默认界面(from gamasutra)

下图是《魔兽世界》中的自定义界面,许多插件提供了传统界面所无法获得的信息。

自定义UI(from gamasutra)

优点

自定义

可以自定义的界面似乎能够显著地提高玩家对传统2D HUD元素的容忍度,尽管这样可能会让屏幕显得凌乱。

帮助执行操作

从表面上看,这种看似先进的干扰性非叙事化界面如果能够帮助玩家开展任务的话,似乎也能够被玩家所接受甚至欣赏。

视角

第三人称视角使玩家可以360度旋转自己的角色,对玩家的方向感和导航有极大的帮助。

缺点

给玩家造成游戏表现的压力

玩家的沉浸感似乎并非其界面设置的重要考虑因素,它的可编辑化界面也总是被人滥用。如果你希望在游戏中更有竞争力,那么选择以默认界面来玩游戏便很难实现目标,这会让玩家产生渴求合适界面插件的压力。

最终分析

《魔兽世界》的案例值得那些高估沉浸感重要性或者沉浸形式的开发者深思。《魔兽世界》是款很棒的角色扮演游戏,它其实并不适合采用复杂或者数据量过于庞大的非叙事化界面元素,但玩家似乎仍然更喜欢这种界面,而不是更为简洁的默认界面。

我们很难理清其中的因果关系,但在《魔兽世界》中,如果可以做出选择,玩家总是想要获得更多的信息和UI来帮助自己在游戏中获得优势。

《魔兽世界》的成功发出了一个强烈的信号,那就是沉浸感不总是用户的最主要兴趣。或许他们只是想要在游戏中表现出自己的实力。

结论

正如我在《孤岛惊魂2》的分析中提到的那样,在今天充满竞争的市场中,为让游戏具有可玩性,融入非叙事化界面元素似乎仍然是必要之举。但是从我对《军团要塞2》的分析中可以看出,如果不采用这种做法似乎也并无不妥。

我的结论是,无论界面的外观和功能如何,所有游戏都必须满足的基本规则是:保留功能性以及信息传输。

玩家以两种形态存在于你的游戏中:化身和有机体。当然,化身存在于屏幕上。那么,有机体就是玩家在通过平面进入游戏世界后剩下的东西,也就是对游戏功能的感知,并将其转化成游戏 的能力。

在自然中不存在“化身”这种东西,人体是有机体的呈现方式。但是在游戏中,这二者之间存在内在差异,因为开发者具体地刻画出有机体的游戏化身。游戏可能会指定英雄是星际战士。于是,设计用户界面就变成了挑战。我们可以将其称为“有机体界面”,这种界面的目标是让玩家完全地感受到自己就是星际战士。

想象下相反的情况:“化身”脱离了玩家的感知,而你作为开发者需要面临的挑战是让玩家仅仅基于他们在玩游戏时的感觉,就能够把自己描述成为“星际战士”。这里可能出现一种风险,那就是玩家会将自己描述成为一个拿着机关枪的移动盒子。

shooter organism(from gamaustra)

进入游戏世界

当玩家穿过现实和游戏之间的平面时,他就成为了有机体。UI就是这个平面。以肢体修复手术为例,有个人失去了自己的右臂,医生给他装上了假肢。在这里例子中,假肢就是界面,界面越好,能够保留的右手功能就越多。你可以说,这个人让自己的右臂通过了平面。

现在想象下,假如假肢设计师决定保留功能的重要性不如覆盖在机械上的橡胶皮肤的真实性。那么,这名患者可能会得到看起来更逼真的手臂,但是其所得的功能性较少。因为UI可以被视为虚拟的假肢,因而保留功能性才是你的主要目标!

无论你的整体UI方向如何,只有在有机体能够在游戏世界中有效运转的前提下才能够去追求沉浸感。目前还没有哪个可行的策略能够不顾及这个重要层面。

设计有机体界面

1、看看你的主要化身,也就是游戏中的“英雄”,描述成为英雄会产生的感觉

范例:自信、无畏、有很好的意识

2、列举出你认为必须呈现在UI中的功能(游戏邦注:先不用考虑最终的执行方式)

范例:准星、生命值、弹药、小地图、武器库、目标定位器

3、开始设计初始界面

通过不同的界面方法来呈现上述列举的东西,比如叙事化和HUD等

4、检查你的初始设计,然后提出问题:“这个UI是否能够让我了解到所需的信息,我是否能够产生英雄的感觉?”

5、重复进行UI设计,直到上述问题的回答是肯定的。

记住,UI有多种形式,包括音频、动画、HUD和效果等,混合使用这些内容。

在最后的步骤中,你可以在设计界面解决方案时同时考虑化身和有机体这两个因素,让玩家感觉自己就是游戏中的一部分。

游戏邦注:本文发稿于2010年2月23日,所涉时间、事件和数据均以此为准。(本文为游戏邦/gamerboom.com编译,拒绝任何不保留版权的转载,如需转载请联系:游戏邦)

分类
游戏设计

手游UI的进化:从辐射状结构到环形结构

辐射状结构的UI,指的是将所有功能的主要入口集成在一个主菜单上的做法,《我叫MT》或者是《刀塔传奇》的UI可以说是这种UI结构的代表作。然而很多休闲游戏现在都是在走环形结构的UI,如《糖果粉碎传奇》等大量三消、跑酷游戏多偏向于这种UI结构,玩家不断在几个界面间切换就构成了游戏的主要循环流程。

环形结构UI的好处是显而易见的,学习成本低,游戏体验流畅,界面布局清晰,适合袖珍的手机屏幕,能够将重要收费点植入循环中,同时鼓励玩家快速开始游戏从而提高留存率。然而这一定程度上也是符合休闲游戏的特性的——功能模块少,游戏循环短,关卡驱动的游戏多,所以比较适合。很多人在设计稍微大型一些的游戏都难免走上传统的辐射状UI的老路子。

那么今天我要在这篇文章中探讨的就是如何能够在中核乃至硬核手游中,尽量实现去中心化,把UI从辐射状结构变成环形结构,提供给玩家更好的体验。

多模式选择怎么办?

如果你的游戏支持多种游戏模式,不妨参考下《英雄联盟》的设计思路。一开始我并不是很适应,但现在觉得这种设计对新手更友好。《英雄联盟》首先会有一个大大的PLAY按钮吸引玩家去点击,然后还会有详尽的向导指引玩家最终选择到自己想要玩的模式——不管你是想自己打电脑,直接进行对战,还是邀请好友。

这种设计的思路就是不要让玩家一次面对全部的信息,将信息分层(但不宜过深),逐步引导玩家最终到达他想要去的模式,实际上习惯之后操作起来也并不复杂,在小屏幕的手机上这种界面甚至可以做成全屏的,比如《愤怒的小鸟:星球大战II》的选关卡界面。

商店/升级怎么办?

大部分游戏能够在主要玩法中获得资源,然后再去消耗这种资源提升自己的实力,比如加天赋、学技能、买装备等等。这是一个很重要的模式,因为实际上这种资源的获得和消耗就是驱动游戏的核心机制,同时还很有可能是重大收费点。如果游戏并没有把这些东西直接加入循环中,而是脱离于循环之外(比如每次玩完游戏后玩家都能直接开始再玩一局,但必须要退出这个界面才能去商店中花钱),很多粗心大意的玩家就会忘记有这么个东西,同时如果在这里有付费点的话,由于付费界面曝光度不足付费率也多少会受影响。

解决方案有很多种,比如添加导向商店的接口,通过提示告诉玩家商店有新内容了等等。对于手机游戏来说,拆分商店是个很好的作法,《Clash of Clans》就是其中一个很好的例子——玩家即可以通过商店按钮查看完整的商城,也可以通过快速按钮只查看自己需要的商品列表,比如玩家如果点击了宝石旁边的加号,弹出的界面就是只卖宝石的。

贿赂你的程序员,让他/她多做几个商店界面分别用于不同的情况吧!

我的游戏有好多好多好多种活动,怎么办?

很多游戏对于活动公告的处理方法是登陆游戏的时候,啪一个大界面糊到玩家脸上,而刚刚打开游戏的玩家急于去玩游戏,根本就不想看这些废话——尤其是某些游戏的公告是纯文本的,连点图都没有,在没图没真相的今天这种做法的诚意实在是有够差。

活动也是可以进行拆分的,融入到每一步循环界面中,或者通过邮箱系统来提醒玩家查看,但并不强制。比如商店中有打折的,就引导玩家去商店(这对于环形结构的UI来说自然不是难事),玩家进去后只要UI设计得合理玩家自然一眼就能知道现在正在有什么促销活动。和其他模式或玩法挂钩的界面也是相同的处理方法。

然而,前提是这款游戏并不是一个活动驱动型游戏。对于某些活动多到了过分地步的亚洲游戏来说,由于整天都有活动,玩家一直追着活动跑,活动对玩家的行为产生了决定性的影响,这些已经变成了活动驱动型的游戏还是找一个最重要的版面啪一个大界面糊到玩家脸上吧。

而且不要忘记初衷

但很多国产的手机游戏如腾讯的一大堆天天这个天天那个,在这方面做得不够好,游戏在开始前和结束后都会有过多的全屏界面阻挠玩家继续进行游戏,因此犯了环形结构UI的大忌——步骤太多。尤其是循环短暂的休闲游戏,玩完一局游戏后如果玩家想再玩一局需要点击超过三次以上的话,我保准有人就开始骂娘了,比如我。

腾讯君,请去门口罚站,顺便再去把《糖果粉碎传奇》玩几遍!