谈手势驱动的移动界面设计.pdfVIP

谈手势驱动的移动界面设计 作为设计师 ，你也许还记得苹果刚刚发布iPho ne时的情景吧 ，我( 文原文作者)觉得那就像是 昨天发生的事情一样。他们将电容触屏技术完整的运用到了这样一个私人化的重要设备当中 ，这是 具有里程碑意义的时刻 ，同时也改变了整个业界的游戏规则。 若干年之后的今天 ，连小孩子们都已经习惯了触屏体验 ，好像这是非常自然的事情 ，而家长们也会 惊叹于他们的孩子可以如此迅速的学会使用触屏设备 ，包括手机和平板。这也体现出触屏设备及基 于手势的交互模式所具有的巨大潜力 ，它们让移动体验变的更加容易和有趣。 挑战导航栏、标签栏、工具栏与按钮 苹果的“人机界面设计规范 （HIG ）”及严格的审查机制对于移动应用质量的提升起到了巨大的推动 作用 ，使很多的设计师与开发者了解了移动UI体系中的核心界面元素及交互模式的运用方式。 苹果在HIG中给出了很多重要的、被广泛遵循的设计建议 ，例如对于UITabBar和UINavigat io nBar这 类导航控件的使用规范等等 ，都是我们一直以来所追随的。 一上一下两个栏位的高度加起来差不多就是整个屏幕高度的20%了 ，在我看来这确实是个问题。对 于屏幕规格如此有限的设备来说 ，界面中的任何一个像素都要用在重要的功能与内容上 ，寸土寸金 的说法再合适不过了。 在这个不该缺乏创新精神的行业中 ，设计师们需要花些时间来思考和探索 ，试着设计出更具创意同 时又更好用的界面。根据苹果一直以来对于“不遵守游戏规则者”的态度 ，我们也可以想象例如Clear 和Rise这样的应用在上架之前会浪费不少的时间用于等待。不过还好 ，它们最终还是上架了 ；虽然 这两款应用代表了那类在设计风格的突破上走的比较大胆和极端的产品 ，面向的用户并不真正大众 ，但不可否认的是 ，我们确实在它们当中看到了手势驱动的界面设计所蕴藏的创意潜力。 打造手势驱动的界面 最近的两年多时间里 ，我一直对手势操作对移动体验的提升方式保持关注 ，其间最大的体会就是 ， 多数基于手势的交互模式都非常符合直觉。我想 ，这也正是例如“下拉刷新”这样的操作可以迅速流 行和普及的最重要的原因。下拉刷新的方式最早出现于iPho ne的T eet ie应用当中 ，给人的感觉 超棒 ，以至于无数基于列表视图的应用在一夜之间都开始效仿。 去冗存精 要打造手势驱动的界面 ，你可以首先试着使应用主界面本身成为主要内容视图 ，而非传统意义上的 内容入口。无需强迫自己接受“主界面必须始终呈现重要导航结构”的思路 ，导航本身完全可以拥有 属于自己的独立容器。 将视野放大 ，想象出当前界面所处的2D或3D大环境 ，然后考虑独立的导航容器可以被放置在这个 环境空间中的什么位置上——与主界面左右或上下相邻 ？还是在主界面的“前面”或“后面”通常 ，一个 简单的拖拽或横扫的手势就可以让这样的导航容器呈现出来。不管怎样 ，这些都可以由你根据实际 的产品情况来设计和定义。 举个栗子 ，我很喜欢Faceboo k与Gmail应用当中的侧滑菜单 ，非常好用。平时这些菜单是隐藏的 ， 你在界面上向右滑动就可以使其向右延展开来 ；这种模式不仅使界面在普通状态时更干净 ，内容展 示空间更大 ，而且要访问菜单时也只需通过很简单的手势操作便可实现 ，滑动手势本身也无需精确 定位在屏幕上的某个位置。 除了导航以外 ，你也可以通过这种思路呈现那些与当前内容相关的上下文功能。显然 ，在每个 内容条目中都塞进两三个按钮是非常讨厌的事 ；按钮看上去固然是很明确的可点击元素 ，但手势在 交互效率和趣味性方面则更胜一筹 ，你完全可以考虑通过简单的点击、双击或长按来呈现更多针对 当前内容的功能。例如在Inst agram中 ，用户可以通过双击来完成“赞”或“取消赞”的操作。 一个界面适用于多个情境 在设计一款非常具有创新色彩的移动应用时 ，很难准确的事先预测用户的行为。与比利时广播电台 合作期间 ，我们的团队在可视化音乐播放与即时新闻呈现之间的界面平衡性方面着实纠结了很久 ， 因为有太多的上下文情境及参数需要考虑 ，所以很难达成一个在各方面都很完美的设计方案。于是 我们决定 ，允许用户通过一些简单的手势操作来根据自己的需要自由调整界面的平衡。 这种方式为应用增加了一个具有创意色彩的“情境维度” ，拖拽手势的运用使音乐与新闻并没有成 为互不相关的独立区域 ，用户可以随时根据自己关注点的变化在两者之间进行调整 ，并且不会使任 何一类内容完全脱离上下文环境。 时间、维度与动画效