网易游戏设计师:浅析游戏交互设计五维度

随着市场上游戏品类的不断丰富,卡牌、RPG、MOBA、大逃杀等游戏类型在游戏交互方面也有了更多的表现,随之而来是玩法与界面的同质化。套皮的游戏产品已经让玩家感受到审美疲劳,如何突破常规的界面设计是设计师需要面临的考验。

在现有市场的游戏产品中,由于手游的系统和玩法逐渐增多,因此延伸出许多子系统给游戏提供更多的玩法和乐趣,例如熔炼、技能、任务等功能,然而在满足了功能需求之后,市场环境也对游戏的品质提出更高的要求:赋予趣味性的交互形式、在玩家的角度提供沉浸感、符合游戏情境的交互体验等等。而游戏中的交互方式和视觉界面则成为传达体验与情感的载体,需要设计师通过品质打磨来传达给玩家新的体验。

接下来想尝试围绕现有的游戏界面来分享思考的设计方法,简单总结了5种设计维度,仅作为抛砖引玉。(以下案例仅针对手游分析)

深入世界观情境

总结:深入了解世界观情境去触动玩家的情感产生共鸣。

设备的升级能够让玩家体验到更精致的游戏品质,越来越多的玩家会去关注人物造型、皮肤和界面的表现效果,生动的界面和趣味性交互能够让玩家获得更好的游戏体验。

例如通用的领取任务界面,这类任务界面在视觉上能够展示玩家所需要的功能,也能够满足玩家使用体验。但缺乏与世界观相结合的设计融入和情感的传达,整体更倾向功能性的展示。那如何让界面也去营造情感传达?

网易游戏设计师:浅析游戏交互设计五维度

每个游戏都有基于自身的世界观和背景,而设计师更多是在既定的世界观去探索表达方法。同样是领取任务的功能界面,《楚留香》在这方面则是融入了与其世界观相结合的表现方式。在领取任务界面,设计师融入了与其世界观和情感相呼应的情景来表现。

网易游戏设计师:浅析游戏交互设计五维度

网易游戏设计师:浅析游戏交互设计五维度

试想一下,我们心中的武侠是一个怎样的场景?在武侠小说或者电视剧有过这样的情景描述:高手身轻如燕跃上高处,俯瞰世间繁华。而楚留香正是想把这种情境触达给玩家。正例如《楚留香》的slogan:「还每个月武侠梦一个真江湖」。以此可以看出游戏的核心就是想要给玩家传达快意江湖的武侠情境,而这种情境恰好与领取任务的功能两者在情感传达上能够达成一种共鸣:自豪感与成就感。基于这个情境下将「领取任务」的需求与「高处俯瞰」的情景相匹配,将情感落实到设计上,营造出睥睨江湖的情感触点。因此深入了解游戏的世界观能够站在玩家的角度,挖掘与需求匹配的情感触点,结合功能尝试突破新的界面形式。

要点:

  • 强化沉浸感和代入感
  • 寻找情境产生共鸣
  • 情境下的情感触点

空间推移

总结:可以通过空间转换的方法替代引导与强化流程体验。

空间的变换不仅能够给玩家带来视觉上冲击感,也能引导玩家进一步探索。简单理解就是将游戏里面的系统当做一个有前中后间隔的盒子,玩家在不同的界面中切换,就像是在近、中、远的空间中穿梭,这种表现方式能够遵循现实的进入/出去现实映射,并且也能起到引导玩家的作用,能够降低玩家对系统的认知成本。

《决战平安京》在界面的切换上使用了空间推移的设计方法,首先将整个界面场景营造出一种庭院的室内氛围,玩家进入系统则像是进入庭院的某个空间,进入的过程还会有进入/退出的动效配合,能够保持玩家在场景的沉浸感和降低玩家对界面系统的一个认知门槛。

要点:

  • 提供引导反馈
  • 空间关系的体验
  • 强化探索的游戏体验

网易游戏设计师:浅析游戏交互设计五维度

△ 平安京主界面

网易游戏设计师:浅析游戏交互设计五维度

△ 平安京次级界面

故事化视角

总结:抓住故事主流程设计,让玩家印象深刻。

故事化视角是使用故事镜头的插图绘制出完整的故事内容,这种方法最初的使用来自电影制作。在用户体验设计中,运用故事板的设计方法有几个优点:

  • 流程:故事化的流程让游戏更加合理化,容易产生情感触点。
  • 同理心:讲故事容易让人印象深刻,感同身受。
  • 参与感:故事容易吸引注意力,好奇心会让玩家代入角色从而更多的参与流程。

《非人学院》在游戏内很像在演绎一个故事事件。在游戏登录页是一辆开往学园的列车,当玩家进入游戏后会有一辆小巴士作为转场的载体衔接,意味玩家已经到达学园,接下来需要进行测验考核(选择战斗模式)紧接着是进入站台(与玩家匹配),列车启动(匹配到队友)然后到达场地选择上场表演的角色(选择战斗角色),最后开始表演(开始战斗),表演结束后还会有趣味性采访(战斗结算)。整个故事流程与玩法结合得十分密切,丰富了游戏趣味性的同时还强化了产品的调性(无厘头),给玩家带来多样的体验和不一样的惊喜。

要点:

  • 强化故事主流程
  • 从故事流程中延展设计点
  • 强化探索的游戏体验

网易游戏设计师:浅析游戏交互设计五维度

△ 非人学园主界面

网易游戏设计师:浅析游戏交互设计五维度

△ 非人学园转场界面

网易游戏设计师:浅析游戏交互设计五维度

△ 非人学园结算界面

场景化展示

总结:结合场景化的表现形式打破固有设计,带给玩家超出预期的惊喜。

当前大部分游戏的功能界面形式均为平面展示,而当玩家的视角出现反差时,能够给玩家带来不一样的记忆点和新奇感,并且视角上的切换能够给界面设计提供更多的可能性。在游戏中通常我们把系统界面分为两大类型:通用类界面和活动类界面,其中通用类界面需要和游戏背景、功能玩法强相关,例如《梦幻西游手游》的「风物志」系统则尝试了用场景化的方式去表现,将相关的系统功能都集合在一个场景化的界面内,让玩家的视觉产生与现实世界相呼应的感受,更有代入感。

网易游戏设计师:浅析游戏交互设计五维度

△ 梦幻西游手游风物志界面

活动类界面可以结合节日背景大开脑洞,例如《楚留香》的七夕节与立夏节等,场景化的表现方式将整个节日活动氛围渲染得十分出彩,整体的布局与颜色均可暂时脱离原有的界面风格系统,给玩家制造超出预期的惊喜。

要点:

  • 强化沉浸感
  • 跳出平面设计表现
  • 强形式感的陈列展示

网易游戏设计师:浅析游戏交互设计五维度

△ 楚留香七夕活动界面

网易游戏设计师:浅析游戏交互设计五维度

△ 楚留香立夏活动界面

细节与微交互

总结:可以在提醒/引导/反馈加上微交互,给玩家制造瞬间的愉悦感。

随着各类 APP 的成熟发展,微交互越来越多运用在各类产品上。微交互不仅能够在关键的操作起到提醒、反馈作用,还能给用户带来超出预期的惊喜感,由于 APP 的包体资源量和功能性所限,大部分 APP 的微交互侧重点以准确传达功能为主,而游戏所受限制较小(资源数量、引擎等),可以有更多趣味性的微交互与玩家互动。

例如在《楚留香》的福利界面中,设计师通过用花灯的组合来构建引导过程,在点开的瞬间以展开的微动效形式给玩家带来功能之外的愉悦感,高品质的微交互能够提高玩家对非游戏功能的心理感受,从而影响玩家的操作、情绪等。

网易游戏设计师:浅析游戏交互设计五维度

△ 楚留香福利活动界面

在《梦幻西游》嘉年华的活动中,设计师将「仙乐盛典」的玩法主题和小游戏需求结合,结合古代乐器的使用方式(擂鼓、敲钟、弹琴等操作)通过微动效的引导反馈给玩家,让玩家能够快速进入古代乐器的设定和体验中。

要点:

  • 提供引导反馈
  • 制造惊喜
  • 增强探索体验

网易游戏设计师:浅析游戏交互设计五维度

△ 梦幻西游嘉年华活动界面

结语

面对越来越多的游戏产品,界面不仅仅是简单的功能呈现,界面所展现的交互方式与视觉成为与玩家互动最直接的载体,就像任天堂的主UX设计师正木义文在新人培训中提到:任天堂传达的三个重点之一,将体验变得有趣,这也是每个游戏交互设计师的目标。

欢迎关注作者的微信公众号:「阿泽与设计」

网易游戏设计师:浅析游戏交互设计五维度

收藏 110
点赞 12

复制本文链接 文章为作者独立观点不代表优设网立场,未经允许不得转载。