当前位置:主页 > 游戏 > 正文
热情之红,反抗之心!——《女神异闻录5》界面赏析-天天视讯
来源:哔哩哔哩作者:洞察网2022-12-22 17:40:39

《女神异闻录5》是一款具有独特风格的RPG游戏。其特色的界面和配乐几乎是所有玩家的第一印象。玩家几乎每一次操作,都有伴随而来的大量切换动画;几乎所有界面内包含的元素也都和游戏故事、主题等有关。

我想斗胆赏析一下这款游戏的界面,本人才疏学浅,必定会造成一些错误和遗漏,就请各位多指教了。

注意

1.      本文基于《女神异闻录5 皇家版》而制作,除标题界面外的主要界面部分和原版是相同的。


(资料图片)

2.      文中包含大量图片和GIF动图,请确保流量充足或连接WIFI观看。

3.      游戏内主角的名称由玩家自定,这里为了指代明确,一些场景中以“雨宫莲“称之。

4.      文章中会需要讲述一些游戏剧情相关内容,但不会影响实际的游戏体验。

5.      若您拥有《女神异闻录5》或《女神异闻录5 皇家版》,强烈推荐您一边阅读,一边在游戏内操作,可以获得更好的体验。

整体感受、字体

《女神异闻录5》的 UI 设计具有强烈的波普朋克风格。使用红黑主色调,一个深沉,一个抓眼,配之以尖锐的图形,给人印象可以说是相当深刻。

游戏内几乎所有标题栏的字,各个字的大小、粗细、字体、颜色、底色、倾斜程度等版式都不完全相同。尽管如此,但总体黑白的底色也不至于让玩家迷失其中而找不到所需的项目。如果说工整的文字让人感觉是和谐一致的,那么对应的,游戏内的字体展现了一种叛逆。跃动的字体展现了怪盗的花哨行径,带有一种华丽感。

如果找一个代表的话,我选择游戏中多次出现的“预告信”

上边的字看起来是从各个地方拼贴出来的,给人一种叛逆的感觉。

这种字体的来源之一是一些早期的犯罪片,罪犯需要发出赎金信,但又不希望自己的笔迹被人认出,于是就选择从书籍、报刊、杂志等上剪下单字拼贴而成整个信件。展示的效果就是不同版式的单字拼贴出一句话,这种字体被称为「Ransom Note Tex」,我们暂且先称其为“绑架字体”吧。

这个拼贴字体另一个参考应该是来源于上世纪六七十年代伴随朋克运动诞生的Zine文化。这是一种展示拼贴艺术、以胶水和打印机拼凑出来的书籍。

与普通的杂志相比,Zine更偏向小众的独立出版物,通过夸张对比色的图片更多地表达个性和看法。因此,这样的风格又带上了一种叛逆的色彩。

游戏里每个人物的故事都是以压迫——冲突——反抗的形式去完成的,贯彻游戏的理念像是一种反抗精神。界面内文字作为玩家获得信息的载体,也被用于了游戏主题的表达,而且最终的成效非常不错。

标题菜单

由于P5R已经登陆了PC,包括笔者在内有很多人是通过这种方式玩到的《女神异闻录5》,故这里也以皇家版为主。

雨宫莲先从林立的高楼中用飞索荡出,然后落到地面,显示游戏标志。

该场景在涩谷中央广场。

New Game 开始新游戏

切到New Game时,近景芳泽霞从屏幕右侧通过侧翻动作移动到屏幕左侧,奥村春在稍远一些的屏幕右侧,同时背后大楼的NEW GAME涂鸦风格文字被打上灯光。

确认New Game时,镜头转向画面中央的一块屏幕,屏幕显示当前摄像机的画面。

Load Game 继续游戏

切到Load Game时,镜头转向画面右侧大楼的雨棚上,高卷杏和喜多川祐介在上边。写有LOAD GAME的预告信名片从高卷杏手中转出。

确认Load Game时,选项卡从画面右侧移动到中央。

存档栏位的样式,类似线圈笔记本的纸张,我们看到的是每一页纸的左下角。

联系剧情,我们知道主角在被送到东京后,佐仓惣治郎要求他为每一天做记录,给了他一个笔记本,同时游戏内介绍了关于存档的教学内容。也就是说,笔记本就是存档,游戏的视觉元素和故事结合在了一起。

My Palace 我的宫殿

皇家版中,追加了我的宫殿,用于存放各种收集品和游戏内置成就的场所。

镜头转向自动售货机,同时雨宫莲从屏幕左侧走入屏幕内。

这个画面,从左到右,从近到远的人物是:雨宫莲、坂本龙司、明智吾郎、摩尔加纳、新岛真。

这里是主角的宫殿,所以一定需要有主角在场。而且在我的宫殿中,用来设置宫殿布景等的装置也是自动售货机。

Config 设置

切换到设置选项时,镜头转向佐仓双叶,她打了一个响指,随后左侧的大楼上各个房间的灯光组成“CONFIG“。

她是精通心理学,情报学,程序设计,尤其是黑客技术的天才少女,这个画面看起来就好像是她把整座大楼的电力系统劫持了一样。选项和展示的人物有很高的相性,角色设定也以这种方式得到丰富。

系统菜单

Command 指令界面

主角伸出手,拍向屏幕。

中央有一条白线,充当左右部分的分隔和对选项的视觉引导。所有选项都排布在白线左侧,当前选中的选项由变形的色块突出。

如果当前选项并非活动的,则色块会变为黑白同时停止变形运动。(如:装备——任意角色)

当前选中选项由变形色块突出,这用在游戏里非常多的地方。

返回到上一级时,用了类似刷子擦除画面的效果。

Skill 技能

主角抬脚踩到屏幕右下角的一条线上,眼睛向右下方看。跟着他的视线就能看到可使用技能列表。

选择使用哪一个技能时,脚踩得更深了一些。选中的人物头像会随时间跳动。

Item 物品

主角挥手,其右手托起所有人的HP、SP量表在屏幕左侧,头略向屏幕右侧看。

顺着他的眼神,就能看到所持有的物品列表。

可以使用的物品中,大多数是药品。主角的表情就像在说“要吃什么呢?”

Equip 装备

中间的白线旋转,主角同时持手枪指向屏幕右下方,那条白线依然起到了视觉引导。(所有角色名称都在中间的区域)

选择更换一名角色身上的哪一件装备时,主角的眼睛离手枪更近,相比上一级的画面,就像是仔细端详着武器一样。

再继续,主角原本手中的手枪变成子弹,被弹了出去。

另外,如果是P5原版,远程武器会在子弹上显示当前剩余弹量。

注:原版的子弹每次进入/退出异世界才会重置;但皇家版中,子弹每场战斗后都会重置,也就根本没必要显示当前弹量了(在这里就算能看到也肯定是满的,毫无意义)。

Persona 人格面具

主角挥手转身(像是摘掉面具的动作一样),离开屏幕,手的动作引出屏幕中的白色带。

查看人格面具状态时,白色带的变换引出该面具的抗性表,同时将面具模型包了起来。

Status 队伍

随着中间的白线旋转,主角把腿搭载了什么东西上,眼睛看着屏幕左边(也就是角色列表)。

切换到战术指示时,主角把手靠近脑袋,好像在想着什么。

查看每名角色的状态时,右侧角色的画像,是以“悬赏令”的形式设计的,人物画像下方数字则是该角色总共获得的经验值(对于悬赏令来说,通常这里是标明赏金的)。

悬赏令这种情节我们可以从很多西部片里看见,画像是通缉犯的头像,下边标明赏金。怪盗团的行径“改心”实际上是脱离法律之外的“私刑”,而且游戏故事到了中后段后,怪盗团也真的会被列为通缉对象。

这里使用悬赏令来展示人物的画像,暗示了游戏故事情节,并且强化了游戏中”反叛“的基调

Cooperation 协助人关系

浏览所有角色的协助人等级(简称coop)时,雨宫莲看向左下角,各个协助人的选项卡位于左侧。

主角的目光,在这里也算是视觉引导了。

选择某一个协助人后,雨宫莲转身,其背后便是对应角色的画像。主角和协助人背靠背,容易让人想到他们之间互相信赖的关系。

Request 查看请求

雨宫莲侧身到画面左侧,用手机浏览怪盗ch。

这是由三岛设立的网站,用于收集请求和委托。右侧就是委托列表,我们的主角看到的东西。

查看详情时,就好像是有一张纸从屏幕底部旋转到屏幕右侧,然后显示任务状态。

Calender 查看预定事项

位于中央的白线右移,以其为分割,左侧为黑色背景的日历,右侧为白色显示该日的详情。

可以通过这个系统查看之前每一天都做了什么。所做的事情显示在屏幕右下的笔记本上。还记得之前说佐仓惣治郎让雨宫莲每天记录的事情吗?这个系统也和故事结合起来了。

System 系统

选择后,雨宫莲会使用绳索从画面左侧荡到屏幕右侧,这个画面是他正在向右边荡的时候。

同时绳索起到引导线作用,帮助玩家确认有用的选项位置。

这个菜单内再继续选择,主角会荡出屏幕,然后从右侧转身向左侧跳出,随后玻璃破碎,显示具体内容。

有概率出现飞索失败,撞到屏幕上导致玻璃破碎的动画,这个还挺好笑的。

探索

在现实世界探索时,需要经常使用的两个项目是聊天和地图

打开聊天的界面时,主角持手机从底部旋转至屏幕内,竖屏显示聊天消息。

查看地图以及快速移动时,主角将手机从底部旋转到屏幕内(横屏),屏幕上显示当前场景地图、地铁线路图(也就是大地图)。在城市中乘坐电车移动时,会通过剪影的人像表现挤电车的感觉(在涩谷大街则换成来往的人流)。通过这些动画,既很好的处理掉了读盘时间,又制造出一种在闹市中移动的气氛。

这个界面也非常易于理解。游戏背景设定为现代的日本,我们都知道现在的生活已经离不开手机了。因此,主角用手机查看消息、地图的行为我们也完全能理解,现实中自己也会这样做。

在殿堂中移动,切换场景时:

当前的画面会被从角落像纸一样抽出,然后黑色的画面以同样的方式抽出,显示下一个场景.

主角会先从屏幕左侧跳进屏幕中央蹲下,同时黑屏(像是有黑色斗篷遮住画面一样),然后向屏幕右侧跳出。

在殿堂中探索时,右下角紧密排布着当前出战人员的头像、HP/SP量表

此时玩家没有处于战斗状态,只要可以知道大致的体力状态,确定能否支撑继续的探索即可。

战斗

从探索状态切换到战斗时,随着敌人面具被掀掉产生的闪光,游戏偷偷把背景切换到了战斗场景。同时原本紧密排布在右下角的头像如蝌蚪一般跳出展开,显示HP/SP的具体数值。

指令的排布基本按照手柄上各个键位的位置设计,玩家能轻松对应起来去使用各种功能。尽管它们的排版算不得工整,但都指向当前行动角色,当前行动的角色头像也会做出区别。使用技能时,当前选中技能所需要的消耗对应数字会放大。

生命值过低,则HP量表会闪烁、玩家角色做出艰难站立的姿态、同时还有语音“体力较低,快进行恢复”之类的话提醒玩家。(在游戏中会如此做的有摩尔加纳、新岛真、佐仓双叶、明智吾郎)。

人对具体的动作、语言等敏感度要高于抽象的数字量表,这样能更生动的展示战斗场景。如果没有这些提示讯息,那么玩家会更频繁的遇到主角”莫名其妙就死了“然后游戏失败的情况,满生命值的表现和生命值低的表现完全相同,本来也不是合理的。

这里我要鞭尸另一款游戏,在玩家角色低生命值时没有任何视觉、听觉等方面的表现来突出这个状态。

注意看,玩家角色的生命值均处于较低状态(左下角),但所有角色仍然向没事人一样正常站立着,也完全没有HP/画面变红之类的效果。我不懂,为什么2022年的游戏还有这种问题?

注:《猫之城》,番糖网络开发的一款猫拟人都市题材回合制RPG手游,在2022年7月20日上线公测。

战斗结束时,主角挥手招呼同伴,然后在背景奔跑(印象空间中,是主角们坐上猫车),摄像机在其侧面,同时显示结算详情。

结算画面结束后,镜头转回主角背后,恢复到原本的场景。

天鹅绒房间

可以在天鹅绒房间里合成、获取人格面具,以提升战力。

整体的装饰俨然就是牢房,指代雨宫莲是命运之囚,也暗示游戏的主题“反叛”

主界面各个选项是带刺铁球,在这里作为刑具出现,和牢房也相对应。

处刑

处刑部分的界面选项,主要围绕着伊戈尔的桌子。

选择处刑的人格面具时,镜头仰视建筑的顶端。

公开处刑时,黑色圆环围绕伊戈尔桌子,一个黑色圆球围绕其运动。

这是联网才能使用的功能,转圈圈的圆也像是很多网页的加载动画。

特训

一颗铁球砸到牢房的墙上,引出特训选项。

登陆、领取

镜头移出牢房,到天鹅绒房间中央。

图鉴在游戏内被称为“囚犯名册”,这里的每个选项都像是一张纸。

诊所 武见内科医院

这是游戏内购买各种恢复药品的重要场所。

主色调是蓝色,画面中有一条DNA的双螺旋。在白色圆环上的空间中,会随机浮动一些药品名和化学式。各个数字的字体是一种手写体,有一种容易亲和的感觉。

点进购买商品后,武见妙会转过身子,手里拿着一张清单,左侧就是可选择的商品。

这里背景的大量蓝色球体像是细胞和细胞核一样,令人能联想到身体。

购买商品后会弹出一个确认画面,这里就像是医生把写好的处方从册子上撕下来,交给患者的感觉

生存游戏专卖店 严禁触碰

游戏内的“生存游戏专卖店”是玩家获取装备的重要场所,主色调是绿色。

店老板岩井宗久在翘着二郎腿,并且以桌子(屏幕边框)作为支撑。

这给人一种随意、不拘小节的感觉,板着的脸也和其性格相关。

他和屏幕前的我们隔着铁丝网,象征着内心的警戒。

店老板曾经做过黑道,不苟言笑的性格和铁丝网皆为其性格的象征。

卡片上的弹孔,暗示了该处的功能——购买武器。

金钱数字、每个狗牌黑色名字下的底部装饰文字均为镂空喷漆字体。这让人们很容易想到军用品上的喷漆字,和该地点的内容相贴合。

购买武器时,选择需要购买装备的角色时,角色名是写在狗牌上的。

狗牌,也就是军用识别牌,用以军人的身份识别。所有人的狗牌都在同一根珠串链上,珠串链也充当了视觉引导线,让玩家比较容易找到自己所需的选项。

确定购买某道具时,详情部分的纸张掀开,露出下方确定购买的按钮。它们是靶心的形状,如果玩家按下确定,就会有一颗子弹穿过,留下弹孔。

印象空间,约瑟

这是皇家版中新增的内容。印象空间可以收集花朵,在他这里换成有用的道具。

约瑟的界面很美,尤其是和印象空间那越往下越阴间的鬼地方相比 。

这里背景是星空,主色调蓝色、副色调是黄色

由卡通星星构成的星河,作为两个选项的背景,同时充当了视觉引导。雨宫莲和约瑟一起坐在约瑟的车上看星星。

所使用的字体是圆体,给人一种较为柔和的感觉。 约瑟看起来像是小孩子一样,容易让人感到亲近,字体也照应了这一点。

选择“交换道具”时,星河通过旋转移位到屏幕下方,屏幕左侧的星河偏低一些,同时人物右移。这里星河也充当了视觉引导,将有用的选项包了起来。

选择“认知变化”时,星河旋转变换到左上角,向右上流动。人物左移,同时约瑟挥动锤子,认知变化的面板出现。

认知变化的文字排版是略向右上倾斜的,约瑟挥动锤子的动作也相当于视觉引导。

Fin:潮到出水的UI

它的界面同时做到了风格化和让玩家操作起来有趣。尽管第一眼看上去似乎眼花缭乱,但只要稍微上手就会感觉到妙处所在。而且如果这款游戏使用常规的界面设计,恐怕就没有味道了吧。

几乎每一次操作,游戏界面都会给玩家大量的二级运动动画作为回馈和奖励。《游戏设计艺术》中,作者称这样的系统为“多汁系统”,就像一颗成熟的蜜桃,只要与它有一些互动,就会不断的向你回馈可口的汁水。

虽然以上这些部分中,几乎每一个单独拿出来都微不足道,但游戏本身的高品质正是由它们积累而成的,它也着实“偷走了我的心”。

参考资料/来源

浅谈Persona5 UI #1:How Pop X Punk?!

https://indienova.com/indie-game-development/p5-ui-design/

Persona5UI 解析视频 记录

https://cowlevel.net/article/2012502

ExaminingPersona 5's Menus - Video Notes on P5's UI

https://www.youtube.com/watch?v=DxOGkhLfPf8

[责任编辑:linlin]

标签: 佐仓双叶 视觉引导

相关文章

评论排行
热门话题
最近更新