“IOS UI 文档” 之颜色篇

原文链接:https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/ColorImagesText.html#//apple_ref/doc/uid/TP40006556-CH58-SW1

Color Enhances Communication
色彩有助于增进沟通

在iOS系统中,颜色会用于表征交互,传递活性以及提供视觉连续性。内置的应用程序选择使用那些看起来更具个性的、纯粹、干净的颜色,并辅以或亮或暗的背景组合。
color_family_a_2x

如果你要创建多样的自定义颜色,要确保它们能够和谐共存。例如,如果你的应用的基本风格是柔和的色调,你就应该创建一个协调的柔和色调的色板用于整个应用。

注意在不同情境下的颜色对比。例如,如果在导航栏的背景与栏按钮标题之间没有足够的对比,按钮就会很难被用户看到。 依据经验的法则来说,需要区分的颜色必须至少存在50%的亮度差异。(我们)需要将设备置于不同的光照环境之中(包括晴朗的室外)来测试设备上的观感效果。

提示:一种发现需要更高对比度的区域的方法是降低UI的饱和度并在灰度模式下查看它。如果在灰度版本中你很难区分可交互与非可交互元素或背景等,你有可能需要增加这些元素之间的对比度。

当你使用自定义的栏颜色时,着重考虑半透明的栏和应用内容。当你需要创建能匹配特别颜色的栏颜色时(比如一个已有品牌中的颜色),可能在你获得你想要的结果之前,你需要用各种颜色进行实验。栏的显示将会同时受到iOS系统所提供的半透明栏与藏在栏后面的应用内容的呈现所影响。

API注释:使用浅色(TintColor)的属性值给予栏按钮颜色,使用栏浅色(BarTintColor)的属性值为栏本身赋色。

注意颜色的盲区。多数色盲的人很难区分红色与绿色。需要对你的应用进行测试以确保在其中你没有将红色与绿色作为区分两个不同状态或值的唯一方式,一些图像编辑软件或工具能够有效的帮你验证颜色的盲区。通常意义来说,使用多种方式来表征原色的交互性是非常好的(需要了解更多关于在iOS系统中表征交互性的信息,详见Interactive Elements Invite Touch)。

考虑选择一种基准色颜色来表征交互性与状态。在内置的应用中基准色有比如备忘录中的黄色与日历中的红色等。如果你定义一种用于表征交互和状态的基准色,要确保你的应用中的其他颜色不会与它发生冲突。

色彩可以向用户传达信息,但不一定会以你希望的方式。每个人眼中的色彩是不一样的,不同的文化为色彩赋予的意义也是不相同的。花时间来研究如何使用色彩才可能会被其他国家或者文化接受。你要尽可能确定应用中运用的色彩向用户传达了恰当的信息。

大多数情况下,不能让颜色喧宾夺主,让用户分心。除非色彩是应用的目的和本质所在,通常情况下色彩应该用来从细微细节之处提升用户体验。

IOS7发布后关于“扁平化”与“拟物化”的思考。

设计十诫的第一条和最后一条:

1、好的设计是创新的。
……
10、好的设计是极简的

IOS7的发布让“扁平化(Flat Design)”和“拟物化(Skeuomorphism)”的争论变得愈演愈烈,这比上次微软发布Metro 来的还要强烈。

为何IOS的改变会引起这样的争议?
我想这跟苹果公司一直以来作为的“拟物化”设计的的领军形象不无关系。我们可以回想,iphone发布时,将手机的物理拨号键以触屏软件的形式植入ios系统开始,或者从imac桌面那一个个跳动的水晶图标开始,再或者在ibook像翻开一本真实的图书一样来阅读,苹果公司一直在引领了“拟物化”设计的浪潮。而新发布的IOS7现在开始推动“扁平化设计”,这样颠覆性转变必然会引起大家的争议。

拟物化的优势是什么?
“当你应用中的可视化对象和操作按照现实世界中的对象与操作仿造,用户就能快速领会如何使用它。( iOS Human Interface Guidelines)” 也就是说以模拟实物的视觉设计和交互体验,让用户完全不用去抽象的理解就可以直观的认知和使用。
拟物化设计在视觉上有着很高的识别性,让原本抽象的产品形象变得具有亲和力,更加优雅,在使用上降低用户的学习门槛。

推荐我最喜欢的拟物化设计App:Paper by FiftyThree

拟物化的劣势是什么?
在追求拟物化设计的浪潮中,出现了另外一些的问题。
一、视觉设计:上面有说,拟物设计具有很高的识别性、质感、亲和力。
但是盲目的追求拟物化设计需要付出更高的开发成本,在移动设备的小尺寸屏幕里不能高效的利用的有限的空间。
二、移动设备上的平面操作毕竟与现实生活中有着巨大的区别,盲目的拟物有时候反而会对用户造成困惑。
三、既然拟物是一个模仿过程,这就限制了开发者的创新和想象间,产品容易臃肿且局限。

拟物与极简是矛盾的吗?
我不这么认为,苹果公司是一家崇尚极简主义的公司,在过去的一段时间里,苹果以优雅的拟物设计和极简的产品体验,真正的做到了简单而丰富,我的小外甥女拿到IPAD不需要教她就可以自己玩的不亦乐乎。

扁平化设计的优势和劣势
扁平化设计就是用最简单、最轻量级甚至抽象的方法来传达产品本身核心内容或功能,也就是说“扁平化设计”并不追求画面的质感、重量感、甚至产品的实际形态。优秀的扁平化设计给人感觉简洁、整齐、清晰,所有的功能一目了然,没有什么是多余的。因此“扁平化”可以更高效的利用空间,给用户最少的干扰去理解产品内容。

但是扁平化设计太过简洁,识别性极差,容易审美疲劳,缺少亲和力。最重要的是,抽象的表达提高了学习成本。举一个例子大家就明白:拟物化设计就像“象形文字”,全世界人不用学习都能猜出它所表达的大概意思,但是它的表达却非常模糊和局限,而扁平化设计就像抽象的现代文字,你必须通过学习才能理解它所表达的意思,但表达精确而丰富。(PS:我并不是说“拟物化设计”原始,而是举例说明他们之间直观的感受)

推荐我最喜欢的扁平化设计App: Any.do

为什么IOS7开始推动扁平化设计?

“It’s very easy to be different, but very difficult to be better(标新立异、与众不同,这很容易做到,但要做到比现有的更好,这很难。)”
——Jonathan Ive

我在本文开头所引用的设计十诫中的两条描述,在IOS7发布后似乎给人传达了这两个信息:创新、极简。
同时,我也有个猜想:Google glass已经公测,传说中的Apple iWatch也越来越近,电子产品似乎正在往穿戴市场发展。穿戴式的电子产品体积更小,屏幕空间有限,而扁平化设计恰恰能够更好的利用空间