iPad应用设计实践(下篇)

为应用提供主页

人们已经习惯了主页的存在,因为它们能很快地让用户了解这个App能够做什么,并且能够为用户提供一些基础性的操作。如果没有主页,用户查找和浏览内容时就会变得十分困惑。拿这款NASA资讯应用来说,它就没有主页。当启动这个应用之后,用户就会被直接导向一片资讯文章。如果想看其它的文章,他们得使用左侧和右侧指示循环显示文章的箭头,或者去点击屏幕底部左侧的角落的一个很小的列表按钮。列表视图允许用户通过一个很小的可滚动的临时窗口来浏览内容,它的空间仅仅够容纳文章的缩略图和简短标题。可以看出这样的导航总体上来讲很笨拙很容易使人困惑。

num6_a

NASA没有提供主页,而是直接将用户导向文章,但是它利用弹出式面板为用户提供了导航操作

Pulse是一款设计优秀的资讯应用,它运用了主页为用户介绍了整体的导航结构,这使得用户能够在整个App中快速导航。通过应用的主页面,用户能够很容易地浏览内容,拥有大量的空间来观看较大的缩略图和较为详尽的文章描述,从而发现他们的兴趣所在。当点击进入一篇文章后,导航就会自动隐藏到侧边栏,这样用户不会错过文章的某些内容。

num6_b

Pulse在主页面上显示出了可水平滚动的文章列表

num6_c1

在详细页面下,Pulse在底部提供了文章资源的导航,能够让用户很方便地进入下一篇文章

正确使用弹出式操作面板

iPad提供了一种很有意思的弹出式操作面板交互来帮助用户进行内容检索以及在内容之中进行导航。但如果在小面板中塞满过多的内容,那么就很容易导致不稳定的工作流程。因此,要限定面板的宽度和高度,且避免向里面填充太多的信息。Awesome Note应用运用了这种交互方式,但似乎他们并未学习到其中的真谛。大概是为了协调内容界面,它利用弹出式操作面板,将一些列文件夹的编辑操作隐藏到了一个小按钮中。但操作起来,我却困惑了,一方面它将左侧的文件夹又重新复制了一遍,另一方面又没给用户留下足够的操作空间。

aNote

Awesome Note拥有一个很令人困惑的弹窗面板,在很狭窄的空间内复制了屏幕信息

我们在之前讨论过的NASA应用的复杂的导航,其实弹出面板使用不当的一个例子。

你或许可以考虑一下,往往打开一个新页面要比打开弹出面板可用性更高。除非当前内容至关重要,否则你就不必害怕让用户去新页面进行全屏操作,弹出面板的使用切记不要牺牲内容页中呼吸的空间。

或者考虑巧妙地使用分列视窗。

num7_b1

Houzz应用在一个分列视窗中展示出了每一类的二级导航

num7_c

Martha Stewart Living应用通过使用一个全长的弹出面板来呈现内容列表,其中包括了图片和标题描述

num7_d1

Flipboard的滑出面板为其导航操作提供了充足的空间

避免无意义的启动画面

可以想一下,当某个网站有启动画面的时,是不是会有很多人感到恼怒甚至匆匆离开?启动画面如果在iPad上出现那会更容易惹恼缺乏耐心的用户。因为有很多时候,当你你在尽力查找想要的内容的时,可能会有其他人焦急地等着你或者等着使用iPad,这种情况下用户的耐心会比在电脑上更有限。如果你真的需要一个启动画面,因为有些东西不得不需要加载,那就把它缩短到最短的时间。最好的是,当应用加载的时候为用户提供一些有用的信息来让用户与应用的交互开个头儿。

Zite应用就很善于通过启动画面来增强用户的兴趣,当启动时,它会迅速地加载主页上的一小部分文章图片,剩下的时间用来加载其余的内容。当App准备就绪,这些起初加载的图片会生动地恢复到主界面的位置,由此制造了一种令人愉悦的且略带欢迎气氛的交互内容。

num81

Zite的启动画面能够很好的吸引住你,因为它利用加载全部内容的时间提供了少量的文章缩略图

注意巧妙使用必要的手势交互,但也不能滥用。

手势交互用起来很酷,而且这是iPad最吸引人的地方。但是要记住,巧妙的手势和滥用的手势之间的界限并不那么明显。举个例子,如果你允许了用户通过手指擦动屏幕来查看循环展示的内容,那你就不要在同一个屏幕上再去添加具有其它操作涵义的擦动手势交互,因为同种手势完成不同的操作会使得App的交互变得相互矛盾。

如果一个手势交互不是很明显,务必要给用户一些暗示。

Discovr是一款音乐搜索应用,恰当地将暗示手势控制的信息整合到了它的UI里面。屏幕截图上的红色圈圈下面写着“请点击我”,从而引导用去展开节点。

num9_c

Discovr在当前屏幕下通过红色的点来教育用户该如何使用手势操作

num9_d

一旦提供了基本信息,另外一个红色标记就会出现一句生动的话,“长按我”,从而提示用户如何通过新的手势来获取更多的内容。将这些提示信息和App本身的体验结合起来,用户就能够很轻松的学习到App界面的强大特征了

要清楚地显示什么可点击,并且把它放大

尽管很多的App中字体尺寸让人看起来很清晰,但这也不能让它们摆脱Jakob Nielsen所言的“阅读-点击失衡”的窘境。在某些App中,可点击区域是如此的小以至于用户很容易错失目标或者甚至都不能确定它是否可点击。看一下下面的广告,它来自Martha Stewart Living应用,屏幕中间那一系列的问题是可以点击的,但是你不会知道,因为它们没有任何提示。如果你试图修改这个设计以便让用户获取更多内容,那么你就必须让用户清楚地知道哪里可以点击,同时清晰地放大可点击区域。

num10_a1

用户很难知道点击广告的那里才能获取更多的内容

 

num10_b1

原来才知道你可以点击上图中部显示的灰色盒子区域来获取信息

Cool Hunting应用上方的图片区域,实际上是可以向右滑动的,但是我们一点也意识不到这些。那这里该如何引导用户滑动图片呢?其实不难,比如添加多张图片的透视延伸,或露出下张图片的一小部分,让用户知道右边原来还有更多的图片。

num10_c1

Cool Hunting没有向用户暗示拖动顶部的图片能够展现更多的图片,这项功能让人很难发现

对于iOS本身来说,双击Home键会出现多任务控制栏,然后用手向左滑动它,会出现一些控制声音和音乐的操作,但是这些功能都被深深地隐藏了,为什么不做一些暗示来引导用户去使用它们呢?

num10_d1

双击Home键,然后向左拖动,就会发现iPad隐藏的功能。

 

本文译自:《Ten Things To Think About When Designing Your iPad App

 

 

 

 

发表评论

电子邮件地址不会被公开。

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

使用新浪微博登陆