点击上方蓝字关注 + 点击右上方“...”设为星标
首先给大家推荐一款软件 - 色盲模拟器Coblis。
为了方便大家了解色盲眼中你的设计稿是什么样子,大家可以把自己的设计上传来查看。是不是精心设计的区块确看不见了?所以说在设计稿中考虑色盲这一方向也是很有必要的~
颜色在视觉设计起着核心作用。但是,如果您的用户是色盲患者,该怎么办?根据色盲数据显示,色盲占到每12名男性中就有1名(8%)和200名女性中有1名(0.5%)。全世界估计有3亿色盲人,包括马克·扎克伯格,比尔·克林顿和威廉王子!
优化图形可以使其更易于被了解,但不包括从图表和图形中消除颜色。与普遍看法相反,超过99%的色盲人士可以看到颜色,只是与正常的人群看到的颜色不同而已。
在本文中,我们将分解色盲的不同类型及其在视觉设计方面的特殊注意事项。我们还将向您展示如何有效使用对色盲通用调色板,使您的图形可供更多人使用。
目录
什么是色盲?
色盲的3种类型是什么?
为什么颜色对数据可视化很重要
如何使用色盲友好调色板设计图表
重点
什么是色盲?
尽管色盲主要是遗传性疾病,但也可能是由于白内障或眼睛外伤以及许多疾病引起的,包括帕金森氏症,卡尔曼综合症和糖尿病。老化引起的视网膜损伤会另外导致色盲。
色盲的3种类型是什么?
色盲分为三种不同的类型:
红/绿色盲
根据 Colblindor 的说法,所有色盲人群中有99%患有红色/绿色色盲。这又分为两个不同的类别:
红色盲:也称为“红色弱点”,患有这种红/绿盲现象的人无法感知红光
左:正常视力,右:红色盲
红色盲色谱图看起来像这样:
绿色盲/绿色弱 绿色弱 绿色盲
左:正常视力,右:绿色盲
绿色盲色谱看起来像这样:
红色/绿色色盲是遗传性的,对男性的影响大于对女性的影响。其原因是因为 DNA 的 X染色体异常所致。
因为女性有两个X染色体,所以其中一个的任何缺陷通常都会由另一个弥补。但是,男人只有一个X染色体,并没有“备用”可依。
蓝/黄色盲
患有蓝/黄色盲的人很难区分蓝色和黄色。由于Tritanopia并不是由与X染色体相关的遗传特征引起的,因此男女均有可能存在。 Tritanopia)
左:正常视力,右:蓝/黄色盲
蓝/黄色盲色谱看起来像这样:
完全色盲
单色
为什么颜色在数据可视化中如此重要
颜色在视觉设计中起着重要作用。对于初学者而言,颜色用于突出显示重要信息,以及说明各种类型的元素之间的关系。知道如何选择颜色很重要,但是当您针对交互性进行优化时,除了颜色理论和组成之外,还有更多需要考虑的问题。
如何使用色盲通用调色板设计图表
使用对色盲友好的调色板并不是您需要在视觉效果上折衷或直接去除所有颜色。通过提前计划,您可以确保色盲调色板可以完美地完成您的设计。
如果设计的颜色并不特别适合色盲人群,并且交互性很重要的话,则最好在投入大量时间和精力进行设计之前就找出这些颜色。
如果您不确定从哪里开始,这些色盲色轮可以作为确定颜色在不同色盲之间转换的有用参考:
还有我们组合了一些通用的色盲调色板:
事先计划颜色方案的另一个原因是,您可以避免使用有问题的颜色组合,其中某些颜色组合可能会使色盲人无法完全使用图表或图表。
避免色盲人士使用的颜色组合包括:
红——绿
绿——棕
绿——蓝
蓝——灰
蓝——紫
绿——灰
绿——黑
如果您纠结设计中必须使用这些组合时,请尝试调整阴影,其中一种颜色非常暗,而另一种颜色非常亮——大多数色盲人员都可以分辨对比度。
如上所述,对于大多数色盲的人来说,分辨对比度不是问题。分别使颜色变暗和变亮,使对比度更加明显。您还可以使用不同的色调以及亮度和饱和度级别进行优化。
在设计中使用图案和纹理是一种将视觉元素合并到设计中(不依赖颜色)的好方法,与此同时符号和图标是使设计更易于交互的好方法,因为它们可以在不依赖颜色的情况下直观地插入信息。
由于色盲具备区分不同阴影的能力,因此可以考虑使图表单色。
在设计可访问性时,重要的是要使您的信息图尽可能简单。无论您的用户是否有色盲,采用简约的方式将确保您的设计更容易理解。
使用色盲通用调色板的关键要点
为易受色盲影响的人群优化信息图表对于交互性和包容性都很重要。也可以在不影响视觉品质的情况下进行操作。
以下措施可以确保色盲人士真正能够参与您的设计:
选择色盲通用调色板
避免出现有问题的颜色组合
使用不同的纹理和图案突出显示重要信息,而不仅仅是颜色
使用符号和图标补充彩色编码的消息
使用高对比度的颜色组合
采用简约设计有助于不必要的混乱。
将所有这些元素组合在一起将有助于使色盲人群更容易与您的设计进行交互。
作者:RACHEL CRAVIT
喜欢我们的童鞋可以关注我们
● 微 信 公 众 号 ●
— 来自PxCook 官方团队 ,专注多年设计研发
效率协作工具