iOS平台设计规范(三)交互

无论是UI、交互,还是产品经理,都应该熟读iOS平台设计规范。这对我们的产品设计,百利而无一弊。

交互(User Interaction)  

一、3D 触控(3D Touch )

在支持3D Touch的设备上,用户可通过对屏幕施加不同程度的压力来访问相应的功能。例如:3D Touch作用于APP图标上,则会出现上下文菜单(支持Peek/轻压和Pop/重压)来展示内容。其次,用户还可以用3D Touch来操作页面里的内容。

在运行iOS 13及更高版本的设备上,无论设备是否支持3D Touch,用户都可以使用触摸并按住来打开上下文菜单。只是在支持3D Touch设备上,可以更快地显示上下文菜单。

注:iPhone 6S及其之后出的设备都支持3D Touch(iPhone SE除外),iPhone 6S及其之后出的设备都可运行iOS 13。所以,iPhone SE更新到iOS13或更高版本,也可以通过 3D Touch 打开上下文菜单的。

1、主屏幕交互

在运行iOS 13或更高版本设备的主屏幕上,当用户触摸并且按住APP图标时,APP可以显示上下文菜单(在3D Touch设备上,用户可以轻压图标以查看菜单)。

APP的上下文菜单可让用户快速执行常用的操作或查看有趣的信息。例如:轻压/重压“日历”图标,除了显示日程表中的下个日程外,还提供了添加日程快捷入口。

2、实况照片

当用户与实况照片交互时,实况照片就会变得栩栩如生,通过动作和声音来展示照片拍摄前后的瞬间。

在运行iOS 13或更高版本的设备上,用户将手指放在照片就可激活实况照片; 在支持3D Touch设备上,用户短时间触摸并按下就可激活实况照片。

二、音频(Audio )

用户可以通过音量按钮、静音开关、耳机以及屏幕上的滑块调节声音。许多第三方配件同样支持声音控制。音频可通过内置或外置扬声器,耳机输出,甚至可通过AirPlay或蓝牙设备进行无线输出播放。

无论声音是为了用户体验还是点缀,你都需要了解用户期望声音如何表现并满足用户的期望。

1、静音

用户将设备切换为静音状态,以免被突如其来的声音干扰。例如:电话铃声和短信提示音。同时他们还希望关掉一些没必要的提示音,包括键盘声音、音效,游戏音乐和其他声音反馈。

当设备被设置为静音时,只应发出本该出现的声音,例如播放中的音乐、闹铃和视频声音。

2、音量

无论是使用设备上的物理按键还是屏幕上的滑块,用户都希望能够改变音量大小来控制整个系统的声音,包括音乐和APP内音效。唯一的例外是铃声的音量,当其他音频没有被播放的时候,它总是可以被单独调节音量。

3、耳机

用户私下里喜欢使用耳机去接收声音,来解放他们的双手。当插入耳机时,用户希望声音能够自动进行转换到耳机并不中断。当拔下耳机时,他们则希望播放立即暂停。

4、设计出色的音频体验

(1)必要时自动调整不同层级的音量水平,但不是整体音量

为达到更好的混合音效,你的APP可以单独调整不同层级音频间的相对音量。但是,最终音量的输出应始终由系统音量控制。

(2)允许在适当时重新选择路由

用户经常需要选择不同的音频输出设备。例:他们可能希望通过客厅立体音响、汽车收音机或Apple TV来听音乐。请支持这个功能,除非你有令人信服的理由。

(3)使用系统提供的音量视图可以调节音量

音量视图是用于调节音量最好的界面控件。这个视图是可自定义的,包括音量层级的滑块,甚至包括替音频输出重新选路由的控件。

(4)短音和振动请使用系统声音

(5)如果声音很重要,请对音频进行分类

不同的音频类别都可以用静音开关静音、与其他音频混响、或在APP在后台时播放。根据音频类别的含义和当前设备的音频状态选择一个类别,并将其分配给你的音频对话。例如:非必要情况下,请不要阻止用户听来自其他APP的音乐。

一般情况下,最好避免在APP运行时更改音频类别,除非APP需要经常录制并马上播放音频。

(6)在中断后适当时恢复被干扰打断的音频

有时,当前正在播放的音频会被来自其他应用的音频中断。暂时性干扰(比如来电铃声)被认为是可恢复的。永久性干扰(比如由Siri打开的音乐播放列表),被认为是不可恢复的。

当APP正在播放音频发生暂时性干扰而中断播放,在中断结束后,应立即恢复播放。例如:在播放配乐的游戏和播放音频的媒体应用,都应该恢复声音的播放。

(7)当你的APP播放完临时音频后通知其他APP

如果你的APP可能暂时中断其他APP的音频,那应该适当地标明声音片段,以便可以在安全恢复时通知其他APP。

(8)仅在有意义时才响应音频控件

无论你的APP在前台还是后台,用户都能够通过应用界面以外的东西去控制音频的播放。例如:在控制中心或者耳机上的控件。

如果你的APP正在清晰的音频相关环境中主动播放音频,或连接到支持AirPlay的设备上,则可以对音频控件做出响应。但是,你的APP不应该混淆其它应用的音频,因为它们可能会在控件被激活时播放。

(9)不要重新定义声音控件

用户希望声音控件在所有APP中都能保持一致。永远不要重新定义声音控件。如果你的APP不支持某些控件,那么不对他们做出响应即可。

三、认证(Authentication )

要求用户仅在交换价值时进行身份验证,例如:个性化体验、访问其他功能、购买内容或同步数据。如果你的APP需要身份验证,请使用Apple登录,这为用户提供了一种简单安全的登录方式。

当你的APP支持使用Apple登录时,用户可以获得他们可以信任的一致性登录体验,也不必记住的很多个帐户和密码。

注:在APP或网站中显示使用Apple按钮登录,则意味着用户可以使用他们已有的Apple ID轻松登录或注册,并跳过填写表单,验证电子邮件地址和选择密码。Apple是一种新的、更私密的登录方式,它让用户可以简单快速地登录APP和网站。

1、若使用Apple登录,请使用密码自动填充

此功能可自动生成并填写密码和安全代码,以便人们在验证上花的时间更少。所有APP都应支持此功能。

2、尽可能延迟登录

如果不能马上做任何有用的事情,用户经常会果断放弃使用该APP。在他们放弃之前,让他们有机会爱上你的APP。

例如:在购物APP中,让用户在进入后立即浏览商品,并且只有在他们准备要购买时才需要弹出登录。而在一些媒体流APP中,让用户在登录之前也可以轻松浏览并查看APP里面的内容。

3、说明身份验证的益处及如何注册

如果你的APP需要身份验证,请在登录页上显示简短、友好的说明,说明验证的原因及其好处。

此外,请记住,并非每个使用APP的人从一开始就拥有帐户。请务必说明如何获取账户,或提供简单的注册方式。

4、通过显示适当的键盘来最小化数据输入

例如:在访问电子邮件地址时,请显示电子邮件键盘屏幕,其中包含有用的数据输入快捷方式。

5、切勿使用“密码”一词

密码是用于解锁用户的iOS设备,并在生物识别(Face ID 和 Touch ID)被禁用的情况下,可以使用密码验证Apple Pay。

Face ID 和 Touch ID

1、尽可能支持生物识别身份验证

Face ID和Touch ID是用户相信安全、熟悉的身份验证方法。如果用户启用了生物识别身份验证,你可以先假设他们了解其工作原理,了解其便利性,并且希望尽可能使用它。

请记住,用户也可能会选择在其设备上禁用生物识别身份验证,因此你的APP应准备其他备选方案。

2、默认一种方式对用户进行身份验证

用户不用选择具体哪一种方式进行身份验证,这是最直观的。只需给他们一个选项,比如Face ID,然后提供替代登录方案。

例如:若在初始方法失败时,将用户名和密码登录的方式作为后备方案。

3、仅在响应用户操作时启动身份验证

显示操作(如点按按钮)可确保用户进行身份验证。例如:在Face ID的情况下,用户可能需要面向相机。

4、明确描述身份验证方法

例如:使用Face ID登录APP的按钮标题应为“使用Face ID登录”,而不仅仅是“登录”二字。

5、准确参考认证方法 

请勿在支持Face ID的设备上引用Touch ID。同理,请勿在支持Touch ID的设备上引用Face ID。检查设备的功能并用适当的文字说明。

6、一般来说,不要在APP中提供选择生物识别身份验证的设置(开关)

如果系统中启用了生物识别身份验证,则只需假设用户在你的APP里也是想使用它的。

如果你单独在APP做一个生物识别身份的选择开关,则用户可能会看到这样一种状态:当生物识别身份认证在系统内被真正禁用时,APP设置里却显示为已启用。

7、请勿使用图标来标识系统身份验证功能 

当用户看到类似于系统的Touch ID(指纹)和Face ID图标时,他们会认为应该进行身份验证。使用图标来标识身份验证功能会产生不一致并导致混淆,尤其是当图标上色、以大尺寸显示并脱离上下文时。

四、信息输入(Data Entry)

无论是点击界面元素还是使用键盘,输入信息都是一个繁琐冗长的过程。

在用户想要通过APP做一些任务或有意义的操作之前,却要进行一连串的输入才能继续,这明显会拖慢整个操作流程,用户很快会感到气馁,甚至可能完全放弃使用你的APP。

1、尽可能提供选项来代替输入

尽量提高信息输入的效率。例如:考虑使用选择器或列表进行选择,而不是直接输入文本字段,因为提前设定好选项供用户选择比让他们直接输入信息要容易得多。

2、尽可能从系统获取信息

不要强迫人们提供那些本可以自动获取,或是在用户许可范围之内的信息。例如:联系人或日历信息。

3、提供合理的默认值

在可能输入的范围内,尽量提供一个合理可靠的默认值。合理的默认值会大大缩短用户做出决定的时间,同时加快整个流程进行。

4、只有在填完必填项后才能够下一步

在激活“下一个”或“继续”按钮之前,请确保所有必填项都有值。利用按钮的外观状态作为提示,告诉用户可以进行下一步了。(如按钮被激活后高亮显示)

5、动态验证所输信息的有效性

在用户填完冗长的信息后,再使其返回去更正错误会很令人沮丧的。尽可能的在用户输入信息后立即进行字段值检查,以便用户能及时发现并更正错误。

6、只有在必要时才需要必填字段值

只有系统运行真正必需的信息才需要使用必填字段。

7、设计简单的值列表导航

尤其是在列表和选择器中,必需能很简单地选择一个值。可以考虑将值列表按首字母排序或是其它逻辑排列,以便于加快用户浏览和选择的速度。

8、在输入栏中显示提示以辅助说明

当输入栏没有其他文本时,可以用占位符文本,比如:“电子邮件”或“密码”。当占位符文本已经足够说明时,不要再用单独的标签文字来描述。

五、反馈(Feedback)

反馈可以帮助用户知道APP正在做什么,并引导解他们下一步可以做什么,并了解这么做将产生的结果。

1、将反馈状态和其他类型的反馈融入到你的界面设计中,不要太引人注目

理想情况下,用户无需进行任何操作或中断即可获得重要的信息提示。

例如:在浏览邮件时,邮件的状态信息被巧妙地放在在底部工具栏中。这样做既不会抢了屏幕中主要内容的风头,又可以在用户需要时快速查看。


2、尽量不要用警示框

警示框是一种非常强大的反馈机制,它应该用在传递非常重要的信息上。如果用户看到太多并非是重要信息的警示框,他们很快就会学会忽略之后出现的警示框。

六、文件处理(File Handing)

用户在创建、查看和操作文件时,用户不需要了解文件系统的概念。如果你的APP有涉及到文件,请尽可能地淡化文件处理。

1、除非取消或删除,否则确保文件自动保存

一般情况下,不要让用户主动去保存文件。相反,在打开和关闭文件以及切换到其他APP时,应该自动为用户保存文件。

不过在某些其他情况下,例如编辑现有文件时,保存和取消按钮是有存在的必要的,因为它可以告诉用户具体什么时候可以保存和撤销编辑。

2、不要提供创建仅本地文件的选项

用户通常希望他们的所有文件都可以在他们的所有设备上使用。无论如何,尽量让你的APP像iCloud等服务一样支持云存储。

3、设计直观的图形文件浏览界面

理想情况下,选择用户最熟悉的系统文件浏览器来浏览界面。如果你设计了一个定制化的文件浏览器,请确保它直观且高效。

文件浏览器只有在提供高质量的图形及视觉响应界面的条件下,才会发挥最大的效果。如果想要更快地导航,可以考虑加一个文件按钮,这样用户便可以无需跳转至其它页面便可创建新的文件。

4、允许用户无需离开你的APP也可预览文件

即使你的APP实际上没有打开文件,你也可以使用“快速浏览(Quick Look)”功能让用户查看Keynote,Numbers和Pages文档,PDF,图像和某些其他类型文件的内容。

5、必要时,与其他APP共享文件

如果有必要的话,你的APP可以通过Document Provider Extension与其他应用共享文件。除此之外,还应该可以让用户浏览和打开其他APP的文件。

七、手势(Gestures)

用户在触摸屏上用不同的手势来与iOS设备上的APP进行交互。这些手势让用户与内容的紧密联系在一起,增强了用户对屏幕内容的直接操纵感。

1、一般来说,尽可能地使用标准手势

用户熟悉标准手势,并不希望总是被迫学习不同的手势来完成相同的操作。

在游戏以及其他沉浸式APP中,自定义手势可以成为用户体验中有趣的一部分。但在其他APP中,最好使用标准手势,因为这样用户无需花额外的精力去发现和记住新手势。

2、避免使用标准手势执行非标准操作

除非你的APP是一个游戏中心页面,否则重新定义标准手势的含义会让你的APP变得很混乱和复杂。

3、避免干扰系统范围的屏幕边缘手势

根据设备的不同,屏幕边缘手势可以访问主屏幕,应用程序切换器、通知中心、控制中心和Dock等。用户需要依靠这些手势方便访问设备中的每个APP。

在极少数情况下,像游戏这样的沉浸式APP自定义的屏幕边缘手势可能需要优先于系统的屏幕边缘手势 - 第一次滑动调用自定义的APP手势,第二次滑动调用系统手势。应谨慎实施此行为(称为边缘保护),因为这会让用户更难以访问系统级的操作。

4、提供快捷手势以补充基于界面的导航和操作,而不是代替

尽可能提供一种简单、可见的方式来导航或执行操作,即使这可能意味着需要额外的点击。

许多系统APP的导航栏中,都包含一个清晰且可点击的返回按钮。但是用户也可以通过从屏幕侧面滑动来返回上一页。在iPad上,用户还可以通过按Home键或使用四指捏手势退出主屏幕。

5、使用多指手势来增强某些APP的体验

虽然同时涉及多个手指的手势并不适合每个APP,但它们可以丰富某些APP的体验,比如游戏和绘图APP。例如:游戏APP中可以同时操作控制杆和发射按钮。

标准手势

用户通常希望以下标准手势在整个系统和每个APP中的工作方式和含义是相同的。

1. 点击(Tap)

激活按钮或者选择某个对象

2. 拖动(Drag)

把一个元素从一边移到另一边,或者在屏幕内拖动某个元素

3. 滑动(Flick)

快速滑动或平移

4. 横扫(Swipe)

当用一根手指横扫时,可以用来返回到上一个屏幕、呼出在分屏视图控制器中的隐藏视图、在列表中显示“删除”按钮、或者在预览中呼出操作列表。在iPad上用四根手指横扫时,可在APP之间切换。

5. 双击(Double Tap)

放大居中的内容或图片,或缩小已经放大的图片

6. 捏合(Pinch)

向外张开时放大当前内容,向内捏合时缩小当前内容

7. 长按(Touch and Hold)

在可编辑或可选择的文本中执行长按时,显示编辑光标定位的放大视图。在某些视图(例如集合视图)中执行长按时,则进入重新排列项目的模式。

8. 摇晃(Shake)

撤销或重做

9. 旋转(Rotate)

旋转图像或视图

八、触觉(Haptics)

触觉(力的反馈,如震动)可以让用户的触觉增强,从而增强与屏幕界面交互的体验。

例如:当确认Apple Pay交易时,除了提供视觉和听觉反馈之外,系统还会有力的反馈。触觉还可以增强触摸手势和交互,如滚动选择器和切换开关。

在支持的iPhone型号上,你可以通过多种方式向APP添加触觉:

使用标准的UI元素 - 如开关、滑块和拾取器 - 默认情况下会播放Apple的系统触觉。

当它有意义时,使用反馈生成器播放通知、影响和选择类别中几个预定义触觉模式之一

在你需要更多控制的情况下,你可以撰写并播放你自己定义的触觉模式。

当你使用系统触觉时,iOS会管理反馈的强度和行为。例如,一个开关自动播放会有一个微妙的点击。

无论你使用系统提供的触觉模式还是创建自定义触觉模式,使用触觉技术是为了丰富用户体验,同时应该做到不分散用户的目标。

使用触觉设计

设计能够吸引用户触觉的界面可以让他们更熟悉物理世界。无论你如何在APP中制作触觉,以下指南都可以帮助你为人们提供充满凝聚力和吸引力的体验。

1、在触觉和触发器之间建立清晰的因果关系

理想情况下,用户应当知道你的APP为什么会播放触觉模式。如果一个触觉无法加强这种因果关系,那么它可能会让人感到困惑,而且似乎是无缘无故发生的。

2、使用触觉可以补充APP中的其他反馈

当APP中的视觉、听觉和触觉反馈协调一致 - 就像它们在物理世界中一样 - 这样的用户体验更加连贯,看起来更自然。

3、明智地使用触觉

例如:当触觉提供持久的价值时使用触觉模式;使用它们来增加新鲜感,会让你的APP看起来花哨。此外,可以在少量重要的、结果性的交互中添加触觉。

若为大量且琐碎的交互操作添加触觉的话,则会让人头晕目眩。

4、始终如一地使用触觉

触觉反馈的一致性有助于用户在某些触觉模式和某些体验之间建立触觉关联。

例如:如果你的APP在游戏角色未能完成任务时播放特定的触觉模式,用户则会学习将该触觉模式与否定的结果关联起来。如果你再使用相同的触觉模式来反馈获得肯定的结果,比如任务完成,那就会使用户感到困惑。

5、避免过度使用触觉

有时,触觉在偶尔体验时会感觉恰到好处,但在如果经常遇到让人烦恼。避免设计产生扩展和重复触觉反馈的体验。

通常情况下,最好的触觉体验应该是用户可能根本没有意识到的,但是当它被关闭时却会意识到。

6、一定要测试APP中的触觉

不同的人对触觉有不同的偏好和敏感程度,因此你需要尽可能找更多的人测试触觉。

7、使触觉成为可选的

如果用户愿意,让他们可以选择关闭触觉或者使触觉静音,并确保他们在没有触觉模式的情况下依然可以很好的享受你的APP。

8、在游戏APP中,可以考虑自定义触觉来增强玩家体验

除了在玩家与物品、控件互动时播放触觉,你可能会想在游戏中交流事件的时候播放触觉。例如:触觉可以增强实质性的体验 - 比如碰撞或打击或微妙的体验 - 就像是脚步声或迫在眉睫的危险。

9、留意播放触觉可能会影响其他用户体验

通过设计,触觉产生足够的物理力量,让用户感觉到设备的振动。确保触觉不会破坏涉及相机、陀螺仪或麦克风的用户体验。

创建自定义触觉模式

自定义的触觉模式可以表示诸如释放弹弓或在隆隆的带子上行驶的事物。自定义触觉模式也可以根据用户输入或上下文的变化而变化。

例如:当游戏角色从树上跳下时,玩家感觉到的冲击力可能比角色跳到位时要强。

在iOS 13及更高版本中,Core Haptics提供了两个生成自定义触觉模式的基本构建块:

瞬态事件,短暂、紧凑的体验,感觉像点击或脉冲,例如:在主屏幕上轻点手电筒按钮的体验

连续事件,感觉像是持续的振动,比如在信息中激光效应的体验。

无论你选择生成自定义触觉模式的构建块是什么,你都可以控制其清晰度和强度。你可以将锐度作为将触觉体验抽象为产生相应物理感觉波形的一种方式。指定清晰度可以让你将你的体验意图传递给系统。

例如:你可以使用锐度值来传达柔和、圆润或有机的体验,或者清晰、精确或机械的体验。正如该术语所暗示的,强度意味着触觉的强度。

结合瞬态和连续事件,改变清晰度和强度,以及可选的音频内容,你就可以创建各种不同的触觉体验。

九、近场通信(Near Field Communication)

近场通信(NFC)使得彼此相距几厘米的设备能够以无线方式交换信息。在支持的设备上运行的iOS应用程序,可以使用NFC扫描,从现实世界对象的电子标签中读取数据。

例如:用户可以扫描玩具以将其与视频游戏连接,购物者可以扫描店内标志以访问优惠券,或者零售员工可以扫描产品以跟踪库存。

APP内标签阅读

APP可以在其处于活动状态时启用单对象或多对象进行扫描,并在用户需要扫描某些内容时显示扫描表。

1、不要鼓励用户接触实物

要扫描标签,iOS设备必须离标签很近。它不需要实际接触标签。当需要用户扫描物体时,使用“扫描并保持靠近”这样的术语,而不是点击和触摸。

2、使用平易近人的术语

某些人可能不熟悉近场通信。为了使其更平易近人,请不要使用技术性,面向开发人员的术语,如NFC、核心NFC、近场通信和标签等。相反,请使用大多数人都能理解的友好的对话的术语。

3、为扫描表提供简洁的说明文字

在句子中提供一个完整的句子,结尾用标点符号。识别要扫描的对象,并为后续扫描适当修改文本。保持文本简短以避免截断。

后台标签阅读

后台标签阅读可以让用户在任何时候都可以快速扫描标签,而无需先打开APP开始扫描。在支持后台标签读取的设备上,系统会在屏幕亮起时自动查找附近兼容的标签。在检测到标签并将其与APP匹配后,系统会显示一个通知,用户可以点击通知将标签数据发送到APP进行处理。

请注意,当NFC扫描表可见、电子钱包或Apple Pay正在使用、摄像头正在使用、设备处于飞行模式且重启后设备被锁定时,后台读取将被禁用。

同时支持后台和APP内标签阅读

用户可能使用不支持后台标签读取的设备户,所以你的APP仍必须提供应用内扫描标记的方式。

十、撤销和重做(Undo and Redo)

许多APP允许用户摇动设备以撤消或重做某些操作,例如键入或删除。以这种方式启动时,警报会要求用户确认或取消删除,或重做操作。

1、简要而准确地描述要撤消或重做的操作

撤消和重做警示框的标题自动包含前缀“撤消”或“重做”(包括尾随空格)。你需要提供一到两个词用于描述撤消或重做的内容,以显示在此前缀之后。例如,你可以创建警报标题,例如“撤消名称”或“重做地址更改”。

2、当摇动手势用于呼出撤消和重做操作时,请不要将其用于其他操作,以免冲突

虽然你可以通过编程方式为摇晃手势赋予多种含义,但这可能让用户困惑,同时使你的APP无法预测。

3、谨慎提供撤消和重做按钮

当APP提供多种方法来执行相同的任务时,这会令人困惑。如果你的APP确实需要专门的撤消和重做按钮,请使用系统提供的图标并将它们放在预期的位置,例如导航栏。

4、仅在当前上下文中执行撤消和重做操作

“撤消”和“重做”应该对当前上下文产生明确而直接的影响,而不是更早的的上下文。

本系列主要是关于iPhone下的iOS设计规范,并未提供iPadOS相关的内容,想了解 Apple Pencil 以及 Drag Drop 部分的请参考原文。(原文链接:https://developer.apple.com/design/human-interface-guidelines/ios/user-interaction/undo-and-redo/)

你可能感兴趣的:(iOS平台设计规范(三)交互)