《iOS 7 Human Interface Guidelines中文版》读书笔记(1)

来源:互联网 发布:linux syslink命令 编辑:程序博客网 时间:2024/05/16 09:14

新浪微博:东门兜

这个是官网:iOS Human Interface Guidelines

为iOS而设计

(1)充分利用整个屏幕。
(2)尽量减少视觉修饰和拟物化的使用,UI面板、渐变和阴影有时会让UI元素显得很厚重。
(3)尝试使用半透明底板。

(1)大量留白。空白让重要内容和功能显得更加醒目。此外,空白可以传达一种平静和安宁的视觉感受,它可以使一个app看起来更加聚焦和高效。(我非常赞成这一点,背景使用纯白色或者是纯黑色,这样会让内容更聚焦。网龙公司的99U使用的是丑不拉几的绿色,我一直在吐槽这一点,但没有人愿意去注意。)
(2)保持一种这种主题色,比如在记事本中使用黄色。
(3)采用iOS自带的字体,使阅读时文本清晰易读。
(4)使用无边框的按钮。

(1)主屏幕上方的半透明背景浮层来区分文件夹和其余部分的内容。
(2)备忘录的其他条目在屏幕底部的其他分层上。
(3)日历有较深的层级,当翻阅年、月、日的时候,以及增强的交互动画给用户一种层级纵深感。

iOS应用解析

UI组件大致分成以下4种大类:
(1)Bars:包含了导航信息,告诉用户他们所在的位置并一些能帮助浏览或启动某些操作的控制按钮。(也称为菜单吧)
(2)内容视图:包含了app的主体内容以及某些操作行为,比如滚动、插入、删除、排序等等。
(3)控制按钮:展示信息或者控制动作。
(4)临时视图(对话窗口):短时间出现,给用户重要信息或者额外的选择或者其他功能。

即时启动

(1)启动时间要尽可能短,并且呈现一些对用户有帮助的内容。
(2)尽量不要让用户安装完应用后重启;如果你的应用将使用存储空间,或者不重启就无法流程运行时,你必须声明这些问题。
(3)尽可能避免使用背景或者其他启动体验。用户能够在启动后立即开始使用软件是最好不过的。

避免让用户做过多设置。
(1)聚焦在满80%的用户需求上。这样主体用户群就无需设置各种选项。
(2)尽可能用其他方式获取更多(用户)信息。如果能从系统获取的信息就直接从系统获取。
(3)如果你必须获取设置信息,在你的应用中直接向用户询问,然后尽快保存这些设定(权限许可,比如能否访问照片或者日历或地理位置信息等等)。

(1)尽可能让用户晚一点登录。(有些应用会设置游客用户,是个不错的解决方案。)如果用户在熟悉你的app之前就被强迫需要登录,那么启动流程就会变得拖沓繁琐。
(2)一般来说,按照屏幕默认的定向方式启动你的app。
(3)可以准备一张与app首页看上去一样的背景图。
(4)如果可能,不要让用户在初次启动应用时阅读免责声明或者确认用户协议。你可以直接在app store展示这些内容。
(5)在应用重启后,需要恢复到用户退出使用时的状态。

时刻准备好停止

(1)当用户切换app时,应该随时并尽快保存用户信息。因为在后台的应用随时有可能被终止或退出。
(2)当程序停止的时候尽可能在细节层面保存当前状态,使用户可以在回到应用时能从中断之处继续使用。例如,在使用可滚动的数据列表时,退出后保存列表所在的位置。
(3)不要强制让app退出,因为这样会让用户误以为是程序崩溃。有两个建议:
[1]使用吸引注意的屏幕内容(如红色字体)描述出现的问题并给出建议的方案。可让用户了解到app本身没有问题。
[2]如果只是某些app功能无法使用,可以在用户使用这些功能时弹出一个对话窗口告诉他们当前的情况。

布局

布局远比UI组件的样式重要。布局能让你向用户展示什么是最重要的,他们是如何选择的,内容是如何相关的。
(1)让用户尽可能容易地处理内容交互并控制好每个控件的间距。需要点击的控件大小至少要有44 * 44像素。
(2)通过平衡重要内容或者功能,让用户专注于主要任务之上。将重要的组件放置与屏幕上半部分是最常见的方法之一 —— 同时也要遵循从左到右的原则 —— 放置在靠左侧的屏幕上。
(3)利用视觉重心和平衡向用户展示屏幕元素之间的相对重要性。相比尺寸较小的元素,那些大尺寸的元素更吸引目光。
(4)一般来说,避免你的UI不一致。尽可能地让用相似功能的组件有相似的外观。(统一)
(5)确保默认大小的内容(文字、图片)用户能够看清楚。比方说,不要让用户滚动屏幕来阅读(屏幕以外的部分)文本或者无需通过放大操作来看清图像。

导航

三种主要的导航样式:
(1)层级式:1界面有一个表格组件,单击单元格到达2界面,2界面有一个表格组件,单击单元格到达3界面……
(2)扁平式:底部tabbar,菜单。
(3)内容/体验主导式:网状式,用于Apple watch、游戏。

(1)最重要的是用户所体验的内容必须被有逻辑的、可预测并易于遵循的呈现在你的app中。用户始终需要很清楚他们在哪里,并且如何到他们想去的地方。
(2)最好是给用户以唯一的路径前往每个页面。(看看网龙99U的设计,你就会知道,有些页面都奇葩的有多个入口,我可没说个人主页。)

模态

模态视图举例:对话框、键盘视图、分享菜单。
何时使用模态?
(1)必须引起用户关注的时候。
(2)某个任务必须被完成,或者明确放弃,以避免在模棱两可的状态下遗漏用户信息(操作)。

(1)保持模态任务简单,简短并且高度聚焦。(我想起当时在网龙做的北师大人人通,那时候的问答模块的提问功能,我设计的时候是在新页面展示,而主策划却说用提示框的方式。那时候应该反驳他,后来他秋后算账了,说这个干嘛用提示框……)
(2)总是提供一个显眼并安全的方法用以退出模态任务(cancer按钮)
(3)保证对话框提供的信息都是必要的并可操作的。对话框是打断用户预期的,并且需要点击才会消失,所以让对话框所提示的信息必须是值得中断用户操作的,这对于用户体验来说很重要。
(4)尊重用户关于接收推送通知的选择。在设置页面,用户可以设置app是否接收推送。

交互性

(1)手势操作拉近了设备与用户之间的距离并提高他们的直接操纵感。
(2)app中经常使用的统一手势操作如下:点击、拖动、滑动、反向滑动呼出删除按钮、四指切换任务、双击放大缩小、捏掐放大缩小、长按编辑、摇晃撤销等。

(1)避免使用与常规手势操作含义不同的动作。
(2)避免创造与常规手势功能雷同的新手势。
(3)避免让用户用复杂手势完成某种任务。手势操作务必保存简单,直接。
(4)避免创造新的手势,除了在游戏中。
(5)对iPad来说,尝试使用多指手势。iPad较大的屏幕给多指操作带来空间。虽然并不是每款app都需要复杂手势,但复杂手势可以丰富用户体验,比如多人同乐的游戏等等。

反馈能帮助用户理解

(1)iOS用户习惯于得到反馈。帮助他们知道app正在做什么,下一步可以做什么,并了解他们的操作结果。
(2)避免不必要的对话框。刚才提到过。

输入过程需要简易

(1)让用户更容易做出选择。使用选择器或表格视图替代输入。
(2)尽可能利用iOS获取信息。用户存储了很多信息在他们的设备中,你可以使用,但前提是获取用户许可。
(3)在输入和回报上做出平衡。(在输入后)给出反馈或回报,让用户感觉到他们的行为有价值。

术语和措辞

(1)使用术语时确保用户能理解。针对用户群使用语言。
(2)可以使用非正式的友好语气,避免太正式又不能太虚假或低三下四。请记住,用户在使用过程中会反复阅读文本,所以有些起初看上去很乖巧的语句多看几次就有可能让人厌烦。(的确~)
(3)当你的UI文本简短直接,用户可以快速轻松地理解。
(4)给按钮短标签或者易于理解的图标,用户可以一目了然的知道该做什么。(Don’t Make Me Thinking)
(5)描述时间的时候注意要准确。特别是关于时差方面。

你的应用在App Store应该注意什么:
(1)修正所有的拼写、语法和标点符号错误。虽然这些小错误不影响使用,但是会给人带来负面影响。
(2)尽量少地使用全大写的词汇。全大写的段落不适合阅读。
(3)可以描述bug修复情况。如果您的app新版包含用户一直期待的bug修复,那在你的软件描述中提到这一点就是个很好的做法。

动画

使用动画的好处:
(1)可以表示状态。(加载条的移动)
(2)增强直接操作的意图。(在iPhone主界面按住app图标的抖动行为)
(3)帮助人们可视化操作的结果。(删除单元格时的动画)

(1)如果在执行主要任务时,过分的、无明显作用的动画往往会分散用户注意力,也影响app的性能表现。
(2)尽量使用系统原生动画。
(3)在app中使用的动画效果要统一。使用统一的自定义动画很重要,这可以让用户在使用不同的app时累计经验。减少学习成本。
(4)动画尽量不要违反物理定律,但可以尽量真实一点。

排版必须保持清晰

(1)清晰是排版的第一要务。
(2)在你的app中只使用一种字体。

颜色可以增强沟通性

(1)尝试定义key color(主色调)。比如备忘录使用黄色用来表明交互和元素状态。
(2)颜色有代表性但人们对颜色的感知并不都相同。注意在不同国家和文化中产生禁忌。
(3)在大部分情况下,不要让颜色分散用户的注意力。颜色常常在不经意间带来增强效果。

App图标

每个app都需要一个漂亮的图标。每个人对图标都有先入为主的印象。关系到app的品质、目的和可靠性。
(1)app图标是app品牌形象很重要的部分。
(2)最好的应用程序图标应该是独一无二的,整洁的,打动人心的。
(3)一个好的app图标在每种尺寸和不同背景下看起来都应该合适。要特别注意小图标的不清晰。

其他图标

建议使用容易被用户理解的系统内置图标。

图形

(1)支持Retina显示屏。请确保提供两种规格的图片资源。(现在貌似是多种了。。。)
(2)显示照片或图片时不要超过原始尺寸的100%。
(3)不要使用带有苹果符号和版权的图片。

品牌

(1)巧妙自然(非强迫式)地融入品牌的颜色或图形。比如iOS7通过品牌主色调来表现app的互动性和选择状态。
(2)避免占用主要内容的空间来展示品牌信息。

使用标准UI元素

(1)尽量使用UIKit提供的标准UI元素。
(2)系统UI元素会自动更新,如果iOS有了新的设计。而自定义元素就不会被升级。
(3)使用系统UI元素对于用户来说没有学习成本。

(1)遵循每个UI元素的设计规范。
(2)大体来说,请避免创造自定义UI元素用于表现系统交互行为。
(3)不要用系统自带的按钮和图标表达其他含义。
(4)如果你的app是沉浸式体验,那么创造完全自定义的UI才有足够的意义。

对切换设备方向的响应

人们希望在各种方向都能使用iOS设备。
(1)不管设备处于什么方向,请聚焦于主要内容,这是最重要的。即使设备方向改变,聚焦的主题内容也应该不变。
(2)通常,要让app能够在不同屏幕方向下正常运作。

如果只能在某个方向使用,那么要注意:
(1)按默认支持的方向启动app,忽略设备当前朝向。
(2)避免在UI中告知用户需要调转设备方向。
(3)横屏或竖屏模式时,支持水平调转设备。支持设备调转180度。

(1)如果你的app将方向变化当成一种交互的手段,那你可以将方向响应针对app进行特殊处理。比如某些方向响应的游戏,可以让用户在进入主线任务前选择改变设备方向。
(2)在iPhone上,预测用户什么时候会需要旋转屏幕方向。比如用户浏览时,旋转方向是为了看到更多内容,这时候你要重新调整布局。
(3)在iPad上,尽量支持所有方向来达到用户期望。

iPad可以遵循:
(1)考虑改变显示辅助信息或功能的方式。比如邮件,账户和邮箱的不同排布。
(2)避免无意义的布局变化。比如iPad app在横屏时以网状形式展示图片,在竖屏时就完全没必要改成列表式。
(3)避免重新定义信息或文本的方向。对于文字内容来说,尽量保持相同的格式。这样可以避免用户在旋转屏幕时丢失文章定位;如果某些样式必须发生改变,使用动画来帮助用户感受到变化过程。
(4)为不同方向都准备一张独立的启动图片。

淡化文件和文档处理

iOS没有类似OS X系统中的Finder,不应该让用户考虑文件所在的位置。
(1)尽可能允许用户无需在电脑上打开iTunes就能管理文档。考虑使用iCloud帮助用户访问不同设备上的内容。
(2)给用户信心,他们的工作成果会被随时保存除非主动取消或者删除。提供“编辑”按钮点击后进入编辑状态,同时编辑按钮变成“保存”和“取消”按钮。

必要时提供可设置选项

(1)避免让用户去系统设置中寻找解决方案。
(2)如果有必要,让用户在你的app内进行设置。
(3)尽可能在主界面提供设置选项。如果用户只是偶尔用到的设置项,就将其放在独立的视图中。

总结:其实我的观点是,背景要么使用白色,要么使用黑色。如果背景比较重要的,还可以提供自定义背景,《在你身边,为你设计》也提到过,所谓“众口难调”。然后就是多多使用苹果自带的系统工具,我已经看惯了网龙三流策划经常自定义控件的习惯了(虽然图形不是他们设计的,但是是他们拍板的)。总之,每做一件事的时候,都要多想想,好不好看?好不好看!这么做会不会马上恶心到用户,然后就是一直这么做会不会恶心到用户!

0 0
原创粉丝点击