美国制造业的超级周期要来了!

青年就业难,可能低估了

《簡帛》 | 袁開慧、趙懷舟:老官山漢墓醫簡《醫馬書》簡27字詞考釋

云南永德芒果节开幕式:以节为媒 迎八方来客共享盛宴

曾建斌案的罪与罚

生成图片,分享到微信朋友圈

自由微信安卓APP发布,立即下载! | 提交文章网址
查看原文

《Nikke:胜利女神》的动效简析

欧型兔 COTA五号 2022-05-16














甚至在局内某些招式弹出tip中的人物角色立绘也是动态的:








不过,这款游戏界面依然保有一些其他游戏中不常见的设计,如趋向于应用化的设计以及典型的核心元素使用。


应用化的设计,如一些弹窗类的通用元素,乍看之下并无游戏界面设计的特征,反而更类似应用类设计特征:圆角矩形和纯色图形以及精细的内容排版。如下图所示“装备穿戴”弹窗所展示的样子:



这种纯色带一点纹理的设计,如果不是叠加在后边的界面上层,是很容易被认为是一款应用的,甚至是操作系统类设计的一部分的。


这种现象在近期的一些游戏,尤其是日韩的游戏中非常常见。有些游戏甚至夸张到已经舍弃了材质或者纹理的表现的程度。典型的如下图《黑色沙漠手游》这样:



上文我们说本游戏的主题元素没有非常明显,但它依然还是有的,而且是一种非常简单的元素:方块。这种元素在一些点缀性质或者“热点”地带时,表现的非常突出。


如获取提示和升级提示类的提示动效中:








显然,设计师将这种方块元素与其他元素进行了多种组合表现,在动效中更结合了许多生长式动画。不同情景中还有一些延展,如下图所示的“BOSS出场提示动效”:



这种元素的进一步延展是“抽象转场”:



我们在之前的文章中提过(相关文章回顾点击这里),这种抽象转场是利用动效去体现游戏界面设计特征最重要的点位之一。除了功能性设计的出发点之外,它最重要的存在价值就是体现某种设计元素的延展。这种延展是整个设计体系的一部分,与其他部分一起为玩家塑造一种整体视觉情境,从而造成某种特有的视觉特征。


该游戏的抽象转场形式在图形上是单一重复的,但它根据不同的场次,有着不同的细节变化。其中最明显的就是黑白两色设计,以及loading态时中央图形的变化:















这种不同形式的变化为通用转场形式可能构成的单调设置了“防火墙”,将两种色彩和多种图标进行排列组合,可以有效防止玩家在多次观看可能产生的单调感降低。



这款游戏的界面使用了大量通用型动效,并且以此为基础,因应“科技感”风格的设计,融合了非常多或简单或复杂的“生长式”动画(回顾“科技感”动效设计的原则,可点击这里)。这促使游戏界面整体的观感相当顺滑。


一些设计得比较好的通用型动效主要是列表型和通用型控件的动态设计,如下图所示的典型列表式入场,“人物列表”入场:



给组成列表的单元的入场加上渐次延迟效果,不同行之间亦有延迟,这是一种非常标准的棋盘式列表入场动画。


这种设计的优势在于,它们与前后操作流连贯起来之后,整个操作效果就会非常流畅顺滑:



类似的,下两图所示的单列列表动效也有这种细腻标准的表现:




多个列表之间进行切换时,这一设计样式依然有效,配合一些生长式动画的细节,使整体的细腻度进一步得到提升:



又如下图所示的典型浮层面板入场:



和下图所示的典型快捷弹窗入场和退场,和上例一样,都通过经典“快入慢出”曲线与透明度变化来控制整体弹窗的动作:




以这些通用型设计为基础,结合科技感的特殊设计,这款游戏的界面动效中有大量的结构生成动画。这是这款游戏界面动效中的亮点。而这些亮点,“恰好”处于界面中的关键点。


这种“恰好”很显然是刻意设计的结果。因为我们都会将更重的设计放在更重要的功能点位上。


比如,从人物列表进入人物详情界面时,界面中的响应效果并非简单的扩大或者其他什么通用型的动态设计,而是通过类似“面片刷新”的效果去表现:



这种效果一方面从属于科技感表现中的闪切和生长;另一方面,这种形式构成一种戏剧化的特点,为人物“出场”提供了有足够重量的前奏。


又如,系统内的一些看似通用型的动效设计,其实加入了一些关键元素与结构动画。


下两图所示的“任务系统”界面的入场,就有分块生成、抽象铺陈等手法的应用,让它与其他通用型界面在动态层面拉开了差距,表现出一定的特殊性:




与“任务系统”这种处理方式类似,但视觉上本身就有点特殊的是“信息”系统的设计。这个系统被设计为一个类似应用的界面,它有自己的App图标和主题色,所以在动态上有一定的自有特色,但这种特色也依然是建立在通用型动效基础上的:




如果说“信息”系统的动态设计是想要表现的更像应用,而在视觉层面就拉开差距的话,下图所示的“指挥中心”系统内“遗失物品”打开就属于一种典型的“游戏化”设计,即写实化的图形加通用型动效设计结合。这种在视觉层面就拉开了一定差距的设计,在动态层面不一定需要有过于特殊的设计:



如果视觉层级再进一步,就又需要特殊的视觉设计,又需要以此为基础的动效设计。如下图所示的“方舟系统”内“探索”系统的“开始探索”提示:



以及下两图所示关卡相关的提示,分别是关卡开启和关卡完成的提示动效:



















 欢迎点击下方名片关注本号 


往期推荐:

文章有问题?点此查看未经处理的缓存