游戏界面<空状态>设计规范

1454天前
转载文章 / UI / GUI(游戏) (本文章为转载文章,如果若您的权利被侵害,请联系管理员删除的)
6181
0
3
 | 
作者:杨曦

1667392636356970_0.jpeg


空状态界面,意味着没有内容、失去连接、发生错误。


玩家如果没有在界面中看到他所期望的东西,我们需要解释界面为什么是这样的,借此来获得用户的理解。


166739264079277_13.png


由于内容的不确定性,空状态界面在设计过程中非常容易被忽视。除了视觉上的缺陷外,这个状态在引导性、愉悦性以及留存率等方面的都影响巨大。


166739263715634_3.png



一、空状态设计定义


好的设计能够帮助玩家快速了解功能,告知当前状态,引导进行下一步来获取内容。


从使用情景角度出发,在设计中可加入三类内容:解释说明、交互引导、内容预设。



解释说明类


帮助玩家快速了解功能,避免一上手就产生迷茫无助的负面情绪。


1667392638325154_5.png



交互引导类


通过快捷交互手段,解决空状态问题。


1667392638154964_6.png



内容预设类


隐藏一部分信息,让玩家对未来内容建立预期。


1667392639796170_7.png

图鉴中显示人物剪影和名称,预告感更强



二、空状态设计公式


主动操作型


玩家可以通过自己的操作来填入数据


设计公式:成因+交互指引


166739263957225_9.png


被动等待型


玩家需要等待他人或系统注入数据


设计公式:轻松氛围+时效性解释


1667392639735173_10.png



条件不足型


条件不达标,显示即将出现的内容


设计公式:内容隐喻+引发联想


1667392640783135_11.png



三、空状态设计细节


氛围反馈


为玩家营造更轻松的体验氛围。


细节点:立绘的表情、姿势与文案


 正例 


166739264079277_13.png


 反例 


1667392641540741_14.png

生气表情联想到不善的语气



智能推荐


需要查找的系统中,为玩家建立帮助力体验。


细节点:推荐逻辑一定是符合玩家诉求的


 正例 


1667392641156785_15.png


品牌调性


符合游戏产品风格的设计语言与文案


细节点:注意构图美感,认真对待配图文案


 正例 


1667392641479935_16.png

经典的月亮、云纹与江湖


1667392641746653_17.png

符合游戏世界观背景


 反例 


1667392642391168_18.png

图素、构图影响品质



等待焦虑


通过趣味设计,减少等待焦虑


细节点:空状态也可能发生在交互之后的等待期


1667393351382453_0.png

匹配等待5秒后,出现引人发笑的角色



四、总结


高阶设计师的必备素质是:将需求中的所有状态都全盘考虑。


当前的空状态页面设计,早已不是简单告诉玩家此时的页面状态,而是需要考虑空状态的引导性和贴合游戏世界观的情感化包装。


作为设计师的价值体现,要替玩家多想一步,在设计规划初期就将空状态和普通界面一起整体思考。在表明当前状态的同时,指引下一步操作,给玩家更具有沉浸感的游戏体验,从而通过细节设计提高产品留存率。

声明:乐魔UI(Lemooui)内网友所发表的所有内容及言论仅代表其本人,并不反映任何UI(Lemooui)之意见及观点。
举报
收藏
文章-GUI(游戏)
6181
0
3
标签
没有标签
全部评论
发表评论
设置密码
注册会员
我已阅读并接受《乐魔UI协议》
微信登录
二维加载中...

使用微信扫一扫登录

“乐魔UI”

建议反馈
提交取消
举报
提交取消