转:iOS 7人机界面准则
原文来自于:http://www.infoq.com/cn/news/2014/02/ios-ui-design
Apple官方推出的“iOS人机界面准则”一直被iOS开发者奉为绝对的设计参考宝典,特别是iOS7系统推出以来,Apple公司对该准则进一步做了更新。最近,国内知乎社区的郎启旭推出了“iOS人机界面准则”完整的中文版,使iOS国内开发者可以快速上手。
iOS人机界面准则主要分为UI设计基础、设计策略、iOS技术、UI元素、图标和图像设计等几个大类,其中每个大类有细分为许多小节,对iOS界面设计原则描述的非常详尽。
准则一开始就谈到了iOS7的设计主旨:
- 依从(Deference)。用户界面(UI)应当有助于用户理解内容并与之互动,而非对抗。
- 清晰(Clarity)。文字在每种字号下都易于阅读,图标表意准确清晰,装饰也恰到其度,并以对功能的无比关注驱动设计。
- 纵深(Depth)。视觉上的分层界面和逼真的动作使其更赋活力,提升了用户的愉悦和理解。
对于“依从”这个主旨,准则举了几个实际设计的例子来阐述其表现方式,包括:
- 充分利用整块屏幕。重新考量对插图和视觉框架的使用,可以考虑让内容扩展到屏幕边缘。“天气”就是一个很好的范例:漂亮的全屏界面非常直观地呈现出某个地点当前天气的关键信息,而且还有
多余空间可以显示每个小时的天气数据。 - 重新考量模拟现实的视觉表现。浮雕、渐变和阴影效果有时会让界面元素变得沉重,进而喧宾夺主。相反,要突出内容并让界面扮演一个辅助性的角色。
- 通过半透明的界面元素来暗示背后的内容。半透明效果(如“控制中心”)可以提供情境,帮助用户看到更多可用的内容,并给人一种短暂停留的暗示。在 iOS 7 中,半透明元素只模糊渲染在其正背后的内容,给人一种透过宣纸的感觉,但屏幕上的其他部分并不会模糊。
- 大量使用留白。留白会让重要内容和功能更为突出、更易于理解。同时,留白还可以传达一种安静平和的感觉,这会让 app 看上去更加专注和高效。
- 用色彩简化界面。使用一种主题色——例如「便签」中的黄色——来突出重点,并巧妙地暗示其交互性。同时,这会给 app 带来一致性的视觉主题。内置的 app 使用了一系列纯净的系统颜色,而每一种颜色在深色浅色两种背景中看起来都很好。
- 拥抱无边框按钮。在 iOS 7中,所有的条栏按钮都没有边框。无边框按钮会在按钮的内容区域内使用情境、颜色和一个动作导向的标题来暗示其交互性。如果合适,还可以通过显示纤细的边框或者浅色背景来让按钮更加突出。
- ……
在“启动和停止”一节中,准则特别强调:一般来说,在接触新 app 的一两分钟内人们就会决定是否继续使用。如果你把握住这转瞬即逝的机会迅速呈现有用的内容,就可以激发新用户的兴趣,并给所有用户带来出色的体验。不要在人们安装好你的 app 后告诉他们需要重启设备。重启会耽误时间,还会让你的 app 看起来不太可靠且难以上手。
避免要求用户提供设置信息,代之以:
- 关注 80% 用户的需求。这样,大部分用户不需要进行任何设置,因为你的 app 已经按他们期望的方式设置好了。如果有一些功能只有极少数用户可能需要或者大部分用户只会用一次,请抛弃这样的功能。
- 尽可能通过其他方式获取信息。如果你可以使用任何内置程序或设备中用户所提供的信息,那就从系统中获取这些信息,而不要让用户再输一次。
- 如果你确实需要提供设置信息,请让人们在你的 app 中输入。然后,尽快存储这些信息(例如,在你 app 的设置中)。这样一来,在有可能体验到你 app 的乐趣前人们不会被迫切换到 iOS 的「设置」中了。如果人们将来需要修改这些信息,可以在任何时间前往 app 的设置页面进行修改。
准则在“设计策略”部分指出,一致性可以让用户将 app 中的某部分界面的经验和技巧复用到其他地方,或者从一个 app 复用到另一个 app。一致性的 app 不是对其他 app 的简单复制,也不是风格上的一成不变,相反,它关注用户所习惯的方式和标准,并提供一个具有内在一致性的体验。
要判断一个 iOS app 是否符合一致性原则,可以通过以下几个问题来考量:
- App 是否和 iOS 标准保持一致?它是否正确地使用了系统控件、视图和图标?是否以用户所期望的方式利用了设备的特性?
- App 自身是否具有内部一致性?文本内容是否使用了统一的用辞和风格?同样的图标是不是通常意味着相同的意思?当用户在不同的位置执行同一个操作时是否符合其预期?自定义的界面元素外观和其行为是否保持一致?
- App 是否在合理范围内与之前的版本保持一致?术语和含义是不是仍然相同?基本概念和主要功能是否基本不变?
准则强调:在整个开发过程中,始终要用你的app 定义陈述去判断功能点、控件和用词是否妥当。例如:
- 当你考虑增加一个新功能时,问问自己,这对你 app 的主要目的和目标用户是不是不可或缺?如果不是,把它放在一边,它可能是构建另一个 app 的基础。例如,你已经确定你的用户喜欢探索烹饪,那么强调打包好的蛋糕和加工好的熟食可能不会被用户喜欢。
- 当你考虑 UI 的外观和行为时,问问自己,你的目标用户是喜欢简洁流畅的设计,还是一个更明显的主题风格?以用户对你 app 的期望为指引,例如使用 app 去完成一项重要任务,快速找到一个答案,探究内容详情,或者为了娱乐。尽管你的购物清单 app 需要易于理解而且立即可以上手,但你的用户可能会更喜欢一个展示着大量美味食材图片的界面主题。
- 当你在考量术语时,努力去迎合你的受众的专业认知。例如,即便你的受众不太可能由专业厨师组成,但你也应该明白,用户会希望看到配方和技术方面的专业术语。
- 尽可能避免增加用户的认知负担。用户熟悉标准 UI 元素的外观和行为,所以不需要停下来去思考如何使用它们。但当他们面对那些和标准 UI 外观和行为完全不一样的元素时,先前的经验毫无用处。除非你独特的元素可以让任务执行更容易,否则用户可能不会喜欢被迫去学习新的流程,而这些流程又不会在其他 app 中用到。
- 重新设计标准控件前要三思。如果你正在计划重新设计一个标准控件,要确保你的新设计提供了和标准控件一样多的信息。例如,如果你设计的开关控件不能表现出两个相反的状态,用户可能不会意识到这是一个两态控件。