background image

演进。每一个毫秒里界面元素如何出现和消失,它的大小、位置、透明度和颜色如何变化,通
过动效的诠释,用户与产品的交互过程会更加顺畅。

Appflow 中,界面元素的出现,菜单的

停靠,都伴随着富有节奏感的动画效果,让整个使用过程一气呵成。多米音乐中使用旋转的
唱片来作为场景过渡之间的连接点,契合音乐应用的主题,也是转场过程连贯自然。

2. 高效反馈

作为与用户之间发生联系的一个很重要的交互元素,良好的反馈设计可以让用户更好地了
解到操作的结果与程序当前的状态,减轻用户在等待过程中的焦虑。与文字型的静态反馈相
比,使用动效可以让反馈高效直观。

iOS7 的 app store 中通过环状的进度圈来表现应用的下

载过程,并将其与暂停按钮结合,让用户对进度一目了然,还可以便捷地暂停进程。

3. 增强操纵

“直接操纵”是移动产品用户体验中很重要的一个概念,简单来说,它要求我们的产品与用
户交互的方式尽量接近真实世界的互动方式。它要求交互对象的反应行为是可以预测的,不
需要任何提示,并且符合我们对于现实世界规律的认知。这就要求我们拉近界面操作与用户
的距离,让用户难以发现虚拟的交互对象与现实的操作行为之间的屏障,很多令人新奇和
兴奋的设计点都来源于此。通过交互动效对于现实世界的模拟,我们可以显著地增强产品的
“直接操纵”特性。以 Paper App 为例,使用过它的同学都会被它精致的交互动画所吸引。轻轻
翻动绘图本,打开一页开始绘画,栩栩如生的体验让你即使初次使用也能很快投入。

4. 帮助引导

由于移动界面的空间非常有限,我们经常要藏起一部分功能,同时手势操作也是移动应用
中很常见的交互元素。我们要怎么样让用户发现隐藏的功能,告诉他们怎么使用手势呢?这
个时候,动效作为一种生动的表现形式,往往可以起到很好的帮助引导效果。

iOS7 中锁屏

界面滑动解锁的提示会显示一种从左到右的渐变效果,用户可以根据这种运动方向去预知
手势的方向。在打开

read it!的时候,会短暂显示左侧的菜单,然后右边的主内容区域划过

来逐渐覆盖,直到左侧只剩下图标作为入口,这帮助用户了解了侧边栏所隐藏的功能。

5. 升华体验

如果你的产品已经拥有了良好的可用性,却缺乏亮点,也许你可以考虑为其增加动效。将动
效融入产品之中,往往带来更愉悦地使用体验,也更细腻地表达应用的情绪和气质。具有一
致性的标志动效,常常帮助产品在细节中流露出独有的品牌特性,增加产品的魅力值。

我们可以发现,交互动效的设计既在产品的功能层面提供支持,又在表现层面发挥影响,
而且在移动产品的交互设计中,它确实很有实用价值。那么,要怎么做才能更好地为我们的
产品设计交互动效呢?在这里,总结出以下一些设计要关注的点:

关注当前动效设计风格的潮流,顺应轻动画的设计趋势。以

iOS 7 为代表的动效设

计摒弃了复杂的拟物动画,风格更为灵活,轻快,强调响应,可以作为我们设计动效
时的一种参考方向。

让动画符合基本的现实运动规律。如何位移、如何缓动都是一门要下功夫的学问,要