iPhone应用程序设计范例

2010-02-06 1:01

iPhone apps

引言

iPhone对应用程序(app)制定了3个标准的模板:导航控制器页签控制器模态视图与表视图控制器。文章介绍了这3个标准模板,它们拥有各自的优缺点。对每个标准模板列举了3个不同的应用例子。在面对不同信息的结构,无法完全使用这3个标准模板去规范所有产品特性。而目前有一些产品已经超越了标准模板的体验,创造了更多好的体验的方法。

原文: iPhone Application UI Design Patterns

前言

在iphone平台开发有很大的限制-没有实体键盘屏幕小几乎没有物理按键-这样的设计是为了在iPhone上可以开发智能、简单的应用程序。 在iPhone上,你不会找到很多臃肿、复杂的应用程序。大多数应用程序会选择一个功能或相关的功能组,围绕并集中一个主题去设计产品。

当apple开始制定UIKit,iPhone的每个应用程序会使用API集来构建用户界面,他们必须看到未来和预测到什么应用程序的设计模型是最 常见的,并确保那些可以很容易完成。这似乎是显而易见的,现在我们习惯了iPhone应用程序的设计,高级导航的交互方式也完整地提供给iPhone应用 程序的开发人员:

·进入更深层级的时候,也可以很轻松回到顶层

·在不同功能切换时不失去当前位置

·修改和调整内容时,不会离开上下文情境

·显示信息列表或选择器

这里几个主要的交互特征相当于3种不同类型的界面模板:

·导航控制器

·页签控制器

·模态视图与表视图控制器

突出主要功能的特征

突出显示你的应用程序中可用功能的列表,以便用户可以清晰浏览您的应用程序。不过,考虑到有各种各样的方式来组织显示应用中的信息,那么哪一种方法最好?从哪里切入来突出应用程序的特征?
没有最好的,但下面有一些已被实践成功的的模式供你参考:

导航控制器—Things ,iStat ,Birdfeed

Things
Things

iStat
iStat

Birdfeed
Birdfeed

导航控制器这三个应用程序都具有多层级的功能,每个层级的功能很多,超过一屏功能导航会落在第二屏,通过控制上下滚屏查看所有功能。采用了层级列表,每个层级为一个列表,点击一个列表项进入第二个层级并会显示另外一个列表。

优势:主要应用于层级信息结构简单的列表。作为服务订购以及分组中蕴含其他功能等。
缺点:没有办法从进入的列表第一项中直接转到列表第二项,只能返回首页再选择列表第二项。

页签控制器—Squirrel,Tags, Tweetie

Squirrel
Squirrel

Tags
Tags

Tweetie
Tweetie

页签控制器这三个应用程序功能使用了页签控制器。通常在使用页签栏位置,每个页签将显示一个功能,而这个功能下有一个完整的功能组合。若弹出一个特殊的功能界面时,会隐藏页签栏,获得更多屏幕空间。

优势:点击页签可以在功能之间进行切换。同时还可以突出页签的层次,表现出“当前位置”。
缺点:在5个页签以内是没有问题的。当超过5个的时候,第5个页签会将其他页签收起,显示为“更多”,并且无法在界面上突出页签的层次,并且弹出特殊的功能界面则会隐藏了主要的页签栏。

模态视图—ESPN ScoreCenter, Phases ,Weathe

ESPN ScoreCenter
ESPN ScoreCenter

Phases
Phases

Weathe
Weathe

模态视图这三个应用程序采用模态视图的观点是,他们彼此的功能是一组的。使用这种设计模式的通常是信息量丰富,查看信息不用花太多时间。

优势:表现自然且容易理解,能快速显示丰富的信息。
缺点:只有一个层级结构。若从页卡1切换到达页卡4需要多次平移操作,它们之间不能直接平移超过1页卡。




遵循基础模式还是打破限制?

Apple提供了应用设计模板和范例,他们为良好的交互行为体验定制了标准的UIKit。
如果你想超越这个模板,打破限制,这会不会有问题?你已经有一个完全自定义的新模式?

以下是一些拥有良好交互行为的自定义新模式:

Weightbot,Convertbot
可以说为iPhone提供了独一无二的良好交互行为,完美的触觉体验。
Weightbot 使用水平滚动轮控制器
Weightbot
Convertbot 有机械选择拨号控制器
Convertbot

beats
Bjango 创造了Betas,是一个节拍和节奏配对的DJ和音乐应用程序。他有很多自定义的创新元素,主要内容展现在页签栏下面。

beats beats

Postage
RogueSheep创造了Postage,是apple设计奖得主。

Postage Postage

选择哪个效果最好
?

选择APPLE的原生UI元素与模式是没错的。apple创建了一个坚实可靠的基础,对应用开发提供良好的交互行为模板,但有些应用并不适用这些模板,使他们会考虑重新设计这些互动的方法。这是一个很好的想法,但需要谨慎,会很容易走向极端并且搞得一塌糊涂。

一个衷心的建议:如果你不能比Apple设计的更好,就不要胡乱去改!

本文翻译、附加描述(原文  iPhone Application UI Design Patterns),文章内容有修改和整理。

评论……

  1. 狐狸 2010-02-08 21:21

    呵呵,路过,顶一下。

  2. Kayla 2011-05-17 19:19

    Good post! I have a random question for you. How do you get your blog indexed by bing? I have a related web blog.

发评论

必填

必填 电子邮件地址,不对外公布

人仔

1985.9

从事互联网设计工作

订阅

微博

Google的朋友们