功能性转场动画效果设计

       

功能性转场动画是用户体验设计的重要一环，它一般出现在页面衔接、命令执行或对象编辑的过程中，同时也有类似错误提示、操作提示中涌现出来的。它使人机交互更加友好，更人性化。

通过排列组合、分裂、变化形状，运动可以使对象更加灵动。功能性的动画，应该流畅地在导航内容间引导用户，解释屏幕内容的变化，并强调元素层级。

成功的动效设计具有以下6个特征：

1. 响应及时且恰当

视觉反馈在UI设计中极度重要，因为它符合了用户在日常生活中的体验。在现实生活中，拖拉、拨动各种物体，都会响应我们的操作，这符合用户的预期。

响应一是要及时，二是要恰当非常重要，否则就会造成对用户经验的挑战，造成体验差。

2. 提升关联性

让页面之间与触发它们的元素或操作关联起来。帮助用户在界面布局中理解刚发生的变化，是什么操作导致了这个变化。

3. 了解自然规律

不要刻意追求动画效果，所有的运动都应该遵循真实生活中力的作用，比如重力、磁场力、摩擦力、弹力等等。类似的，在好的界面设计中，你能时刻感受到这些。

4. 有目的的引导

设计好视觉线并引导用户到适当的位置。动画一定是页面中最为亮眼的那个部分。无论文字段落还是静止图片都无法与之相提并论。用好的过渡效果引导用户到下一步操作，适当的动画能帮助用户保持方向，不会感觉内容的突然改变。

5. 该快的一定要快

元素在不同位置和状态间运动时，运动要足够快，不要让人等待；也不可过快，让过渡能够理解。不要缓慢的动画，因为它产生了不必要的停顿，延长了整个过程。

6. 明确

过渡效果应当避免一次做太多事情，因为如果许多物体往不同方向或沿着不同路径运动，它们就会令人困惑。过渡效果应当明确、简洁、条理清晰。记住，关于动画，少即是多。我们应该只专注于动画能为用户带来的实际价值。