iOS 10 人机交互指南_第二章 Interaction

https://developer.apple.com/ios/human-interface-guidelines/interaction/3d-touch/

1. 3D Touch 

为触摸屏操作提供了另外一种维度。用户的学习成本比较低,只需要轻轻对屏幕用力,即可获得一个反馈。

3D touch的主要应用场景:

1). Home screen,用力按压App->action view

2). peek and pop, 3D touch 图片后可预览(peek),松开即可完全打开(pop)。设计peek时需要遵循的原则:https://developer.apple.com/ios/human-interface-guidelines/interaction/3d-touch/

3). Live photos,用力按压live photo,照片就开始动

2. Accessibility, 易用性

兼顾障碍人士或者正常人在某些不方便的时刻的使用场景:增加字幕、语音播报、文字链背景按钮、增加对比度;

3. Audio, 略过。主要是符合人们的期望。注意静音状态(人们期待全局静音)、调节音量(人们期望除调整除了电话铃声之外的所有声音)、耳机插拔时的声音状态(拔耳机时,声音播放自动暂停)

4. Authentication,授权

Ask users to authenticate only in exchange for value。用户在授权操作后,必须得到点什么东西。

尽量推后用户注册的时间点:Give them a chance to fall in love with your app before making a commitment to it.

索要授权时,展示授权所能获得的好处。给用户提供注册入口。

需要输入信息时,展示对应的键盘结构(输入邮箱时,展示有@的键盘)

5. 数据输入 Data Entry

如果可能的话,尽量用选择代替输入;尽量从系统提供默认数据;提供合理的默认值选项;按钮在全部信息输入完之前变灰;动态校验输入是否正确;选择列表需要以某种合理的顺序排序;有必要的话,输入框中展示灰字进行提示。

6. 反馈,feedback

反馈让用户知道App正在做什么,自己之后能做什么,以及行动之后的后果,

尽量无打扰的将用户提醒信息整合在主界面上;

避免不当的使用弹窗警告(弹窗警告的力度过高)

触觉反馈。iOS内置的系统级的UI元素(选择器、切换,滑动栏)自带触觉反馈。你也可以在开发过程中让系统生成对应的触觉反馈。注意不要过度使用触觉反馈。只对人的主动行为适用触觉反馈,不要乱用;不要混用不同强度的触觉反馈,注意一致性;和视觉、声音反馈一起使用,不要只提供单一渠道的反馈(设置里是可以禁用声音反馈或者触觉反馈的);注意多个反馈渠道的同步性和反馈的及时性,避免用户感知断层。

7. File Handling:iOS的信条是,尽量忽略文件系统

确保文件总是会被自动保存的(删除和取消的时候除外):通常不需要人们去主动进行保存,在编辑的间隙(关闭app、切换出app,退出编辑状态等)进行自动保存。有一种例外情况就是编辑现有文件,在最后让用户进行确认,是否保存改动。

自动同步到云端;文件选择界面要直观、高效率。图形化界面通常会效率更高,为了提高浏览速度,最小化文件图标,并单独提供一个新建文件的按钮。内置文件预览模式(quick look,https://developer.apple.com/ios/human-interface-guidelines/features/quick-look/);提供选择其他App打开文件的功能。

8.First launch Experience(初次打开App的体验)

要求:fast, fun and educational

提供launch screen以供初始内容加载,launch screen要低调,和第一屏之间的切换过渡要自然。

注意App加载时,手机是被横着拿还是竖着拿的。

尽量让用户尽快上手使用App(dive in),不要过渡展示教程、选项等内容。如果一定要展示操作教程,提供skip选项以让不需要的用户快速跳过。

在用户有可能卡住的地方提供指南。请注意,虽然操作指南是必要的,但他是设计缺位造成的记过。App设计要简洁、直观,如果一个App里的用户指南太多,重新审视App的设计。

让学习操作app的过程fun and discoverable, learning by doing.使用动画,将要教给用户的内容使用交互式的方式循序渐进地告诉用户,并且要关联上下文。

如果App初次启动时需要用户输入额外信息,先给予默认值让App先启动,后续再让有需要的用户去App设置里更改。

重新切换到App时,保持上次离开时的状态。

不要强迫用户给你的App打分,不要问的太快或者太频繁。给用户形成对你的App印象的时间。

不鼓励任何让用户重新启动的行为。

9. 手势 Gestures

1.点击(Tap)

点击作为最常用手势,用于按下或选择一个控件或条目(类似于普通的鼠标点击)、

2.拖动(Drag)

拖动用于实现一些页面的滚动,以及对控件的移动功能。

3.滑动(Flick)

滑动用于实现页面的快速滚动和翻页的功能。

4.横扫(Swipe)

横扫手势用于激活列表项的快捷操作菜单

5.双击(Double Tap)

双击放大并居中显示图片,或恢复原大小(如果当前已经放大)。同时,双击能够激活针对文字编辑菜单。

6.放大(Pinch open)

放大手势可以实现以下功能:打开订阅源,打开文章的详情。在照片查看的时候,放大手势也可实现放大图片的功能。

7.缩小(Pinch close)

缩小手势,可以实现与放大手势相反且对应的功能的功能:关闭订阅源退出到首页,关闭文章退出至索引页。在照片查看的时候,缩小手势也可实现缩小图片的功能。

8.长按(Touch &Hold)

在我的订阅页,长按订阅源将自动进入编辑模式,同时选中手指当前按下的订阅源。这时可直接拖动订阅源移动位置。

针对文字长按,将出现放大镜辅助功能。松开后,则出现编辑菜单。

针对图片长按,将出现编辑菜单。

9.摇晃(Shake)

摇晃手势,将出现撤销与重做菜单。主要是针对用户文本输入的。

尽量使用以上9种标准手势。不要修改标准手势所造成的效果。不要禁用系统级的手势(例如唤起控制中心)提供除了手势之外的补充方案(例如返回按钮)。某些App上,使用更多手势(游戏等比较复杂类型的App)

10. loading

当加载行为发生时,明确告诉用户;让加载画面尽量有趣;尽快展示内容。

11. Modality(模块化)

帮助人们聚焦在当前任务中,防止完成操作前去进行其他操作。地图中提醒打开定位功能的弹窗,编辑邮件的临时页面。https://developer.apple.com/ios/human-interface-guidelines/interaction/modality/

谨慎使用modality;提供明显并且安全的方式退出当前模块;模块里的内容不能过于复杂,Don’t create an app within your app.选择合适的modal样式,和主view切换要自然。

12. 导航

导航设计要很自然的支持App的结构,且不能刷存在感。

iOS有三种主要的导航结构:Hierarchical navigation(设置、邮件), flat navigation(music、App store), Content-driven or experience-driven navigation(game, books, immersive apps)

有些App是混用以上三种导航结构

13. 许可获取(Requesting  Permission)

只有在App明确需要获得该权限的时候才询问获取权限,并且向用户剪短、明确地解释为什么需要该权限(Don't let people feel pressured.)

14. 设置,Settings

允许用户在初始状态下使用App,并提供setting供用户额外调整设置。

尽量向系统询问信息而不是像用户询问信息;优化设置的结构;提供到达深层设置的快捷入口。

15. Terminology, 术语

说人话,使用目标人群看得懂的文字和词。界面上的信息呈现要保持简洁、有效率。避免加入人称(our tutorial, my workourts)

偶尔使用缩略词。如果涉及到日期,尽量不要用今天、明天,告诉用户准确的时间。

16. Undo and Redo

如果用户通过shake出发undo, redo,弹窗提示用户。如果shake有这个功能,不要让shake再触发其他功能。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,670评论 5 460
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,928评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,926评论 0 320
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,238评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,112评论 4 356
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,138评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,545评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,232评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,496评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,596评论 2 310
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,369评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,226评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,600评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,906评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,185评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,516评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,721评论 2 335

推荐阅读更多精彩内容