【心得】因格玛的预言-用户体验与接口设计

因为我本身的专业是用户经验(User Experience)与人因工程(Human Factors Engineering)的关系,在游玩中注意到了目前游戏在交互设计上可以改善的地方,相较于前一篇文章主要专注在游戏好不好玩这种比较主观的游玩感想上,这一篇文章主要想透过启发式评估(Heuristic evalution)和设计准则的方式较客观来的评估一些我所遇到的用户接口和交互设计上的问题并提议可能的解决之道,所以如果你是想知道游戏好不好玩值不值得玩则完全可以忽略这一篇(不嫌弃的话也可以看我写的上一篇)。另外游戏中的Bug并不在此文的讨论范围内,那些属于功能性、应该会慢慢加入部分也不讨论(比方说魔石使排序选项之类的)。

要先说的一点是我毕竟不是设计此游戏的人,游戏在接口交互设计时可能遇到的困难与决策我也无从得知,所以这篇文章也是仅表示我个人的看法。因为本文比较具专业性质,所以署个名以示负责
Steven (Jen-Tse) Dong | LinkedIn

用户接口
我觉得这个游戏的用户接口设的非常漂亮,不仅仅是品质还包含整个UI的色系搭配和与使用了共通的设计语言(design language),所以整体有着很高的完成度。然而或许是因为在开发的时候主要是用仿真器在电脑上运行,所以有一些部分,包含按钮的位置、字体大小、交互模式等事实上并不适合在手机上以手指操作。

(附带一提,这边有个有趣的理论,1995年时在日立(Hitachi)的研究员Masaaki Kurosu和KaoriKashimura发现了Aesthetic–usability effect(美感-易用姓现象),如果一样事物有着很好的美感,那用户也会觉得用起来比较容易)

这边先说明一下一个App在实体手机上和在仿真器上运行的几个很大的不同。第一是输入方式不同,仿真器一般是用光标,手机则是手指,相对于光标,手指是很难精确的点击到很小的目标,这不只是手指是用面而非点来进行点击,也是因为手指本身会屏蔽部分屏幕,所以如果一个按钮比手指指尖来的小时,手指就会在点击时完全屏蔽住按钮,用户自然也就很难判断有没有正确的点击到。其次是姿势的不同,仿真器不存在姿势问题,但手机却会因为是单手还是双手使用,是用左手还是右手,手有多大等因素而影到点击的顺畅度,如果有个按钮被摆放在手机的最上缘或最下缘,在单手使用下就会变的很难点击,除此之外还有手机这个实体本身的因素,手机本身多长多宽多厚,手机本身的屏幕设计(曲面或平面,有没有浏海等),用户有没有装保护壳等等,这些都会让本来在仿真器里看来很好操作的设计变的不合理。

底部靠近画面边缘的按钮
这一点在Discord上已经有不少人反应了,官方也已经说会修正,不过还是说明一下为什么这会是一个问题。现在的手机多半都会在底部加入手势操作,比方说iPhone是回到桌面,三星是Android的三个按钮和Samsung Pay,所以如果不在底下留空间游戏中的按钮就会和手机系统的手势操作重叠,而一般来说系统的优先度要高过游戏,所以就会发生误触的状况,这不仅是点击还包含左右滑动,因此在商城页面尤其严重。除此之外,由于iPhone是圆角(我是用iPhone),而且很多人包含我都有给iPhone装保护壳,这使得手指在点击四个角落时会因为外壳而被往内推一些,导致点击点向内偏移,一些手指较租的人就会点不稳。

一般来说在手机接口设计上会尽可能避免把可交互项目贴在画面边缘而会加上一圈border,因为你很难知道每支手机的屏幕设计带来的影响,比方说iPhone的圆角和三星手机的曲面屏幕等等都可能影响体验。这里贴两张我分别从iPhone截屏因格玛的预言和GBF画面后塞进Figma iPhone 12 Pro里样子,可以看到因格玛的画面因为满版要漂亮很多,但也由于满版导致底部按钮和手势操作重叠,相较之下GBF就预留了上下的黑边做为缓冲。



按钮的大小
2012MIT Touch Lab(麻省理工学院触觉实验室)的研究指出一般人的食指宽度是1.6-2cm之间(45-57px,不过这必须要对现在流行的高分辨率屏幕进行换算),如果按钮的宽度大于这个宽度那用户就可以在触摸时看到按钮的边缘,也就可以大幅减少错误。不过这只是设计习惯,实际上有很多其他因素,不过按钮越小点击确实会越困难。Lee & Zhai (2009)在The performance of touch screen soft buttons一文中建议最小要10mm (1公分),而Jin, Plocher, & Kiff (2007)的Touch Screen User Interfaces for Older Adults: Button Size and Spacing文中建议对年长者的按钮最小是11.43mm,两个按钮间则建议间隔 3.17 – 12.7 mm。现在比较常看到的设计准则为高度最少11mm,间隔10mm,从这点来看西格玛的按钮都偏小,特别是共斗消息,不只是小而且还把前往和清除采用上下排列,非常容易点错,强烈建议如果空间不够至少排成左右。

字体的大小
目前iOS的设计规范是如果是作为主体的文本,必须要被阅读的字体建议在17pt以上,而如果是中文本由于笔画复杂最好再大一些,从下面这一张图可以看出来因格玛的预言的字体明显比iOS标准页面的字体要小了一些,和GBF比起也稍小一些,这一点会影响到阅读,建议适当的放大字体。另外主画面按钮的文本非常小,不过由于其是伴随着图标所以文本本身是作为辅助,小一点倒也无访,但由于画面的按钮实在太多,所以在玩家熟悉各种图标之前仍然会需要仰仗文本,这时在阅读上就会较为困难了,同样的也建议稍微把字体改大一些。

画面拖动
在电脑游戏中拖拉画面是很常见的模式,因为可以透过鼠标碰触窗口边框来进行自动卷动,而对于像是Google Maps 这种需要手动拖拉的接口则提供了很自由缩放的功能让人可以快速的在画面上的不同区域移动。但在手机上这一点就不太友善了,这一点体现在在浮空岛页面,为了在不同的功能中移动玩家必须要不断的拖拉屏幕(而且不知为何我觉得触摸反应没有很灵敏),这会浪费玩家的时间。而可移动式的冒险地图也容易出现对象放置太过边缘的问题,比方说6-50这个关卡浮空岛的图标都跑到其他按钮下面了。不过这边我就不给建议了,这跟游戏的所想带来的整体氛围营造有关,效率导向的设计不一样定是最好的。


信息架构(Information Architecture, 俗称IA)
在上面四个问题之上,另外还有信息架构(Information Architecture, 俗称IA)上的问题。
在游戏的”冒险”这个主画面上,我们就算不算左边储值活动的那一列和中间的主地图,整个画面也有26个按钮。当然,可以点击的地方很多并不一定是个问题,比方说魔晶总数的那个加号会导向到课金页面,而课金页面目前有其他办法可以前往,该额外的按钮仅是个额外的进入点。比较大的问题为了塞进这么多的按钮而使得每个按钮都变得很小,且这些按钮之间的层级性与关连性并不明确,导致玩家容易困惑而必须去阅读按钮上的文本来寻找特定的功能。IA中很重要的一个概念就是把同类型、同层级的信息放在一起以增加搜索效率(findability),我玩到现在有注意到一些我觉得在信息架构上可以改善的部分。

第一个是主选的按钮摆放逻辑,下面图中的左右排按钮,红色是常驻型,不会消失的按钮,红色则是会随着时间而消失更替的按钮,用户经验的其中一个法则就是如果能不改变一个按钮的位置就不要改变,因此可以考虑重新排列这些按钮,把会更动的放一边,不会变动的放另一边。除此之外部分重要的按钮,比方说背包目前是被隐藏起来的,这里也应该考虑到按钮使用频度与重要性来决定要缺省显是哪个按钮和显示几个按钮。另外,下方的星级冒险和世界地图本身与换面中央的游戏地图关联性较高,所以可以考虑向上移动,这样可以更清楚的展示这些按钮与其功能的关联性。

第二个部分则是有些部分看似没有好好的集成,比方说大师的馈赠商店的部分,目前只能由大师的馈赠前往,但页面设计却是一般商片页面,所以这里建议可以把该项加进去以方便往返。

第三个部分是升星与时空神庙,这个游戏鼓励玩家进行升降星所以我觉得没有必要刻意把两者分开,可以直接把升星的页面集成进时空神庙之中即可。不过这点可能开发商有所考量,未来可能会加入新功能所以就当我随便说说的。

第四是课金相关还动信息的部分,目前游戏中很多课金页面都是独立出来的,反而从课金页面是进不去那些活动页面。这里也建议可以在把与课金有关的活动页面链接加入到课金页面中,把所有相关连信息都集成在一起,这样也方便玩家查看。

第五个部分是关于魔石使页面,虽然目前有三个页面但技能页面实际上并没有任何的交互项目,毕竟这个游戏技能不用另外升纯粹跟等级,所以可以考虑把技能图标放到升级页面上,比方说名字下方或左右直排,这样也可以方便玩家在计算技能数值时可以同时看到角色数值,方便计算

最后的一个建议是关于内部帮助,也就是教学文档的问题,纯粹是个人感受。
这个游戏的教学方面目前是半隐藏状态,只有在看板娘浮空岛页面上出现,但该教学并不包含如何使用游戏中的其他功能与模式,这些内容都必须要到各自的页面中点击左上角的惊叹号观看。游戏教学这种东西很微妙,很多人看过一次就不会再看第二次,如果第一次看时内容太多很多人也会倾向跳过不看自己摸索,所以一般来说会建议准备两个版本,一种是简易版的,附上图片或是用overlay的方式来说明(目前已经有了),另一种则是更详细的说明,并将之集中在一起让玩家查阅,类似说明书,这样当玩家对某些功能有疑问时马上就知道要去哪里找答案(我就是在说你,大师的馈赠),之所以要集中也是因为如此可以提供更完整的内容,比方说附上图片甚至影片说明,也可以加入跨模式/系统的说明,用文内索引让玩家在不同页面中跳转以理解不同系统间如何互相影响。

总结
打完之后发现这篇超级长,我也不知道为啥打这么长,纯吋是一开始游戏中有玩家问券我觉得如果只是打个几行太过敷衍所以就打算花点时间分析一下。本文的目的不是要下指导棋,大概只是一种职业病吧,希望官方有机会看到,也欢迎大家提出自己的看法。
本文来自网络,不代表3楼猫立场,转载请注明出处:https://www.3loumao.org/15953.html?variant=zh-cn
返回顶部