iOS Human Interface Guidelines 1 简介

翻译：王冠

近期正在学习iOS的交互设计规范，计划把部分交互、界面设计翻译出来，可以加深理解，需要的同学也可以做参考，有翻译得不好的地方，欢迎指正。

UI设计基础

为iOS而设计

iOS体现了以下特性：

1尊重：UI设计帮助用户理解系统界面、与系统内容发生互动，但从不会与内容发生冲突。

2清晰：确保文字在任何尺寸下都是清晰易读的，icons要表现出可被明确辨认、易懂的特性，要用微妙和适当的元素来装饰设计UI，同时致力于带有激励性的功能设计。

3深度：视觉层次和逼真的动画效果可以让用户感到界面有生命力，提高用户的愉悦感，加深对于UI的理解。

无论是在原有基础上重新改进一个软件，还是从头开始设计一个新的软件，考虑用下面的方式来设计：

首先，第一眼看UI就能明白app的核心功能，并理解他们之间的关系。

下一步，使用iOS的主题风格，来UI设计传递给用户的体验，小心地添加细节来装饰UI，拒绝加入不必要的元素。

最后，一定要确保UI设计可以适配不同型号的设备和模式，以便用户可以正常使用软件。

在整个设计的过程中，做好准备推翻之前的工作，去大胆质疑和假设，参考内容和功能来做每个设计决策。

遵循内容

即使个性好看的UI和丰富的动效是iOS使用体验的亮点，但用户关注的内容才是核心要注意的问题。

这里有一些方法可以提升UI功能性，并且遵循用户关注的内容。

利用整个屏幕，天气app是一个非常好的例子：全屏下，利用美观的方式来显示当前天气。直接表达出最重要的信息，同时用其他空间来显示每小时的天气数据。

重新考虑现实和物理的显示效果，边框、渐变和阴影有时会让UI变得压抑、无法凸出主要内容，并与内容冲突，我们应该关注软件内容，让UI扮演一个支持的角色。

让半透明的UI元素显示出他们背后的内容，一些半透明的元素——像控制中心——提供了一种场景，让用户看见更多的内容可用，并可以让用户知道当前状态是短暂存在的。在 iOS 中，一个半透明的元素只会让它下方的内容变得模糊，看起来像透过米纸看桌面的感觉，但不会导致屏幕其他地方也变模糊。

提供清晰的展示

提供清晰的展示是另外一种保证软件内容突出的方法，突出重要的功能和内容，可以让交互变得更直观、容易理解。

使用大量负空间（空间中的空白、留白），负空间重要的内容和功能更易被注意到和理解，负空间也能让人有种风平浪静和安宁的感觉。

使用颜色让UI变得简单，一个关键的颜色——像便签里面的黄色—把重要的控件（按钮）高亮，可以表现出他们的交互性，它也让 app有一致的视觉主题。系统内建 app 使用一致纯粹、干净的系统颜色，这样不管在明暗的背景下，都能显示不错的色彩效果。

确保系统字体的易读性，iOS的系统字体可自动教正字间距和行高度，让文字在任何大小下都可以看起来很舒服，无论使用系统字体或者自定义字体，一定要确保使用动态类型。app才能在用户选择不同文字大小时自动响应调节。

接受没有边框的按钮。默认情况下，所有顶栏上的按钮都是没边框的。在中间显示内容的区域，一个没边框的按钮通过场景、颜色和文字内容来体现交互性。确有需要时，内容区域的按钮可以通过窄边框或根据背景颜色来显示自己是不同的。

用深度来交流

iOS 时常在不同层次下显示内容，通过不同层次和位置来传达内容，可以帮助用户理解屏幕和对象间关系。

使用半透明背景和浮动在主屏幕上方的动画效果，这文件夹里面的内容与屏幕其他区域分隔开。

日历提醒用多个层次列表显示，当用户选中一个列表后，其他的列表收起显示在屏幕底部。

日历在年视图、月视图、日视图的切换时，日历用增强的界面过度让用户感觉到层次和深度，在收起的年视图上，用户可以直观地看到今天的日期，同时执行其他的日历任务。

当用户选择一个月份时，年视图缩小变成月视图，高亮显示今天的日期，年份则显示在返回按钮旁边（左上角）。用户可以清楚的知道自己在哪，从哪来到这一层、如何返回上一层。

当用户选择某一天时，也有类似的界面转换效果：月视图裂开展示，把的周推到屏幕顶部横向显示，然后着重显示已选的小时视图。伴随每一次界面切换，日历不断增强对用户展示年、月、日的层次关系。