iOS人机界面指导手册.pdf

1/129 iOS Human Interface Guidelines iOS Human Interface Guidelines 2/129 目录 目录 第 1 章 简介.6 要旨概览：.6 伟大的 iOS 程序应遵守平台和交互设计原则.6 伟大的程序起源于简明的定义.6 伟大的用户体验来源于关注细节.7 用户期待能在程序中使用苹果的技术.7 所有的程序都需要进行部分定制.7 第 2 章 平台特点.8 无论尺寸如何，屏幕都是最重要的.8 屏幕的方向是会变的.8 程序响应手势，而非点击.9 每次只在使用一个程序.10 可以在“设置”中修改偏好.11 屏幕上“帮助”的效果有限.11 一个程序只有一个窗口.11 有两类程序运行在 iOS 上.11 Safari 提供网页界面.12 第 3 章 人机界面设计原则.14 美（Aesthetic Integrity）.14 一致性.14 直接控制.15 反馈.15 暗喻.15 用户控制.16 第 4 章 程序设计策略.17 明确程序定义.17 1 列举所有你觉得用户会喜欢的功能点.17 2 确定你的目标用户.18 3 通过对目标用户的定义筛选功能点.18 4 不要就此停下.18 为设备而设计.19 拥抱 iOS 界面规范.19 确保程序在 iPad 和 iPhone 上通用.19 重新考虑基于 web 的设计.20 为任务量身定做界面.20 原型和重述.23 第 5 章 案例分析：移植到 iOS.24 从电脑上的 Mail 到 iPhone 上的 Mail.24 从电脑版 Keynote 到 iPad 版.25 从 iPhone 版 Mail 到 iPad 版.28 从电脑版 Safari 到 iPad 版.32 第 6 章 用户体验指南.38 3/129 关注主任务.38 提升用户关注内容的权重.38 自上而下思考.39 让用户有逻辑可循.39 使用方法明显、易用.39 使用以用户为中心的术语.40 减少对用户输入的需求.41 不要重视管理文件的操作.41 容许协作和联通.42 弱化设置.42 品牌宣传要适当.43 搜索要反应迅速、结果丰硕.44 要在 App Store 提供精炼的描述.45 精炼.45 界面元素要一致.45 考虑增加真实感.46 用绝佳的图片取悦用户.47 处理好改变方向.48 让目标符合手指的尺寸.50 使用微妙的动画表达.50 恰当地支持手势.51 只在必要的时候要求用户存储.52 让模态化任务表现地暂时且简单.52 立即启动.53 随时准备停止.54 不要自动退出.54 有必要的话，展示许可证或者免责声明.54 适用于 iPad：增强交互性（别只增加功能点）.54 适用于 iPad：减少全屏转场.55 适用于 iPad：抑制你的信息层级.55 适用于 iPad：考虑将浮出层用于不同模态的任务.58 适用于 iPad：考虑将浮出层用于不同模态的任务.59 第 7 章 iOS 技术使用指南.60 多任务.60 打印.61 iAd 富媒体广告.63 快速文件预览.65 声音.66 理解用户的期望.66 定义声音的行为.67 管理声音冲突.71 处理远程媒体控制事件.72 VioceOver 和附件.72 编辑菜单.73 4/129 撤销和重做.75 键盘和输入视图.75 位置服务.76 本地和推送提醒.77 第 8 章 iOS 界面元素使用指南.80 栏.80 状态栏.80 导航栏.81 工具栏.83 Tab 栏.84 内容视图（Content Views）.85 浮出层（只限 iPad）.85 分栏视图（只限 iPad）.87 表格视图.89 文本视图.95 Web 视图.96 警告框、操作列表和模态视图.97 警告框.97 操作列表.100 模态视图.102 控件.104 活动指示器.104 日期和时间拾取器.104 详情展开按钮.105 信息按钮.106 标签.106 网络活动指示器.107 页码指示器.107 拾取器.107 进度指示器.108 圆角矩形按钮.109 范围栏（Scope Bar）.109 搜索栏.110 分段控件.111 滚动条（Slider）.111 切换器（Switch）.112 文本框（Text Field）.112 系统提供的按钮和图标.113 工具栏和导航栏中使用的标准按钮.113 Tab 栏中使用的标准按钮.116 表格等其他界面元素中使用的标准按钮.117 第 9 章 定制图标和图片指南.117 程序图标.118 小图标.120 5/129 文档图标.120 为 iPhone 制作文档图标.121 为 iPad 制作文档图标.122 Web 快捷方式图标.124 导航栏、工具栏和 tab 栏上用的图标.125 登录图片.126 为 Retina 屏幕设计画作的技巧.128 第第1 1章章 简介简介 要旨概览：要旨概览：伟大的伟大的 iOSiOS 程序程序应应遵守遵守平台和交互设计原则平台和交互设计原则 用户钟爱那些专门为移动设备设计的 iOS 程序。例如，用户非常希望程序能够与设备屏幕相衬，并且能够响应那些用户熟识的手势。虽然用户可能不知道人机交互设计原则，诸如“直接操控”“一致性”，但却能觉察的出遵守原则和违背原则的程序之间的差别。当你开始设计 iOS 程序时，一定要意识到是什么让 iOS 设备如此独特，并且学会使用交互设计原则，以便用户能爱上你的程序。相关章节:“平台特点”和“人机界面设计原则”伟大的伟大的程序程序起源于简明的定义起源于简明的定义 当有了设计程序的想法后，你必须精确地定义该程序包含哪些特性，目标用户是谁。决定之后，你需要确保该程序的外观和给人的感觉与设备和功能相匹配。如果你想移植现有的程序到 iOS，需面对的挑战也大同小异。当你为 iOS 重新设计软件 是，从“Mail”“Keynote”等成功的程序上借鉴一些设计中的决策会很有帮助。相关章节:“程序设计策略”和“案例分析:移植到 iOS”伟大的用户体验来源于关注细节伟大的用户体验来源于关注细节 当设计程序的各个方面时，从如何完成任务，到程序如何启动和关闭，再到如何使用按钮，“用户体验”必须是至高无上的。该指南会从宏观和微观上为你提供参考。相关章节:“用户体验指南”和“iOS 界面元素使用指南”用户用户期待能在期待能在程序程序中使用苹果的技术中使用苹果的技术 iOS 提供了很多很棒的技术，诸如多任务、打印、VoiceOver。当用户使用 iOS 设备时，他们认为这些技术是默认就可用的，但这需要你在制作程序时提供支持。如果某种技术适用于你的程序，一定要遵循与其相关的指南。相关章节:“iOS 技术使用指南”所有的所有的程序程序都需要进行部分定制都需要进行部分定制 如果你的程序致力于提供严肃的、用于产生内容的功能，且只包含一些标准控件，那么你还需要提供一个在 App Store 和 Home Screens 上都看起来很棒的图标。当你的程序或多或少地包含一些定制皮肤时，你需要清晰地知道应包含哪些图标或图片，以及如何绘制它们。另外，如果你是为 Retina 液晶屏设计图片，就还需要学一些能让这一过程轻松点的技术。相关章节:“定制图标和图片指南”第第2 2章章 平台特点平台特点 使用 iOS 的设备拥有一些共性，这些特点会影响其程序的使用体验。与这些特性相适应的程序会更加成功，与设备一起为用户提供超凡的使用体验。无论尺寸如何，屏幕都是最重要的无论尺寸如何，屏幕都是最重要的 iOS 设备的屏幕是用户体验的核心。用户不仅在上面浏览优美的文字、图片和视频，还要和多点触摸屏进行交互（即使有时候用户甚至看不到屏幕）。虽然不同的尺寸和分辨率对程序的用户体验有不同的影响，但有一些原则是通用的。可点击元素的最小尺寸是 4444 点 图片质量的影响显而易见 用户最关注的是内容 注：像素适用于谈论设备屏幕的尺寸，或在编辑素材的程序中定义图标的大小。点则用来描述一块区域在屏幕上会显示多大。屏幕的方向是会变的屏幕的方向是会变的 用户可能在任何时间由于多种原因旋转屏幕。例如，有时用户觉得当前的任务将屏幕竖起来更自然，有时用户觉得横过来放置能看到更多内容。无论原因怎样，用户希望旋转后屏幕依然重点显示此程序的主功能区。用户经常在桌面上打开程序，所以他们期望程序以与桌面相同的方向打开。由于 iPhone和 Ipad 在展示“Home screen”时的差异，这种期望也有所不同。在 Iphone 和 Itouch 上，桌面只会以竖直的方向展示，Home 键在底部。这使得用户期待程序也以这个角度打开。在 Ipad 上，Home screen 可以以任何角度展示。所以用户会期望程序以与桌面相同的方向打开。程序响应手势，而非点击程序响应手势，而非点击 用户使用特定的手指运动，我们称之为手势，来操作 iOS 设备的多点触摸界面。例如，轻敲可以激活按钮，拖动可以滚动长表单，两指分开可以放大图像。多点触摸界面给用户一种与设备直连，直接操纵屏幕上物体的感觉。由于内置程序对手势的使用遵从标准原则，所以用户在使用标准手势的时候更加舒适。使用内置程序的经历帮助用户学会了适用于大多数程序的手势词典。iPhone 和 iPad 都支持多点手势。虽然较大的屏幕也给了更多手指触摸的空间，但这并不意味着多点手势总是最佳选择。每次只在使用一个每次只在使用一个程序程序 屏幕一次只能展示一个程序，当用户切换程序时，前一个程序会退出，其界面也随之消失。在 iOS4 之前，退出程序意味着其在内存中的数据即刻被清空。而在 iOS4 之后，退出的程序会隐藏到后台，等待再次被调用的机会。这种特性被称为“多任务”，可以将程序保留在后台，直到被再次调用或终结。大多数程序在转移到后台的时候，会被挂起。被挂起的程序会展示在“多任务选择器（multitasking UI）”中，这帮助用户快速找到近期使用的程序。多任务选择器会出现在屏幕底部，位于当前运行的程序界面或 Home screen 的下侧。当用户重启挂起的程序时，它能够从退出时所在的那个点迅速恢复，无需重新渲染界面。用户会偏爱在运行其他程序时把某些程序保持在后台。例如，用户在看电影时又突然想去查看日程表、邮件时，会希望能快速继续中断的播放。可以在“可以在“SettingSetting”中修改偏好”中修改偏好 用户需在 iOS 的“Setting”中修改偏好。但若想修改偏好，他们必须退出当前的应用。偏好往往在设定后很少会改变。虽然有些程序自己内置了“设置”，当并不意味着所有的应用都需要。屏幕上“帮助”的效果有限屏幕上“帮助”的效果有限 在体验一个程序前，移动设备用户不会去读一大段帮助，既没有时间也没这个欲望。而且，帮助内容会占用宝贵的空间来显示和存储。基于 iOS 的设备和内置的应用都很符合直觉，易于使用。所以用户并不需要屏幕上展示帮助。这种经验驱使用户期待所有的 iOS 应用都是这些易用。一个程序只有一个窗口一个程序只有一个窗口 无论什么样的程序，都只有一个窗口。这个窗口用于放置程序的内容和功能。但是用户不会意识到这个窗口。在 iOS 设备中，用户觉得程序就是依次呈现的一屏又一屏图像（a collection of screens）。你可以把一屏图像想象成一个离散的视觉状态或者模态。一个程序拥有的屏数或多或少，每一屏都是各种素材和控件的组合（various combinations of views and controls）。用户会觉得程序的屏与设备的屏没什么区别，但是程序的屏却可以远远超过设备屏幕的限制。例如，在 iPhone 的“联系人”中，联系人列表只展示了一屏，即使列表的实际长度足够填满好多屏。有两类程序运行在有两类程序运行在 iOSiOS 上上 基于实现的方式，可将 iOS 上的软件分为两类：iOS 程序 web 内容 iOS 程序是用 iOS SDK 编制的，可以直接运行与 iOS 设备上。就像内置的程序一样，这些 iOS 程序驻留在设备上，可以调用 iOS 设备的资源。用户将这些程序安装在设备上，就像“Photos，Calender，Mail”等内置程序一样使用它们。用户可以通过 iOS 设备访问网页时可以浏览 web 内容。Web 内容可以分为三类。Web 应用 Web 应用是指那些能用于完成某种任务并且遵从某种展示标准的网页。它们的表现形式和 iOS 程序类似。网页有时候会把 safari 工具栏隐藏，这样看起来更像是本地程序。使用 web clip 功能的网页还可以在桌面上建立图标。这样用户就能像运行程序一样打开这些 web 应用。优化过的网页 优化后网页会更适合 iOS 设备的显示和操作。而且，优化后的网页能为 iOS 显示设备进行适当的缩放，并且检测用户是通过什么样的设备浏览，以便对展示的内容进行调节。兼容的网页 有些网页与 safari 和 iOS 设备的显示和操作兼容。兼容的网页不会为了使用 iOS 设备做更多的优化，但往往 safari 对这些网页的显示也是合适的。有些应用会将部分区域划拨出来，用于展示 web 内容。这种程序看起来像是本地应用，但其实依赖于网络信息源。SafariSafari 提供网页界面提供网页界面 iOS 上的 Safari 提供了浏览网页的界面。虽然 iOS 上的 Safari 与电脑上的 Safari 有很多相似之处，但也有很多差异值得注意。最明显的差异是用户无法改变可视范围（viewport，或译作观察口、视口、视埠）。在电脑上，当用户改变浏览器窗口大小时，可视范围的尺寸也会改变。而在 iOS 上，除非设备的方向旋转了，可视范围才会改变尺寸。iOS 用户可以通过缩放来改变 viewport的显示范围。iPad 用户缩放网页的需求会比 iPhone 用户少。iOS 上的 Safari 支持 cookies。Cookies 可以通过保存用户的环境（context）、偏好以及曾输入的数据让用户和网页内容的交互更加流畅。iOS 上的 Safari 不支持 Flash 和 Java,或者其他第三方插件。作为弥补，Safari 支持HTML5 的和标记，用以播放音频和视频的流媒体。此外还有 JavaScript和 CSS3 的变形，透明和运动效果，用以展示动态内容。iOS 上的 Safari 将手势解释为对“如何展示内容”的操控，而非对内容本身。轻敲可以触发 Sagari 给网页发送一个 onclick 事件，这与鼠标单击相似。但是很多鼠标动作没有相匹配的姿势，比如说 hover。iOS 上的 Safari 容许网络应用以全屏模式运行。网络应用可以通过“Web Clip”的图标来登录，这样能隐藏 Safari 的界面控件，看起来就更像是一个本地的应用。第第3 3章章 人机界面设计原则人机界面设计原则 伟大的用户界面会遵从用户界面设计原则，这些原则基于用户思考和工作的方式，而非基于设备的能力。一个费解的、逻辑混乱的、不诱人的界面会让原本很伟大的程序变成一团浆糊。但是一个优美的、符合直觉的界面能够与程序的功能相辅相成，给用户留下良好的印象。美（美（Aesthetic IntegrityAesthetic Integrity）美不是一个衡量程序好不好看，而是程序的外观和与其功能是否相衬。比如说，一个用来产生内容的程序（译者按：比如 word、ppt）往往把它的装饰性元素处理得很低调，并通过使用标准的控件和动作来突显任务。这可以帮助用户获得有关该程序目的和特性的信息。反过来讲，如果这个程序采用了某种鬼灵精怪的界面风格，用户就会陷入冲突的迷雾。类似地，在那些娱乐性应用的界面上，用户期待界面能够非常漂亮，充满探索趣味。虽然用户不希望在游戏中完成严谨的任务，他们仍然期待游戏的外观可以与体验一致。一致性一致性 界面一致性能够让人们沿用以往学会的知识和技能。保持一致性不是说要盲目地抄袭其他程序。相反，它应当利用那些用户已经熟识的标准和范式。为了鉴别一个程序是否遵从一致性原则，可以思考如下问题：该程序是否与 iOS 的标准一致？它是否正确地使用了系统提供的控件，外观和图标？它是否将程序与设备的特性有机地结合在一起？该程序是否保持了充分的内部一致性？文案是否使用了统一的术语和样式？同一个图标是否始终代表一种含义？用户是否能预测他在不能地方进行同一种操作的结果？定制的 UI 组件的外观和行为在程序内部是否表现一致？该程序是否与以往诸多版本保持一致？术语和意义是否保持一样？核心的概念没有发生本质变化？直接控制直接控制 当用户直接控制屏幕上的物体，而非通过各种控件时，他们会更深地沉浸在任务中，也更清楚地理解他们行为的结果。iOS 用户很享受在多点触摸屏上直接控制的感觉。手势使得用户对屏幕上的物体拥有更强的操纵感。因为他们可以不再通过鼠标等中介设备控制物体。例如，用户可以用手指姿势直接缩放一块内容区域，而非通过放大缩小按钮。在一个游戏中，玩家可以直接移动或操纵物体。再例如，游戏里会出现一只锁，用户可以旋转钥匙来打开它。在 iOS 程序中，用户可以在如下场景体验直接控制 旋转或用其他方式移动设备，以影响屏幕上的物体。使用手势操纵屏幕上的物体。看到他们的动作有直接的、可见的结果。反馈反馈 反馈告知用户他们的行为有何结果，使用户确信程序正在运行中。人们操纵控件时期待即刻的反馈，也期待在较长的流程中能提供状态提示。内置的程序会为用户的每一个动作提供可觉察的反馈。例如，当用户点击列表项时，该项的背景会变成高光。在那些会持续很多秒的长流程里，一个控件会展示已完成的进度，并在可能的时候提供解释信息。顺滑的动画会给用户提供有意义的反馈，帮助用户了解动作的结果。例如，列表在添加新项时会向下滚动，帮助用户发现这个显著的变化。声音同样能为用户提供有用的反馈，但是它不应是唯一的或主要的反馈方式。因为用户的使用场景可能会迫使他们关掉声音。暗喻暗喻 当虚拟的物体和动作是真实世界中物体和动作的暗喻时，用户会立刻明白该如何使用这个程序。经典的例子是文件夹：在真实世界里，用户将东西放在文件夹里，所以他们立刻明白电脑上可以把文件放在文件夹里。合适的暗喻应该即暗示了使用方法，又避免与它模仿的现实世界里的物体和动作面临同样的限制。例如，用户需要放海量的东西才能把文件夹塞满，而这在现实世界里是不可能的。iOS 为暗喻提供了充足的空间，因为它支持丰富的动作和图片。用户与屏幕上的物体进行交互，就像在现实世界中操纵同样的物体一样。iOS 系统中的暗喻包括：轻触 iPod 的播放按钮 在游戏中拖拉，轻拂或水平滑动物体 滑动切换开关 轻拂（Flicking over）一叠照片 旋转拾取器的拨轮，做出选择（Spinning picker wheels to make choices）一般而言，暗喻在没有做过多引申时效果会比较好。例如，如果在操作系统里文件夹必须放在书柜里，它就用起来没那么灵光了。用户控制用户控制 应该由用户出发和控制操作，而非程序。虽然程序可以建议某种流程、操作，也可以警示危险的结果，但抛开用户由程序来做决策未免太过荒诞。优秀的程序能够平衡用户的操作权并帮助用户避免犯错。用户在控件和行为都很熟悉、可以预测结果的时候最有操控感。而且，当动作非常简单直白时，用户可以很容易地理解并记住它。用户希望在进程开始执行前有足够的机会取消它。而且他们希望能在执行破坏性动作前有再次确认的机会。最后，用户希望能优雅地终止运行中的进程。第第4 4章章 程序设计策略程序设计策略 所以伟大的程序都起源于一个伟大的想法。但这不意味着将想法孕育成成功的程序是件轻松的事。这一章将介绍一些能用于精炼想法、回顾设计选择（design options）的策略，帮助你设计出人见人爱的程序。明确明确程序定义程序定义 定义程序是指简明地描述程序要达成的主要目的和目标用户。在开发早期就完成对程序的定义，能够帮你将一堆想法和属性凝聚一个成用户梦寐以求的产品。在开发过程中，可以以该定义为标准判断潜在的功能点和行为是否靠谱。创建程序定义可以通过以下步骤来完成：1 1 列举所有你觉得用户会喜欢的功能点列举所有你觉得用户会喜欢的功能点 可以使用头脑风暴。此时你应该找出所有与产品创意相关的任务。不用担心单子列的太长，待会儿还要再做精简。例如，想象你最初的想法是做一个帮用户采购食物的程序。想象一下，脑袋里就会出现一系列用户感兴趣的任务。例如：创建购物清单 获取食谱 比较价格 寻找商店位置 标注食谱 获得和使用优惠券 浏览烹饪教程 探索不同的烹饪方法 查找可替代的食材 2 2 确定你的目标用户确定你的目标用户 你的用户除了在使用移动设备，期待精致的图片，简洁的交互方式，出色的表现以外，还具备什么样的特性呢？以食材采购为例，你可以判断下列描述是否适合你的用户：经常在家做饭 or 偏爱准备好的餐饮 喜欢使用优惠券 or 认为不值得花精力去弄优惠券 喜欢搜索奇特的食材 or 只眷恋基本的食物 严格遵守食谱 or 只把食谱当灵感参照 采购少量多次 or 一次买很多 喜欢一次为多个目标集中采购食材 or 只想在回家路上顺便买几样东西 笃信品牌 or 方便就好，牌子无所谓 每次采购都买类似的东西 or 按照菜谱买东西 考虑完这些问题，挑选三条最符合你目标用户的特性：喜欢实验新菜谱，采购很仓促，尽量节约（在不必花费太多精力时）。3 3 通过对目标用户的定义筛选通过对目标用户的定义筛选功能点功能点 如果在确定了目标用户的特性后，功能点只剩下寥寥数条，你就得到了它：伟大的程序应该像激光一样准确聚焦在用户想完成的任务上。比如说，想想在第一步里你为购物程序列数的大量潜在功能点。虽然这些功能点都很有用，但并不意味着每个功能点对用户同样有用。最重要的是，第二步中的目标用户对这些功能点的喜爱程度也不一样。心里装着目标用户，再来检视功能点清单，最后能将程序聚焦在三个功能点上：创建列表、获得和使用打折券、获得菜谱。现在可以定义你的程序了，精确地概括程序的功能以及目标用户。好的定义应该是这样的：“一个帮助喜欢烹饪、主张节俭的用户创建购物清单的工具”4 4 不要停不要停 在开发过程中持续始终程序定义去判断功能点、控件和术语是否妥当。例如：当考虑是否要添加一个功能点时，问问自己它对于你的程序以及目标用户来说是否足够核心。如果不是的话，把它放在一边，它可能是另一个程序的核心组成。例如，你已经确定你的用户喜欢发掘新菜谱，所以强调打包好的蛋糕和菜肴就有失妥当。为设备而设计为设备而设计 你应该知道这个程序能做什么、目标用户是谁。现在，你要确定此程序能给人“为苹果iOS 设备而设计”的感觉。这很关键，因为用户对行将安装在 iOS 设备上的程序有很高的期待。如果你的程序让人觉得是为其他设备、或者 web 而设计，用户就不会太珍视它。拥抱拥抱 iOSiOS 界面规范界面规范 iOS 用户已经很熟悉内置应用的外观和行为，所以他们期待这些下载来的程序能带来相似的体验。你不会想模仿内置程序的每一个细节，但理解它们所遵循的设计规范会很有帮助。首先要了解 iOS 设备以及运行于其上的程序所具有的特性（详见“平台特点”这一章）。然后，将以下几点铭记于心：控件应该是可点击的。控件应该是可点击的。按钮、挑选器、滚动条等控件都用轮廓和亮度渐变，这都是欢迎用户点击的邀请。程序的框架应该简明、易于导航。程序的框架应该简明、易于导航。iOS 为浏览层级内容提供了导航栏，为展示不同组的内容或功能提供了 tab 页签。反馈应该是微反馈应该是微妙且清晰的。妙且清晰的。iOS 应用使用精确流畅的运动来反馈用户的操作。iOS 程序还可以使用进度条、活动指示器（activity indicator）来指示状态，使用警告给用户以提醒、呈现关键信息。你可以在“iOS 界面元素使用指南”这一章掌握控件的使用方法。在为程序设计宏观的用户体验时，确保明白“用户体验指南”一章中的内容。确保程序在确保程序在 iPadiPad 和和 iPhoneiPhone 上通用上通用 如果你正计划为 iPad 和 iPhone 设计程序，要确保该设计方案可以适用两种设备。以下指南可以给你一些帮助：为设备量身定做程序界面。为设备量身定做程序界面。大多数界面元素在两种设备上通用，但通常布局会有很大差异 为屏幕尺寸调整图片。为屏幕尺寸调整图片。用户期待在 ipad 上见到比 iPhone 上更加精致的图片。不建议仅仅将 iPhone 上的程序放大到 iPad 的屏幕上。无论在哪种设备上使用，无论在哪种设备上使用，都都要保住主功能。要保住主功能。虽然一种版本会为任务提供比另一版更加深入或更具交互性的展示，但不要让用户觉得他们是在使用两个完全不同的程序。超越“默认”。超越“默认”。没有优化过的 iPhone 程序会在 iPad 上默认以兼容模式运行。虽然这种模式使得用户可以在 iPad 上使用现有的 iPhone 程序，但却没能给用户提供他们期待的iPad 体验。重新考虑基于重新考虑基于 webweb 的设计的设计 如果你的程序移植自 web，那么需要确保你的程序能摆脱网页的感觉，给人 iOS 程序的体验。记住，人们可能会在 iOS 设备上使用 Safari 来浏览你的网页。这里提供一些能帮助 web 开发者创建 iOS 程序的策略：关注你的程序。关注你的程序。网页经常给访客一堆任务或选项，让他们来挑选，但是这种体验并不适合 iOS 应用。iOS 用户希望程序能像宣称的那样有用，希望能立刻看到有用的内容。确确保你的程序帮助用户做事。保你的程序帮助用户做事。用户也许会喜欢再网页中浏览内容，但更喜欢能使用程序完成一些事情。为触摸而设计。为触摸而设计。不要尝试在 iOS 应用中复用网页设计模式。熟悉 iOS 的界面元素和模式，并用它们来展现你的内容。菜单、基于 hover 的交互、链接等 web 元素需要重新考虑。让用户翻页（让用户翻页（scrollscroll）。）。大多数网页在第一时间将重要的内容认真的展现出来（Most websites take care to display the most important information“above the fold”）。因为让用户在顶部区域附近没找到想要的内容，就会离开。但在 iOS 设备上，翻页是很容易的，也是意料中。如果为了把所有内容挤在一屏里而缩小字体、压缩空间尺寸，最终可能内容都变得看不清，布局也没法用。重置主页图标。重置主页图标。网页经常在每个页面的顶部放置回主页的图标。iOS 程序不包括主页，所以不必多此一举了。另外，iOS 程序容许人们通过点击状态栏快速回到列表的顶部。如果你在屏幕顶部塞进一个主页图标，想按状态栏就没那么容易了。为任务量身定做界面为任务量身定做界面 顶级的 iOS 程序能够用清晰的意图和易用性去平衡界面设计。为了在程序中达成平衡，一定要在开发初期将设计考虑进去。因为对品牌化、原创性和市场推广的考虑经常会影响设计决策。始终保持对用户体验的关注是极大的挑战。使用 iOS SDK 可以随意选择定制界面的程度。由于对定制的程度没有限制，你需要考虑这些定制的界面会怎样影响用户完成任务。当你把任务纳入考虑范围时，想一想用户执行这些任务的频率和环境。例如，想象一个打电话的软件。这个界面没有使用键盘，而是呈现了一个漂亮、逼真的拨盘。这个拨盘制作精良，所以用户既非常喜爱，也立刻就知道如何去使用它。这个拨盘表现逼真，所以用户在做出拨号动作、听到与众不同的拨号音时会非常开心。但当需 经常拨打没在通讯录中保存的号码时，最初的喜悦很快会被沮丧替代。因为转盘拨号的效率太低了。对于一个帮助用户打电话的程序来讲，这个优美的界面是一个累赘。另一方面，考虑一下泡泡水平线取样仪，这上面会呈现一个逼真的水平测量管。用户知道如何使用真实的仪器，所以也能立刻知道如何使用它。这个程序即便没有那个漂亮的气泡也能展示水平角度信息，但是这会让程序变得不符合直觉，难以理解。在这种情况下，定制的界面不仅向人们展示如何使用这个应用，也让任务变得简单。当你在考虑定制的界面给任务带来的是帮助还是障碍时，请记住以下几点：定制定制一定要是有据可循的。一定要是有据可循的。理想情况下，定制界面能帮助用户完成任务，增强体验。应该让用户的任务来引导界面设计。例如：如果你的程序需要操纵大量的精确数据，用户会偏爱易懂、标准化的控件以及流畅精炼的导航。如果你的程序用于浏览内容，用户就不喜欢比内容还抢眼的界面 如果你的程序是个游戏，提供即时的、有情节的体验，人们会期望进入一个充满漂亮图片、交互新颖的奇特世界。尽可能少的给用户增加认知负担。尽可能少的给用户增加认知负担。用户喜欢了标准化控件的使用方法和行为，所以他们不必停下来思考该怎么使用它。当面对那些看起来、用起来不符合标准的控件时，用户之前的经验就失效了。除非你那极富个性的控件能让任务变得很容易，否则用户会讨厌被迫学习只能在此程序中使用的新技能。保持内部一致性。保持内部一致性。你的界面越个性，在程序内保持这些控件外观和行为一致性就越重要。如果用户花时间学会使用这些不熟悉的新控件，他们希望这些经验能在整个程序里通用。在控件和内容间保持差异。在控件和内容间保持差异。因为用户很熟悉标准控件，它们不和内容抢用户的注意。当你设计界面时，要确保它不会和用户关注的内容抢风头。例如，如果你的程序容许人们观看视频，你可能选择自己设计一套播放控件。但是，是否采用标准控件是次要的，更重要的是这些控件是否会在用户开始观看视频时渐隐，在用户轻触屏幕时重现。在重新设计标准控件前要三思。在重新设计标准控件前要三思。如果你计划重新制作标准控件，要确保你的控件提供 与标准控件同样多的信息。例如，如果你设计的按钮不是用户印象中那种方方的样子，用户甚至可能看不出它能点。或者，如果你创建一个切换控件，却不能显示两极状态，用户可能不会意识到它是一个双态控件。确保对确保对定制定制界面元素进行充分的用户测试。界面元素进行充分的用户测试。在测试中，观察用户是否能预测控件的功能，使用它是否很简单。例如，如果你的控件尺寸小于 4040 像素，用户点击它就有困难。或者，如果你的控件对水平滑动（swipe）和轻触（tap）的响应不同，要确保此控件的功能值得用户花费额外精力去留意这些差别。原型和重述原型和重述 在你调用庞大的开发资源去实现你的程序前，最好做一个用于用户测试的原型。即使只能让一些同事参与测试原型，你也能从他们对程序功能的新视角和体验中获益良多。在设计初期，你可以使用纸面原型或者线框图来表现主要的信息展示区和控件（views and control），绘制画面间的切换流程。虽然你能从测试线框图中获得有用的反馈，但有采样不足带来的偏差也会误导测试员。这是因为让用户凭想象获得的体验会与使用细节完善的程序时不同。如果你的原型能在设备上运行，那么获得的反馈会更加有价值。当用户能与你的程序交互时，他们能在程序中发现那些与预期不一样的地方，或者那些设计的太过复杂。设计可信原型最简单的方法是选一个 Xcode 的模板，改成一个基本的程序，填充一些合适的内容用以占位。然后，在设备上安装它，以便用户能够尽可能真实的体验。你不需要提供大量的内容，或者让每个控件都有功能。只要测试员能通过点击屏幕上某区域跳转到下一个逻辑关联的页面，或者能完成主要的任务，就足以给用户提供反馈。想学Xcode，详见“A Tour of Xcode”。当基于 Xcode 模板开发你的原型时，你免费获得了很多功能，并能基于反馈对设计作出调整。只需要很短的时间，你就能在定稿并投入资源开发前迭代很多次原型。第第5 5章章 案例分析：案例分析：移植移植到到 iOSiOS 你很可能准备把一个现有的软件移植到 iOS 平台，而非创建全新的程序。从某些方面来说，从网页或其他平台移植应用要比从草图搭建全新应用更具挑战性。如果由你负责这些项目，想一下人们会怎样使用 iOS 设备：用户使用 iOS 设备的方式与使用桌上或膝上电脑非常不同，对用户体验的期待也完全不同。将软件从电脑移植到 iOS 设备的征途绝非一马平川。用户经常在走动中或是在嘈杂的环境中使用 iOS 设备。你的工作就是创建爽快的使用体验，把用户拉进来，尽可能又快又简单地把他们想要的内容提供出来。记住二八原则：通常，大多数用户（至少 80%）只使用程序中很少一部分功能。只有很少用户会使用全部功能（少于 20%）。iOS 程序很少需要提供只有资深用户才用得到的功能。从从电脑电脑上上的的 MailMail 到到 iPhoneiPhone 上的上的 MailMail Mail 是 Mac 上的一个曝光度很高，很好用，也很受好评的程序。也是一个容许用户方便地创建、接收、排序和存储邮件，跟踪事件，创建便签和邀请的强大程序。电脑上的Mail 通过大量窗口来实现如此强大的功能。iPhone 版 Mail 只关注电脑版 Mail 的核心功能，帮助用户接收、创建、发送和管理邮件。iPhone 版 Mail 需要把功能浓缩到为如下情景量身定做的界面：简练的外观，把用户关心的内容凸显到最前面、最中央。为不同任务设计不同的视图。信息结构符合直觉、缩放自如。在需要时，提供强大的标记和管理工具。为用户的动作提供微妙且富有表现力的动画作为反馈。需要留意的是，iPhone 版 Mail 不比电脑版的 Mail 好用。想反，这是专为移动设备用户重新设计的 Mail。通过只关注一部分功能点，并把它们用简洁却诱人的界面展现出来，iPhone 版 Mail 满足了移动用户最核心的需求。为了将 Mail 的体验迁移到移动环境中，iPhone 版 Mail 在界面上做了些创新：直白的、高度聚焦的屏幕。直白的、高度聚焦的屏幕。每一屏展示一类邮件体验：账户列表、邮件列表、消息列表、消息视图、书写视图。在一屏内，用户通过滚动浏览全部内容。简单、可预测的导航。简单、可预测的导航。通过在屏幕上轻击，用户可以从宏观进入微观。每一屏上都会展示标题，告知用户所在的位置，以及一个返回按钮，方便用户找回浏览足迹。简单、可触摸的控件，一有需要时就出现。简单、可触摸的控件，一有需要时就出现。因为书写新信息以及检查新邮件可能是用户在任何环境中都想进行的主要操作，iPhone 版 Mail 通过多点触摸屏幕来实现它。当人们浏览信息时，回复、移动、删除等可对信息进行的操作就会出现。从电脑版从电脑版 KeynoteKeynote 到到 iPadiPad 版版 Keynote 是用于创建世界顶级展示的应用，它非常强大、灵活。用户非常热爱能将易用与细节极其精致的木纹控件融为一体的 keynote。iPad 版 Keynote 抓住了电脑版 Keynote 的核心功能，通过以下体验让 Keynote 在 ipad上如鱼得水：关注用户的内容 不阉割功能却降低了复杂度 提供了简便易用的快捷方式 优化了桌面上一些熟悉的特性 通过动画提供反馈和沟通 由于 Keynote 使用 iPad 规范提供了用户期待的功能，用户立刻理解如何在 iPad 上使用它。因为可以直接很简单自然地操控内容，新的用户也能很容易学会如何在 iPad 上使用 Keynote。从电脑版向 iPad 版的移植基于无数事无巨细的修改和重新设计。最明显的改动有这些：简洁的工具栏。简洁的工具栏。工具栏数的项目屈指可数。但是这给了用户获得所有创建内容所需工具的一致通道。听从用户召唤的简洁检视窗口。听从用户召唤的简洁检视窗口。Keynote 的检视窗口自动包含与用户所选内容相关的工具和属性调节控件。通常，用户可以在检视窗口的第一屏内完成所有对选中对象的调整。如果要调整那些很少被改动的属性，用户可以进入检视窗口更深的层。很多预置的样式模板。很多预置的样式模板。用户可以利用预置样式很方便地修改图示、表格等的外观和感觉。除了颜色主题外，每一套预置样式还包括表格标题、勾号标记等，用以协调整套主题的风格。直接控制内容，添加有意义的动画。直接控制内容，添加有意义的动画。在 iPad 版 Keynote 上，用户可以拖动一张幻灯片到新位置，扭动物体以旋转它，轻触一张图片以选中它。动画反馈加强了直接控制的印象。例如，幻灯片在移动时会