【读书笔记】ios10人机界面指南1

第一章-设计原则与基本要素

1、设计原则

以下三大设计原则,使得ios主题区设计区别于其他平台:

清晰Clarity:(ios构建的)系统中,文字的每一个字号都是清晰的,图表式精确和情晰的,装饰都是微妙和适当

依从Deference:(设计)流畅的动效和清新漂亮界面的目的,是帮助人们理解程序的内容,而不应该干扰用户的使用。内容通常充满整个屏幕,而半透明盒模糊尝尝暗示有更多的内容。尽量少的使用边框,渐变和阴影,来保持界面的亮度和通透感,这样能突显内容的重要性。

深度Depth:使用鲜明的视觉层级和真实的运动效果,来传达层次的感觉,赋予界面活力,并促进用户的理解

在思考你app的一致性时,你需要遵循以下几点原则,来保证最大限度的影响你的app:

审美的完整性Aesthetic Integrith:使用不易察觉且引人注目的图形、标准华的控件和可预知的交互行为从而让用户保持专注

直接操作Driect Manipulation

隐喻Metaphors

一致性Consisency

反馈Feedback

用户控制

2、ios10更新

在搜索屏幕和主屏幕上的小部件

与Siri整合

与Messages的联动

可拓展的通知栏

3、界面基本元素

栏Bars:告知用户现在应用在哪里,提供导航,而且还可能包含按钮活着其它用来出发功能和交流信息的元素。

状态栏:透明的、一般情况下都会存在在屏幕顶部,除非一些沉浸式游戏活着工具会把工具栏隐藏

不要创建自定义状体啊栏

避免滚动内容直接透过状态栏显示

使用导航控制器来展示内容

在状态栏后面放一个低调的、不会抢走用户注意力的自定义徒刑-比如一道渐变色

让内容固定在导航栏区域外显示(这个区域由应用的statusBarFrame属性来定义)

避免在状态栏后面叠加分散注意力的内容

隐藏状态栏时请谨慎

在用户全屏观看媒体时,请考虑隐藏状态栏以及所有页面UI

为你的应用选择配色协调的状态栏颜色

在适当的时候展示网络活动指示器(network activity indicator)

工具栏:放置着用于操作当前屏幕中各对象的控件。半透明,在iphone上工具栏始终位于屏幕底部;在ipad上则可能出现在顶部;键盘唤起、使用手势、或者当视图变为竖屏情况下,工具栏可以隐藏


【读书笔记】ios10人机界面指南1_第1张图片

在工具栏里放置用户在当前情景下最常用的指令

可以在工具栏里放置分段控件以方便用户快速切换当前内容的不同视图或模式

如果需要在工具栏上展示3个以上的项目,可以使用图标

保证工具栏文字按钮之间有足够的间距

系统提供的工具栏与导航标准按钮

【读书笔记】ios10人机界面指南1_第2张图片

导航栏:

半透明,通畅位于屏幕上方,状态栏下方。

当键盘被唤起、用户使用手势、活着当前视图变为竖屏的情况下,导航栏可以隐藏。

你可以用导航栏在不同视图间提供导航,或在上面放置管理当前视图内容的相关控件。

使用当前视图的标题座位导航栏标题

考虑在应用最高层级的导航栏中放置一个分段控件

即使控件充足,也应当避免让过多的控件填满你的导航栏

确保文字按钮之间拥有足够的控件

确保你自定义的导航栏在你的应用的每个视图中都有一致的外观与体验

确保你自定义反悔按钮的外观与操作仍然像一个返回按钮

在用户需要专注于内容的时候,可以考虑隐藏导航栏 


标签栏:标签栏是整个产品信息架构最为直观的体现

标签栏让用户在不同的字任务、视图和模式中进行切换


【读书笔记】ios10人机界面指南1_第3张图片

是半透明的

始终出现在屏幕底部

一个标签栏一次最多承载5个标签(多余5个标签的时候,可以展示前4个标签和一个“更多”,并将其她的标签以列表形式收纳到更多里面)在横屏与竖屏情况下,高度均保持一致

可以在标签上加上红底白字,显示数字活着省略号的小气泡以展示特定的应用信息

一般而言,使用标签栏来组织整个应用层面的信息架构

不要使用标签来让用户执行对于当前应用与屏幕内容的操作

即使标签当前不可用,也不要把它从标签中删除

考虑在tab上加入红色小气派以低调的传达信息

请根据控件的标准含义来选择系统提供的图标

在横屏视图中,你可能会对分视图或者浮出层内使用标签栏以切换或筛选视图中的内容

避免让过多的标签填满你的标签栏

尽可能低在横屏与竖屏情况下都展示相同数量的标签


【读书笔记】ios10人机界面指南1_第4张图片
 

搜索栏:

【读书笔记】ios10人机界面指南1_第5张图片

占位符文本(Placeholder text)

书签按钮(TheBookmarks button)


结果列表图表(The results list icon )


提示(Prompt)


【读书笔记】ios10人机界面指南1_第6张图片


内容视图Content Views:包含用户在应用内最关注的欣喜,例如文本、图形、动画和交互元素。例如滚动、插入、删除和排列之类的行为

临时视图Temporary Views:包含用户在应用内操作信息时的欣喜处理视图,比如模态视图

控件Controls:出发功能和传递信息。控件包括按钮、开关、输入框和进度指示器

第二章-交互

1、3DTouch

主屏交互(Home Screen Interaction)

Peek(轻压) and Pop(重压)

使用轻压去提供一个丰富、生动的预览

设计足够大的轻压视图

保证Peek和Pop使用功能的统一性

允许每一个Peek都可以Pop

尽量避免在轻压视图里面显示和按钮一样的元素

对于同一个部件,不要既具备轻压又允许编辑菜单两个功能

在适当的时候提供操作按钮

避免为打开被轻压的项目提供操作按钮

不要让Peek成为程序或者部件的唯一出发形式

现场照片(Live Photos)

2无障碍设计Accessibility

ios为特殊用户提供很广泛的可接入性,如丧失视觉、听觉、或者其它类型的能力丧失的用户。

为图片,图标,界面元素提供可供选择使用的文本标签。

对可访问性偏好设置有响应

使用辅助功能测试您的应用程序

包含隐藏字幕和音频说明

3、音频audio

静音

音量

耳机

在必要时自动调整级别,但不调整整体音量

在适当时允许重新布置音频

使用系统提供的音量视图允许音频调整

使用系统的声音服务获得短暂的声音和振动

如果声音对您的应用程序至关重要,请对音频进行分类

在发生中断后适时灰度音频播放

让其他应用程序知道您的应用程序何时完成播放暂时音讯

仅在有意义时才响应音频控制

请勿重新调整音频空间的用途

4、身份认证Authentication

尽可能延迟登录

说明身份验证的好处以及如何注册您的服务

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

5、数据输入

如有可能,请提供选择

尽可能从系统获取信息

提供合理的默认值

仅在手机所需值后启用提升

动态炎症字段值

仅在必要时需要字段值

轻松浏览值列表

在文本字段中显示提示帮助沟通目的

6、反馈(重要、重要、重要)Feedback

不引人注目地将状态和其他类型的反馈集成到您的界面中

避免不必要的快讯

触觉反馈

谨慎使用触觉

不要重新定义反馈类型

微调触觉的视觉体验

不要依赖单一的沟通方式

视觉反馈啃呢个被遮挡时使用触觉

在启动反馈之前准备系统

同步触觉与伴音

7、文件处理Flie Handing

让用户相信除非主动取消或删除

不提供创建纯本地文件的选项

设计一个直观并且图像化的文件浏览界面

让用户在你的应用内就能预览文件

合适时,与其它应用共享文件

8、首次登录体验First Launch Exprience

提供启动画面

启动画面说明

淡化发射

选择合适的方向启动

预期需要帮助

坚持教程中的几本要素

让学习更有趣,更容易发现

请避免先询问设置信息

避免显示应用内许可协议和免责声明

在应用程式重新启动时恢复上一个状态

不要让瀛湖对您的应用程式评分过快或过于频繁

不鼓励重新启动

9、手势Gestures

点击(Tap)激活控件或选择项目

拖拽(Drag)从一侧到另一侧移动元素或在屏幕上拖动元素

轻扫(Flick)快速滚动或评移

滑动(Swipe)当用一个手指之行时,返回到上一个屏幕,显示分割视图控制器中的隐藏视图,显示表视图行中的删除按钮,活着显示偷看的动作。当在ipad上用四个手指执行时,在应用程序之间切换

双击(Double tap)放大并居中内容或图片,或缩小

捏(Pinch)向外夹点时放大,向内夹点时缩小

触摸并按住(Touch and hold)在可编辑活着可选文本中执行时,显示光标定位的放大视图

摇(Shake)启动撤销或重做

作为一般规则,使用标准手势

不要阻止全系统手势

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

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

使用多手指来增强某些应用体验

10、加载Loading Experience

明确加载状态

教育或娱乐人们掩饰载入时间

自定义家在屏幕

尽快显示内容

11、模态Modality View

尽量减少使用模态

提供一种明显而安全的方式退出模态任务

保持模态任务简单、简短、狭窄

显示标识任务的表态

预定用于提供必要和理想的课操作信息的提醒

尊重通知偏好设定

不要在弹出框上显示模态视图

使用您的应用协调模态视图外观

选择适当的模态视图样式

选择适当的过渡样式以显示模态视图

12、导航Naxigation

分层导航

在每一个画面上选择一个选项,直到达到目的地。要去另一个目的地,你必须回溯你的步骤或从头开始,做出不同的选择。设置和邮件使用此导航样式。

平面导航

在多个类别之间切换。音乐和App Store使用此导航样式。

内容驱动或体验驱动的导航

在内容中自由移动,活内容本身定义导航。游戏、书籍和其他身临其境的应用通畅用此导航样式

始终提供清晰的路径

设计一个信息结构,使其能够快速方便地访问内容

使用触摸手势创建流畅性

使用标准导航组件

使用导航栏遍历数据层次结构

使用标签栏显示哪痛或功能的对等类别

当您有多个相同类型内容的网页时,请使用网页控制

13、请求许可Requesting Permission

只有在您的应用程序需要时才请求个人资料

解释为什么您的应用需要信息,如果它不明显

只要在您的应用能逗正常运行时,才能在启动请求权限

请勿不必要地请求位置信息

14、设置Settings

推断您可以从系统中获得什么

在应用程序中慎重设定选项的优先顺序

在适当时为设置提供快捷方式

15、措辞Terminology

使用熟悉,易懂的字词和词组

保持界面文字清晰简洁

避免啃呢个听起来令人讨厌的语言

努力寻求非正式,友好的语气

使用幽默时要小心

使用相关且一致的语言和图像

请准备参考日期

适当地识别互动元素

16、撤销和重做Undo and Redo

简要而精确地描述要撤销或重做的操作

如果您使用摇动手势进行撤销和重做,请不要将其用于其他操作

谨慎提供撤销和重做的按钮

仅在当前上下文中执行撤销和重做的操作

你可能感兴趣的:(【读书笔记】ios10人机界面指南1)