移动 UI 设计中，动画的 3 种主要用途

随着技术的快速发展，动画不仅视觉奢华，更是用户期望的功能需求。 动画解决了界面中的许多功能问题，使交互生动起来，真正地响应用户 。

下面让我们来探索下提高移动界面功能和情感力量的关键动画策略。

1、系统状态

在应用后台通常都会有很多进程，例如正在从服务器下载数据，正在进行计算等等。这样的进程总是需要一定时间，所以你要让你的用户知道应用没有卡住，并且显示出它正在处理的状态。这种视觉信号能够给用户一种正在控制应用的感觉。

加载状态

每个应用的加载时间都不可避免。虽然动画不能解决这个问题，但是它们能够可以让等待变得没那么无聊。

“当我们不能缩短距离时，我们可以让等待更加愉快。”

有创意的进度显示能够减轻用户对等待的感觉。动画会影响用户对你产品的看法，使它看起来比实际上要好。

下拉刷新

大家应该都知道“下拉刷新”这个动画，它启动了移动设备上的内容更新过程。

提示：下拉刷新动画应该符合应用设计规范，如果应用程序最小，那动画也要。

通知

移动的物体很容易吸引你的注意，所以在通知上加动画是一种友好的通知方式

2.导航和过渡状态

动画最基本的使用时转换。这种类型的动画背后的逻辑是帮助用户了解页面布局刚刚发生的变化，触发更改的内容以及如何再次启动更改。一个典型的例子是一个抽屉导航来切换隐藏的内容。

抽屉导航可能是这种场景下最好的选择，但其实还有很多种导航动画、

传递导航的上下文

设计师用动画来平滑地切换导航，并解释屏幕上元素的排列的变化

元素之间的视觉分层和连接

动画非常适合描述界面的对象，并说明它们之间的相互作用

功能改变

在某些情况下，设计师被迫设计一个在特定条件下其功能发生变化的动作按钮。我们经常在整体空间有限的移动设计中看到这一点。

这种类型的动画显示了当用户与其进行交互时元素如何更改。在下面的例子中，当用户按浮动动作按钮时，加号转换成铅笔。这表明铅笔是主要的创作方法。这么小的细节意味着不得不猜测接下来会发生什么，并知道这个图标在任何一个状态下是什么意思。

3.视觉反馈

视觉反馈对于任何用户界面至关重要。它使用户感觉到控制，对于用户来说，控制意味着在任何给定的时间知道和理解系统中的当前上下文。

识别性

用户界面元素（如按钮和控件）应显示为实体，即使它们位于一层玻璃幕后面。

“在物理世界中，按钮，控件和其他对象根据我们与他们的交互响应。人们期望用户界面控件具有类似的响应能力。”

为了弥合差距，视觉和运动应该立即反馈，并以直观的动画显示。

可视化操作的结果

动画可以增强每个交互点，并加强用户执行的动作。

在Stripe的示例中，当用户点击“付款”时，会在应用程序显示成功状态之前短暂显示一个微调。复选标记动画使用户感觉到他们很容易完成付款，用户也很喜欢这样重要的细节。

结论

当以复杂的方式使用时，动画是强大的。它把设计带进生活里，甚至使用户进行最常规的任务，当然也可以让您从人群中脱颖而出。精心设计的动画能提升用户体验。

——————

原文链接：3 Key Uses for Animation in Mobile UI Design

关键字：UI设计, 设计, 动画

版权声明

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处。如若内容有涉嫌抄袭侵权/违法违规/事实不符，请点击 举报 进行投诉反馈！