《猫之城》动效
《猫之城》手游，是近日刚上线不久的一款由上海番糖网络自主研发的一款以猫拟人为卖点的回合制策略卡牌游戏
《猫之城》手游，是近日刚上线不久的一款由上海番糖网络自主研发的一款以猫拟人为卖点的回合制策略卡牌游戏
《猫之城》名字中的“猫”与“城”已经将游戏的主题表现出来了，大致的剧情便是玩家作为调查官，带领猫娘小队，在一座以“潮酷文化”为标签的都市中参与各种案件的故事
在这个世界里,“情绪”变成了一种可视化物质。它可以被安抚，也可以被放大、被操控，而在这座“猫之城”中，情绪被具象化，甚至被转化成新的能量，变成“情绪武装”
这款游戏的风格以二次元为主，同时融合了浓郁的赛博朋克风格地标，在游戏场景中多见。
而界面风格采用了日系漫画风的绘图方式与平面二次元图形元素的结合，和《黑潮之上》这款游戏有相似之处，由于采用绘图方式的界面，所以整个动效设计上也相对容易出效果，下面我们来欣赏一下这款游戏的动效，首先是“创建登陆”
登陆-签名
这里采用了拟物的第一人称视角，和传统的平面登陆相比，加上漫画风格的渗入，更容易把我们代入二次元的空间
新手引导
每个游戏刚进来，都会有的功能，一般都是需要引导的地方亮，其他地方加以透明的暗色遮挡，来突出需要点击的区域，这款游戏中在遮挡过程中加入了线条的动效引导设计，仅仅只是视觉的补充，功能上没有太大的作用
主界面开启
在刚进入游戏的时候，一个猫咪女仆，通科技能量召唤，开启了我们的主界面所有功能，创意非常新颖
界面转场
转场设计中的LOGO是游戏的主LOGO，游戏中多个地方的界面切换没有采用硬切的形式，而是通过这个转场动画进行了衔接，让过渡更加自然，而且充满着世界观的主题风味
行动-入场
这种界面在动效上其实是最好实现的表现方式，通过原有的视觉设计内容，进行现实认知的运动规律补充，就很很好的表达界面氛围，而且从画面的拟物设计，结合文字信息的描述，打破了传统的单一图标功能设计方式，同时也能很好的诠释每个功能的实际用途，这个在《神觉者》这篇文章中也详细讲到，而《神觉者》中主要是以3D形式出现
行动-副本转场
就像这个画面，通过镜头推移的方式就能让交互过程更有代入感
剧情-角色
图鉴-角色档案
图鉴-情绪武装
图鉴-入场
图鉴-武装影响
邀请-饮料合成
剧情-故事入场
角色信息
在平面的绘图上加上3D“猫宠”的模型，在结合动效的循环氛围，让界面空间更立体，更接近我们的现实生活（不知道此时此刻你的工作台上是不是也有一只猫咪陪伴）
合约
签订合约
首冲
反馈-获得奖励多个
除了抽卡，这个获得奖励是让我在游戏中最有成就感和愉悦感的画面，对比一下其他游戏的的获得反馈类型设计，它的整体设计来说并不是很强烈
反馈-章节完成
反馈-新功能解锁
反馈-好感度提升
这个界面的设计的“节奏起伏”是我们动效设计中非常重要的设计方式，在不影响交互的情况下，这样的设计会让我们的情绪产生共鸣，从心形图案的爆发传达给我们一种强烈的欲望归属，结束之后又平稳的增加好感度的进度，形成了一条完整又美好的故事演绎
召唤-入场
这个界面的设计吻合了城市高科技的世界观主题，从一个高科技手机中投射出来的召唤画面，然后结合平面图形的展开手法，而且画面中还带有一些透视感，虽然这个透视感会有些怪怪的，主要原因是平面和透视之间的关系处理上，人物看上去像被斜面压扁，不过好在动效的补充，给画面增添了不少色彩
召唤-转场
这个是召唤的转场过程，一个猫咪女仆把我们带到了召唤的小屋
召唤-十次
整个游戏界面设计中都是围绕着猫和城市为主题，这一点设计师把控的非常精准
召唤-完成展示
这个界面的设计还是很有特点的，也是打破了以往的平面的常规，使用了三维空间的设计手法，而且和前面几个界面设计相呼应，不管从界面还是动效上形成了一套统一的风格
战斗-战斗开始
战斗开始的强节奏速度感，加上图片裂开的动画表现，即使没有其他画面的补充和设计，也能感受到战斗一触即发的既视感，这种情感的动效设计表达，能极好的将用户带入到游戏体验中，就像下图的“必杀释放”
战斗-必杀释放
战斗-技能合成入场
这个是这款游戏的战斗玩法，玩了两天没有深入体验，操作有些繁琐，这里一直没搞明白，像连连看，但是又找不到相似的图形和色彩变化，只能用上自动战斗了，卡牌入场的立体感动画节奏设计给战斗体验增添了不少乐趣，不会让连连看的过程感觉那么枯燥
战斗-战斗胜利
战斗-战斗失败
这两个界面的设计过于平稳，过于相似，没有胜利的喜悦感和失败的失落感，在用户体验中会有些区分不开
本期分享就到这里，如果大家想看更多高清动效视频剪辑，请关注我们的官网
这里有更多游戏参考等着你
也欢迎您加入到我们的动效交流群
那里有更多动效技术交流和分享
