苹果iPhone用户界面设计经验分享.doc

苹果iPhone用户界面设计经验分享 苹果iPhone用户界面设计经验分享 苹果的iPhone、iPod touch以及iPad等产品为我们带来了许多意想不到的创意和惊喜。认真地咀嚼130页《iPhone Human Interface Guidelines》后，能感悟到字里行间透露着的苹果的细致与智慧。我们收集了iPhone平台的专业设计师的意见，加上翻译过程的一点体会，整理出一些苹果iPhone用户界面设计精粹。希望对大家有所帮助。 一、了解应用类型及各自特点 iPhone平台有三类型的应用: ? 效率型应用(Productivity Applications) ? 实用工具(Utility Applications) ? 沉浸型应用(Immersive Applications) 每一种都有各自不同的特点和应用场合。设计之前如果能够清楚产品的目标和特点，选择合适的应用类型可以更好地迎对。 效率型应用用于帮助完成日常的一些工作，如收发邮件、即时通信、照片管理与分享。用户快速查看、跳转、执行、完成，连贯的动作要求界面简单直接，让用户可以全神贯注于任务本身。这类应用一般都附带自然的层级结构。所以，表格视图(table view)可以在这类软件里大派用场。 图1.1 附带层级结构的效率型应用 实用工具用于执行一项简单的任务(如计算器，天气报告)，简单，容易配置就可以了。 图1.2 实用工具之“天气报告”和“深度睡眠” 沉浸型应用可以为用户带来极致的娱乐和游戏体验，这类应用可以进一步细分为游戏和虚拟仿真类。这类应用和标准的系统界面不同，用户希望这类应用能够给他们带来最大的娱乐，因此，界面设计的自由发挥度比较高，仿真的、可爱的设计风格往往能恰到好处。 图1.3 沉浸型应用 二、熟悉系统布局和控件特点 iPhone 操作系统提供了非常出色的UI库，这些标准的控件和视图都得到了大量的研究才得以真正派上用场。另一方面，iPhone 用户已经对这些软件非常熟悉，不管是出于什么理由，如果没有更好更实用的创意，我们应该遵循iPhone的控件规范。至少，在我们打破iPhone的规则之前，“You must understand the rules before you can break them.”(你必须了解规则然后才能打破他们)。 iPhone 提供的UI组件从大到小，大致可列举如下(具体每种控件和视图的细节，请参考《iPhone 用户界面设计指南》第二部分): ? 导航条，标签条，工具条和状态条 ? 弹出对话框、操作面板和模式视图 ? 表格视图(Table Views), 文本视图(Text Views), web视图(Web Views) ? 应用程序控件(如文本框、分页显示器、轮转选择器、进度条、更多按钮等) 三、使用隐喻 隐喻为界面视觉提示和功能建立了直观的逻辑联系。将软件中涉及的元素和操作与真实世界关联起来能够更好地帮助用户理解。 iPhone ? 减少输入:尽可能地减少输入，直接为用户提供选项。如索引列表，既方便用户记忆，也可以帮助用户快速扫描并直接选中;轮转选择器，划上划下即可选中，减少打字耗时的同时省去繁多的错误检测。 ? 避免不必要的交互:用户也不是你想像中那么傻的，不要一味提醒他们如何操作(帮助越多说明你的软件越难用)，设计时应该关注如何更有效地引导用户集中精力快速完成任务。 内置的短信发送实在是太经典了，写信人和收信人左右区分，信息内容通过时间顺序排列下来，整个信息来回历史一目了然。呼叫程序同样出色，重新设计的数字键盘弱化了字母排列，突出数字，由此换来宽大容易点击的屏幕空间。 图4.1 一目了然的短信历史查看和拨号呼叫 五、考虑屏幕上下 不论单手操作还是两只手配合操作，屏幕上部分的可见性是最好的。所以，在设计应用程序时，应该将最常使用的的信息——一般是高度概括的信息，如导航，或者一些常规操作如添加、完成、保存、取消——置于屏幕顶端。 屏幕的底部一般是辅助性的工具栏或切换视图使用的页签栏。一些影响较大的操作如果出 现在屏幕下半区域，必须仔细考虑它们的排列设计。如图5.1，一般情况下，操作面板的取消按钮放在最后，这样可以鼓励用户阅读完所有的选项，暗蓝色的返回按钮可以和一般的按钮区分开来，即便用户没阅读完也知道这是返回按钮。对于一些影响较大的操作(如删除)，将其放在面板的顶部是最好的，因为顶部更容易被看到，再加上红色的警告暗示，用户选择起来会更为慎重。 图5.1 操作面板上的按钮排列 六、提供指尖大小的点击区域 如果按键布局过于拥挤，用户就要小心翼翼地花更多时间去操作，错误也会紧接而来。简洁易用的界面空间必须合理地控制按钮布局和交互元素，让用户更快更容易点击。 旧