视觉设计理论:设计中的生理色差
整理这样一篇文章,不求甚解,主要是希望进一步理解最近项目中出现的问题。
公司的上层有美国人,对一些模板设计提出的质疑总感觉让人摸不着头脑。
刚开始只是认为是设计中出现的问题,修改后效果并不理想。
忽然想到会不会是眼睛颜色的不同造成的色差。
我想灰度的感知应该是一样的(后来证明是错的 ),而后会在某些特定情境下会因为眼球颜色而造成认知色差。
先精确生理概念。
眼睛的颜色是一种由超过一个基因所遗传的特征,对人类来说,目前已知3个基因座(Locus)上的基因与眼睛的色彩有关,分别是EYCL1、EYCL2与EYCL3。这些基因与人类眼睛颜色的表形有关(棕色、绿色与蓝色)。虽然过去曾经认为棕色眼睛为显性基因,蓝色眼睛为隐性基因。但是事实上两位蓝色眼睛的亲代却能够生下棕色眼睛的子代,显示眼睛色彩的决定并非遵循普通的孟德尔遗传法则,只是这种情形相当少见(大约1亿人之中才有1位)。必须全部四个基因同时决定相同的色彩,才能产生单纯的颜色,反之则出现混合的颜色,如蓝绿色。眼睛的色彩通常在婴儿出生后大约6个月趋于稳定。
上图为根据上述基因研究而推断的虹膜颜色形成原因,可见深棕、浅棕和灰色都是由黑色素的浓淡而引起,蓝色是因为散射而产生的色彩,而红色是因为白化而产生的色彩。当浅棕与蓝色混合,成为了绿色;而红色与蓝色混合,则成为了紫色。
下面我们采用图层20%透明叠加的方式做一系列色谱,以展示不同虹膜(咳咳,这是专业说法 )颜色下色彩的差异(忽略色谱、屏幕输出与所谓固有色之间的色差)。
原色谱
褐色
褐色是最常见的人类虹膜颜色。褐色虹膜含有大量黑色素,深褐色虹膜看起来像黑色。褐色虹膜被认为是人类虹膜的显性基因,但最近的研究认为这不一定正确。
淡褐色
淡褐色的眼睛是瑞利散射和中等程度的黑色素在虹膜前方膜层的组合所造成。淡褐色很难界定。它们被描述成浅褐色或黄褐色。有人认为淡褐色是褐色和蓝色虹膜的中间色。
琥珀色与黄色
琥珀色在其他动物上较为常见,它比棕色更浅,很少在人类出现,又被称为猫眼色。在欧洲比例多,或多是混血儿。
绿色
绿色虹膜是最罕见的颜色。在欧洲的凯尔特人、日耳曼人和斯拉夫人中比例较高;欧洲以外,一些普什图人、土耳其人也有绿色虹膜。
灰色
灰色被认为是蓝色虹膜的变种。是第二少见的颜色(仅次于绿色)。
蓝色
蓝色虹膜在欧洲比较常见,全世界约8%的人口有蓝色虹膜。北欧人如冰岛人、芬兰人和拉脱维亚人约80%以上为蓝色眼睛。
–total–
这样我们重点分析褐色虹膜与蓝色虹膜的色差。
褐色色谱相对于原色谱,灰度降低,紫色、红色、绿色部分增加,蓝色部分减少。
蓝色色谱相对于原色谱,灰度降低,紫色、蓝色、绿色部分增加,红色部分减少。
褐色色谱相对于蓝色色谱,整体明度偏高,饱和度偏高,红色、紫色偏多,蓝色绿色偏少。
要使蓝色色谱达到褐色色谱的程度,要提升整体明度、饱和度、对比度,增加蓝色,降低红色。
这样在现实产生的情况是,蓝色虹膜的人会偏好使用我们认为色彩灰度对比强烈的设计,对暖色反应迟钝。
所以我们看看国外的设计会产生眼前一亮的感觉也是在情理之中 。
除此之外,需要用心产品设计在不同人群中的适用微差。
–etc–
还想写写关于色盲对色彩的差别,有一点要明确——色盲不是病,色盲的人也可以做设计,并且可以做的很有特色,因为我之前就认识一个色盲设计师,哈哈。其中有很多方式可以实现与非色盲设计师、客户对于色彩的交流。
文章发出去后,很快收到了QUESTER的回复。
这个是科学的,但是并不等于是可行的解决方案。
通常来讲,没有经过训练的常人裸眼,不可能分辨出10%以下的色彩差异。
因此,在普通设计上追求校正眼球色偏差,不如多去考虑一下正常的途径:校正不同的屏幕显示颜色。
这才是比较靠谱的做法,也是实际运用中常常出问题的部分:
例如,绿色和紫色以及大部分的中间灰色,在每一台显示器上都会呈现出不太一样的状态,因此,才会有“安全色”的概念出现。
所以,你显示器上出现的灰色,有可能在你老板的显示器上是粉红色或者粉蓝色,都是说不准的事情。
因此,确认大家都在同一调校过的显示环境下工作,是视觉设计师应该熟悉的工作。
这里,Quester提供了更为广阔的思路。
- 统一显示效果。
- 设计使用安全色。
长话短说,人为参与的软硬件色彩校正,其实是平添了一个不稳定因素。
把大量的时间用来做兼容与测试是低效的,同时也会影响设计本身的质量。
统一显示设备才是正道。
—–Color-Blind——-
之前有计划写设计中的色盲原理与色彩关系,在搜索相关材料时,发现已经有几篇不错的文章了。
Web Accessibility之为色盲设计(一):他们是谁?
Web Accessibility之为色盲设计(二):检验设计的工具
How to Design Web Accessible Pages for the ColorBlind
这几篇文章是站在非色盲设计师的角度进行的色盲色彩设计。
对于概念的分析已经到位。
后面追记一些之前了解到有关色盲设计师对于设计的心得。
色盲色弱设计师是可以辨识灰阶的,但这对于设计是远远不够的。影响的原因有很多,不只是大家以为的颜色,还有光线、环境色、饱和度等等,加上色盲色弱的程度有分很多种,所以很难确定工具对于改善设计的程度。
虽然有Adobe Kuler、色盘工具、Color Code、PS纵使有很多工具可以帮助解读颜色,但所显示出来的东西,毕竟是数字,顶多了解到蓝色比较多、红色或绿色比较多之类的信息,RGB任何一个值多了多少少了多少,都会造成颜色上的差异,有时候往往差一点,就让整个配色变调了。就算经验再丰富,知道怎么运用色盘上的色码,但还是有另一个问题。
平常人不会用这些色码沟通,他们可能说”Medium Orchid”、”Steek blue”之类的,这边却也不会跟他解释说这是#AACC22,是的,知道这个颜色偏红、偏蓝,但有时候却无法说出这是什么确切的颜色。
有的时候秀出设计稿,客户或上面会跟说这个什么颜色改一下。其实设计者认为没有用这个颜色,然而事实上,真的用到了那个颜色,只是没有分辨出。这个时候这样的工具就是救星了。这些工具除了提示正确的色码,甚至可以是颜色的名字,这个时候就容易除掉颜色上的错误。
有了这个小工具再配合上其他工具,相信可以使色弱色盲设计师会有大大帮助。
虽然色盲色弱设计师的设计有时候会很痛苦(在我看来),但其实还是有自己主观的色彩感知,那是正常人所感受不到的。有的色盲设计者所设计出来的作品有其独特的色彩风格。