《绝区零》游戏UI动效简析

用户头像
阿姆斯特丹/交互设计师/4年前/7130浏览
《绝区零》游戏UI动效简析

近日的火爆游戏《绝区零》开启测试,这款游戏是由上海米哈游影铁科技有限公司制作发行的Roguelike动作游戏作品。

当前游戏版本为测试版本内容,不代表游戏最终品质

近日的火爆游戏《绝区零》开启测试,这款游戏是由上海米哈游影铁科技有限公司制作发行的Roguelike动作游戏作品。

我自己本身也很喜欢Roguelike动作类型的游戏,而《绝区零》则是这两种类型的结合体

这是一个被神秘灾害“空洞”所侵袭的危险世界,旧文明覆灭,秩序被埋葬。所幸,还存在着一座有能力应对“空洞”灾害的都市:新艾利都

虽然依然沿用了当下二次元品类游戏喜欢的“后启示录”风格,但我们还是能从《绝区零》的PV中看出它与一众末日游戏表现出来的不同。首当其冲的,就是画面上的耳目一新,一股浓浓的动感街头现代风

注释:后启示录风格,描绘了末日后的人性、废墟、艰难地求生、荒诞怪异的行为或思想,和对末日前政治,文化和人性的批判和思考,体现了独特的魅力

这只兔宠这个是整个游戏中我最喜欢的设定


《绝区零》这款游戏整体是一个Roguelike类型的游戏,玩法有些像《暗黑地牢》一个关卡里有许多藏着未知效果和事件的格子(这个是后面动效设计表现的灵魂),角色会因为探索未知格子的时候累加压力值,每当压力值超过100,战斗时就会有一些恼人的负面效果。你可以直奔战斗与BOSS,也可以挨个格子地搜刮资源,获取增益,对抗那些奇怪减益,让自己的战斗打得更爽。

注释:Roguelike本身的理念源自于二十世纪七十年代的游戏,包括Adventure (1975)、Dungeon (1975)、DND/Telengard (1976)、 Beneath Apple Manor (1978),并利用了一些PLATO系统(即第一代网络游戏),完成了基础建设。目的是在电脑上再现“DND”游戏体验,并且严格遵循“DND”游戏规则的单人回合扮演游戏。

这款游戏在当时非常受欢迎,以致后来衍生出了一系列与“Rogue”相类似或者同类型的游戏作品,这些作品被统称为“Roguelike”

《暗黑地牢》


《绝区零》的界面风格采用了丰富的涂鸦色彩平面图形相结合的设计形式,主题元素使用了旧时代电视机的独特元素,让这款游戏在众多二次元游戏中脱颖而出,下面我们重点看一下这款游戏的界面和动效设计

剧情关卡-入场

整个游戏的交互操作80%以上都运用到了镜头,“剧情关卡入场”这里通过黑色过渡加上镜头旋转的方式将“主界面”和这个“剧情关卡”界面进行衔接,这种方式的设计不会因为界面产生硬切而让用户忘记上一步的操作,我们在很多项目中都会应用,实现方式简单有效

剧情关卡-关卡选择

这里的二级页面通过镜头将一级界面再次拖拽到近景,与关卡选择产生关联,使用户交互过程自然而然的了解界面之间的逻辑关系

影像档案

为了让探索足够有趣,你可以随处发现质量相当不俗的细节内容。比如在录像店里,仔细看那些碟片的封面和宣传海报,不难发现这里的碟片真如现实电影那样,每一张都有着独属自己的风格与海报,使用户产生沉浸式现实体验

碟片

影像档案-选择关卡

“影响档案”“剧情关卡”采用了同样的设计形式,只是包装略微不同,所以这种形式的动效设计也可以像UI一样可复制化

剧情关卡-奖励选择

《绝区零》整个游戏的核心玩法就是以每一次随机性的探索格子,获取增益的方式进行战斗力提升,从而完成剧情故事关卡,所以这里的动效设计也显得尤为重要,也是这款游戏动效设计中的灵魂

关卡-条件选择过场

Roguelike部分,所有可探索的格子都是由一台台七几年那种老式电视机组成(这可能是80后小时候的回忆了),通过卡漫的方式渲染,结合都市的科技感,将旧时代的物件恰到好处的融入到了科技都市风格当中,而且关闭的那一瞬间的动效设计也采用了这种老式电视关机的效果,这就是动效的交互情感体验重要性,90后应该对这些就没有太强的概念

剧情关卡-选择奖励

所有带内容的格子都闪烁着卡通、搞怪的动画。翻看出现在关卡的特殊格子,每一个都有自己特殊的动画

剧情关卡-选择奖励-抽奖

剧情关卡-选择奖励-抽奖返回

《绝区零》的界面动效设计是一种突破,它的动态效果是有一些动态的内容表达在电视画里,通过电视机关闭和打开来对用户操作进行交互反馈。整个格子的设计中,运用了很多主机游戏的设计手法,采用镜头设计,来完成交互,让交互过程更有现实操作代入感

剧关卡-选择奖励-转场

每一次选择前后的视觉跳转,都能让我们轻松的分辨出交互对象,判断下一步要操作的事情

剧情关卡-获得奖励-选择

比如同样表示战斗关卡,同样都是红色的危字,它单用电视信号闪烁失真的程度就足以暗示这场战斗的危险程度。这种抽象、足够下意识的内容表达,有时还会以一种打破规则的方式来呈现。

在一些表达角色被敌人埋伏的剧情时,玩家前进的路径会被堵住,取而代之的是一圈圈闪烁「危」字的电视机,将玩家团团包围。

这部分也是从剧情关卡操作中筛选出来的一部分,这些设计主要表现为电视播报的视觉画面再加上镜头远近的推移,转换到用户操作界面的过程,让游戏更具有沉浸式体验

剧情关卡-结算

剧情关卡-获得奖励-转场

剧情关卡-加载转场

剧情关卡-选择奖励

剧情关卡-转场

关卡-Loading

这是第一种加载形式,通过与电视主题关联进行设计,而且过程自然柔和,不会出现极端的卡顿现象

LOADING

游戏中使用了多种加载方式,兔宠是第二种,在这个Loading加载过程中用了贯穿整个世界观的兔宠来做动画,让加载过程显得格外有趣,等待也是值得的

弹窗-道具

弹出窗口-玩法引导

虽然只是简单的弹窗,但是入场和离场也是有自己的节奏规律,而且弹窗中背景氛围的文字滚动,也与整体界面风格相匹配

这种形式的设计主要目的是为了让两个界面之间的硬切转化为柔和的过渡,它主要是由平面风格中的抽象图形世界观相匹配的元素结合构成,这种设计手法目前在很多射击游戏界面中出现

这些设计在整个有些界面动效架构中保持着统一的形式,属于动效管理的一部分,类似UI界面设计中的弹窗,通用素材的管理,在项目中统计得当,会大大提高工作效率

这部分设计相当有趣,在传统设计中一般都是一张图片,一堆文本,就描述了一个剧情关卡要做的事,或者是任务对话的选择,而《绝区零》确将这些信息转化成了视频动画形式,能直接了当的传达当前页面的大部分功能和用途,而且让整个过程看上去非常有趣

为了让剧情故事演绎得足够有趣,在游戏测试版的一开始,《绝区零》就同时动用了3种呈现方式:风格化的漫画、带着浮夸表演的CG,以及传统的NPC对话。让剧情故事像看动画一样精彩。

总体来说,这款游戏是非常值得玩一玩的,期待他的公测,本次分享就到这里,如果大家想看更多高清动效视频剪辑,请关注我们的官网

https://www.lemooui.com

这里有更多游戏高清视频参考等着你

也欢迎您加入到我们的动效交流群

那里有更多动效技术交流和分享

106
举报
|
260
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
APP/小程序商业项目UI模板|99个高保真UI+79个原型
UI界面 组件
户外旅行飞机情侣假日出行
新能源APP应用UIKit
【新年UI图标】汽车icon
盲盒APP UI设计
3D渐变流体抽象矢量UI背景图
新拟态风格 UI设计组件库
UI通用设计素材1
【新年UI图标】银行卡icon
UI 登录界面设计模板包
【新年UI图标】影音icon
科技医疗透明柜UI界面设计
【新年UI图标】优惠券icon
高级感金属拟物 UI设计组件库
Security Camera UI kit
【新年UI图标】游戏/娱乐icon
智能家居中心 简约 UI设计组件库
钱包ui模板
高级表盘系列UI源文件
【新年UI图标】钱包icon
3D卡通UI界面图标可爱插画免扣素
手表表盘UI系列
你可能喜欢
相关收藏夹
大家都在看
登录注册