1.5 界面动画

界面的布局技巧可以增强游戏的沉浸感，但动画元素的加入却能让界面拥有灵魂。不同的界面之间切换会有独特的过渡效果，这些并不是特别复杂的，如果细心观察会发现一定的规律。

1.5.1 从动作出发

谈到过渡效果，必定会想到制作PPT时用到的过渡效果，如上升、下降、淡入淡出、缩小放大、闪黑闪白等。

[基础动作]

如果你是一位设计师同时又是一位玩家，你会惊人地发现大量游戏的动画处理方式是如此相似。

如下图所示，将界面分为5个区域：上（区域1）、下（区域3）、左（区域2）、右（区域4）、中（区域5），针对四周区域（区域1～4）的设计元素同时进行快速切出切入过渡。对于居中的内容（区域5）则可以通过符合元素本身的动画效果切入，例如，采用冲击视觉的过渡方式。

[将界面划分区域]

而游戏内部并非只有这一种常规的布局方式，但大多数都是基于这些基础布局进行的不同组合。

类似下图这种贯穿屏幕的滑动设计（从右快速拉出到指定位置），而在设计动作时设计师必须注意对应元素的环境及设计方式。

[滑动设计]

实际设计时需要注意

-1-考虑切换动画的节奏感，若在这方面没有更多的经验，可以找一些成品参考或请教专业人士。

-2-在同一个界面中的信息动画需要在一个节点统一结束，避免出现动画先后结束的混乱现象。

-3-在制作界面过渡效果时，建议不添加返回切换过渡，原因是太耗费时间。

-4-需要在空间设计基础上，对界面区域进行合理划分。

1.5.2 元素特效

当进入游戏时，会看到一些特别绚丽的入口图标动画，在游戏进行过程中触发一定的规则条件也会播放绚丽的动画。现今，游戏特效已经成为产品中不可缺少的组成部分。

[动画图标]

好的界面特效往往需要UI设计师的前瞻性思维。当在设计一个界面时，除绘制元素外，还要考虑这些元素应该在游戏中如何展现，并在大脑中形成模拟效果。

例如，在设计匹配界面时，需要考虑元素之间的结合方式，每束光应该怎样进入退出，不同材质的表现方式，复杂的粒子效果控制在什么范围不会影响主要信息，什么样的动作能更好地提升视觉冲击力等。