移动设计中不可或缺的交互

小编推荐：在这篇文章中，来自UXPin（一款在线界面设计应用）的克里斯·班克（Chris Bank）介绍了移动应用交互的重要性，以及它在设计模式上的影响力。更多的细节可以阅读UXPin的免费电子书《Mobile UI Design Patterns 2014》，书中有**过50个热门移动应用的案例。

手势

还记得浏览网页时，只能通过点击、滑动、滚动和键**快捷键来交互的日子吗？虽然如今它们不再是唯一的交互方式，但它们的确主宰了浏览网页时的用户体验。

从另一方面来看，移动领域已经随着新设计模式的实现迅速扩大。也因为硬件和软件的持续发展，移动应用设计也随着史无前例的人机交互模式逐步发展成为现实。新的手势为解决方案提供了可能性，也因为响应式设计的进步，网页和移动端设计同步化加剧，使得应用程序能够适用于各种形状和尺寸的设备。同时，这也对网页体验的设计产生了重大的影响。

我们来看看安卓现有的手势，你的直觉认为像日历，信息或者相册这样的模型**有多少种交互方式？

网址点此

再来看一看苹果珍藏的多点触控专利手势，相信你的脑袋里一定**充斥着各种能够设计的解决方法。下面给出的示例来自2010年的专利备案，已经有很多都被实现了，苹果公司的专利手势文档中一定远**这些示例。你可以把它当作是“少数派报告”未来的一种预见吧。

网址点此

安卓系统，苹果系统和其他移动平台还**继续增加各种各样的手势，自然地实现应用中特殊的行为和导航。这不仅仅是去除屏幕上的按钮来保持屏幕的真实形态，更重要的是让体验变得直观有趣。再将这些手势和多样的动画结合起来，总有一天你就能够把用户界面设计模式应用到你的移动应用中。

动画

在移动终端使用手势让用户觉得使用很自然，响应也很真实。而动画扮演很重要的角色，放飞用户的幻想却又把他们限制在用户界面内。

除了有形的动画，他们还经常使用自然的法则和规律。定时，速率，弹力，图像和颜色过渡，滚动，以及各种设定。这些法则让用户觉得设计师的手段无穷无尽，充满了惊喜。

多种动画和手势的结合不仅增加了体验的乐趣性，也为用户提供了宝贵的视觉反馈。这里只做简要说明，之后我们**在博客和设计库上做深入探讨。

Captivate上可以看到有名的移动应用动画。

如果你想看许多没有装饰的过渡，Dan Silver或许能给你灵感。

交互基础示例

Pinterest，当今时代最具有成效的拟真交互电子商务公司之一，其移动应用中的“可被发现的控制”模式令其大放异彩。下面，我要详细地说明这种模式要解决的问题，以及如何完美地运用动画和手势。

用户的问题

用户想要在不中断体验的前提下和内容交互。

Pinterest的解决方案

Pinterest通过移除主要显示区域中几乎所有多余的信息和操作按钮来避免典型的电子商务或者信息网站的那种复杂体验。这种接近极简的主义让用户通过观察，拖动，滑动，触摸等方式去做最紧要的事，没有干扰，也不**分散注意力。

如期望的一样，当用户点击图**时，可以详细了解吸引他们的图**的更多信息。不仅如此，还可以进行其他的一些操作，如锁定，发送，或者是随心所欲的编辑图**。没有特殊声明的话图**可以随意使用。可是，如果长按图**，他们**发现从手指触摸的地方冒出了具有同样功能的3个气泡。当用户想去点击气泡时，手指离开屏幕它们又**消失。多次尝试这个过程后，用户很快学**需要将手指一直放在屏幕上，通过拖动手指到某个气泡按钮上来操作。这样做了过后，手指悬停的气泡**快速渐变成红色，告知用户这个按钮被选择了。一旦用户手指离开屏幕，这个动作就生效了。

可见的控制按钮配上娱乐性十足的动画，再加上符合直觉的手势控制，整个体验过程都**轻松愉快。类似Pinterest或者其他站点的功能，“可被发现的控制”设计模式，让内容更加切实，让人着迷。

乘上交互的浪潮

现在是移动设计令人振奋的时刻，移动应用中运用手势和动画已成爆炸之势发展。想要了解更多关于著名公司是怎样将手势和动画融入已经存在和新的设计模式中，请阅读UXPin的免费电子书《Mobile UI Design Patterns 2014》。使用你需要的模式，剩下就不用理**了，但一定要保证将他们调整到适合于你自己的问题，最重要的是适合你的用户。

网址点此

来源：ui中国