资深视觉设计师总结的6 条 UX 设计动画原则：有用胜于有趣！

正文

请到「今天看啥」查看全文

假如你决定点击其中一个项目，然后它展开了那篇文章的全部内容，之前与其他信息处于同一层级的信息现在变成了主要内容。过渡动画是加强用户选择的一种好方法，不仅展示了你仍然和处于选中状态的同一物体进行交互，而且也会给你带来更多的屏幕空间。

提供定位

当用户界面和用户之间的所有障碍被移除后，用户界面变得更加真实具体起来，因此赋予用户空间定位感变得十分重要。你可以通过让动画保持一致和 app 的结构易于理解做到这一点。

一个物体向左移出屏幕，如果它再次出现，从逻辑上讲，应该来自其移出的地方。这将帮助你的用户理解 app 的面貌，用户在使用时会感觉更加舒畅。反之则会引发混乱，用户甚至可能会认为他们看到的完全不是同一个物体。

内容从底部进入 vs 内容从右边（箭头的指向）进入

这同样适用于屏幕上出现的视觉提示。想象你点击了一个带有向右指示箭头的列表项，逻辑上的过渡应该是自右向左滑动，好像用户视图向右移动一样，加强了用户界面中的视觉线索。

很多时候你会看到 UI 元素与过渡动效相矛盾。这有点恼人，我认为这些是我们应该避免的，否则动画会让用户看起来很突兀，因为它们违反了用户的预期。

提供及时反馈

你曾否问过自己，我按下那个按钮了吗？它做了什么？我应该再按一次吗？回答可能是肯定的，你或许会一遍又一遍的点击，只为确认实际上你在最初的时候就按下了。这就是为什么提供及时反馈是重要的原因，即便 app 没有立即做出反应。

在这个世界中，你的手指通常会盖住点按按钮，动画在为用户提供他们所需的安慰上发挥了巨大的作用。

轻微的颜色变化 vs 快速动画

在某些情况下，你甚至可以更进一步并让其更加吸引人。假如你的应用中有一个「星星」按钮，它是你的「英雄」操作之一（从未见过，我知道）。这时你就可以好玩一点，来让用户开心。让他们感到这是有奖励的，用户就会想要重复这个操作。

注意下时间，动画需要及时被感知，否则它就会变得缓慢并且很快就被讨厌。还有一点，不要让其吸引过头。

让内容感觉是实时的

没有过渡 vs 从顶部滑入

如果你的 app 或者网页有实时的内容，比如照片，评论或者某种计数器，动画可以帮助你完成两件事情：顺畅地添加新元素以及缓冲加载这些元素可能造成的延迟。

讲故事

请到「今天看啥」查看全文