也许以上的分析还是太抽象，为了更直观的看到色盲人士眼中的颜色，下面介绍几种模拟色盲色觉的工具，方便设计师们设计和检验：
Adobe 自带的校样设置
Photoshop CS4和Illustrator CS4及以上版本提供了模拟红色盲和绿色盲的校样设置，对于每天都在Photoshop/Illustrator中拼搏的视觉设计师来说，这是最简便的一种方法了。选择“视图—校样设置—红色盲型/绿色盲型”
Color Oracle：http://colororacle.org/
网站Color Blind Web Page Filter：http://colorfilter.wickline.org/
二. 设计解决方案
设计面向色盲人士友好的信息图形，并不意味着要设计师要放弃使用色彩这种“利器”。即便是对色觉障碍的人士来说，颜色依然是区分不同类数据的一种简单快速的表现形式。要提高信息图形的识别性和易读性，我们可以遵循这样几个思路寻找解决方案：（1）不完全依赖颜色来区分信息，同时使用多种视觉变量来编码信息；（2）选择安全的配色方案；（3）使用文字注解。
1. 冗余编码
避免仅使用颜色来编码信息，应尽量同时使用多种视觉变量（如形状+颜色、尺寸+颜色、注释+颜色）来对信息编码。其中，形状包括了这样一些可使用的元素：圆形、三角形、矩形等；实线、虚线、点线等；字母、数字符号等。这里需遵循的一个原则是：使用尽可能少的颜色——结合使用不同形状符号和少量鲜艳的颜色，效果远好于只使用一种形状和多种颜色。
2. 选择适当的配色
针对色盲人士的颜色识别能力，需要精心选择配色，才能避免选择容易混淆的色区。然而，要使配色能覆盖到各种色觉辨认能力的人（包括色盲、色弱和色觉正常的人群）并不是一件容易的事
，尤其同一界面需要出现多种颜色时，让设计师非常头疼。日本有研究得出一组无障碍配色建议，在此分享，供大家参考。这组颜色针对色盲和非色盲人士都是易辨识的（例如它选择了朱红色代替红色，蓝绿色代替绿色，紫红色代替紫色，以减少色盲人士的困扰），它对屏显和印刷都适用，并
且所有颜色的名称也容易定义。
需要注意的是，从以上配色组中选取颜色时：A. 请交替使用暖色和冷色；B. 当使用多个暖色和多个冷色时，在明度和饱和度上做出区别； C. 避免同时使用低饱和度和低明度的组合。
另外分享两个配色工具，它们都提供了针对色盲人士配色的选项，可以辅助大家进行配色： 网站CONT RAST-A-WEB V2.0 http://www.dasplankton.de/ContrastA/（打开“show colordeficiency simulation”面板）
地图配色工具COLOR BREWER 2.0 http://colorbrewer2.org/（勾选“colorblind safe”选项）
三、举例
下面以几种常用信息图形为例，来说明如何为色盲用户优化信息图：
1) 点状图
优化采用了这样一些手段：A. 调整配色，将色盲人士容易混淆的红、绿、橙色换为红、蓝、黄色。B. 调整明度，使图中几个颜色在明度上差异更明显。C. 为不同元素赋予不同形状。所有使用点元素的信息图，都可以参考这种解决方式。
2) 折线图
优化采用了这样一些手段：A. 采用更粗的线条，使颜色更明显。（色块越小，颜色越难分辨。对有色觉障碍的人来说，带颜色的细线、小图标、细体文字尤其难区分。）B. 换用不同形状的线条（实线、虚线、点线）。C. 文字直接注释在线的周围。D. 颜色微调。这样对每一类数据使用多重可视化变量进行编码后，即便颜色信息完全丢失，也能够完整的传递信息。所有使用线元素的信息图，都可以参考这种解决方式。
3) 柱状图
通过增加底纹，直接标注文字注释的方式优化了柱状图。所有使用面的图形（如饼图），都可以参考这种解决方式。
四. 写在最后
在实际设计过程中，我们不一定会同时使用到以上所有手段，需要在美观和友好之间进行权衡。我们也可以采用一些交互手段，避免同一界面中元素太多太过杂乱的问题。如highcharts 这个趋势图非常优秀，它采用了易辨识的颜色，每个节点处都使用了不同形状的符号，然而仅当鼠标hover 到具体节点时，会出现该条线对应的信息（“New York”）。
另外除了鼠标hover 的交互方式以外，我们甚至也可以为色盲人士提供单独的色盲模式切换，这样也可以兼顾视觉上的美观，避免了太多信息的干扰。这种形式在游戏和软件中也有先例。例如iChat ，一般情况下仅有不同颜色来区别用户的在线状态，但同时，它也提供了“User shapes toindicate status”选项，可以将“空闲”状态换成橙黄色三角形符号，将“忙”状态换成红色方形符号表示。
参考资料：
We are colorblind http://wearecolorblind.com/
Designing For, and As, a Color-Blind Person http://webdesign.tutsplus.com/articles/design-theory/designing-for-and-as-a-color-blind-person/
Color Universal Design (CUD)- How to make figures and presentations that are friendly toColorblind people http://jfly.iam.u-tokyo.ac.jp/color/
Designing maps for the colour-vision impaired http://colororacle.org/design.html
设计同理心——关注色盲人群http://lovelyrosa.blogbus.com/logs/54856107.html
Web Accessibility之为色盲设计http://www.2beusable.com/web-accessibility-1-what-is-color-blindness.html
(本文出自Tencent CDC Blog，转载时请注明出处)
人人都是产品经理（woshipm.com ）中国最大最活跃的产品经理学习、交流、分享平台
也许以上的分析还是太抽象，为了更直观的看到色盲人士眼中的颜色，下面介绍几种模拟色盲色觉的工具，方便设计师们设计和检验：
Adobe 自带的校样设置
Photoshop CS4和Illustrator CS4及以上版本提供了模拟红色盲和绿色盲的校样设置，对于每天都在Photoshop/Illustrator中拼搏的视觉设计师来说，这是最简便的一种方法了。选择“视图—校样设置—红色盲型/绿色盲型”
Color Oracle：http://colororacle.org/
网站Color Blind Web Page Filter：http://colorfilter.wickline.org/
二. 设计解决方案
设计面向色盲人士友好的信息图形，并不意味着要设计师要放弃使用色彩这种“利器”。即便是对色觉障碍的人士来说，颜色依然是区分不同类数据的一种简单快速的表现形式。要提高信息图形的识别性和易读性，我们可以遵循这样几个思路寻找解决方案：（1）不完全依赖颜色来区分信息，同时使用多种视觉变量来编码信息；（2）选择安全的配色方案；（3）使用文字注解。
1. 冗余编码
避免仅使用颜色来编码信息，应尽量同时使用多种视觉变量（如形状+颜色、尺寸+颜色、注释+颜色）来对信息编码。其中，形状包括了这样一些可使用的元素：圆形、三角形、矩形等；实线、虚线、点线等；字母、数字符号等。这里需遵循的一个原则是：使用尽可能少的颜色——结合使用不同形状符号和少量鲜艳的颜色，效果远好于只使用一种形状和多种颜色。
2. 选择适当的配色
针对色盲人士的颜色识别能力，需要精心选择配色，才能避免选择容易混淆的色区。然而，要使配色能覆盖到各种色觉辨认能力的人（包括色盲、色弱和色觉正常的人群）并不是一件容易的事
，尤其同一界面需要出现多种颜色时，让设计师非常头疼。日本有研究得出一组无障碍配色建议，在此分享，供大家参考。这组颜色针对色盲和非色盲人士都是易辨识的（例如它选择了朱红色代替红色，蓝绿色代替绿色，紫红色代替紫色，以减少色盲人士的困扰），它对屏显和印刷都适用，并
且所有颜色的名称也容易定义。
需要注意的是，从以上配色组中选取颜色时：A. 请交替使用暖色和冷色；B. 当使用多个暖色和多个冷色时，在明度和饱和度上做出区别； C. 避免同时使用低饱和度和低明度的组合。
另外分享两个配色工具，它们都提供了针对色盲人士配色的选项，可以辅助大家进行配色： 网站CONT RAST-A-WEB V2.0 http://www.dasplankton.de/ContrastA/（打开“show colordeficiency simulation”面板）
地图配色工具COLOR BREWER 2.0 http://colorbrewer2.org/（勾选“colorblind safe”选项）
三、举例
下面以几种常用信息图形为例，来说明如何为色盲用户优化信息图：
1) 点状图
优化采用了这样一些手段：A. 调整配色，将色盲人士容易混淆的红、绿、橙色换为红、蓝、黄色。B. 调整明度，使图中几个颜色在明度上差异更明显。C. 为不同元素赋予不同形状。所有使用点元素的信息图，都可以参考这种解决方式。
2) 折线图
优化采用了这样一些手段：A. 采用更粗的线条，使颜色更明显。（色块越小，颜色越难分辨。对有色觉障碍的人来说，带颜色的细线、小图标、细体文字尤其难区分。）B. 换用不同形状的线条（实线、虚线、点线）。C. 文字直接注释在线的周围。D. 颜色微调。这样对每一类数据使用多重可视化变量进行编码后，即便颜色信息完全丢失，也能够完整的传递信息。所有使用线元素的信息图，都可以参考这种解决方式。
3) 柱状图
通过增加底纹，直接标注文字注释的方式优化了柱状图。所有使用面的图形（如饼图），都可以参考这种解决方式。
四. 写在最后
在实际设计过程中，我们不一定会同时使用到以上所有手段，需要在美观和友好之间进行权衡。我们也可以采用一些交互手段，避免同一界面中元素太多太过杂乱的问题。如highcharts 这个趋势图非常优秀，它采用了易辨识的颜色，每个节点处都使用了不同形状的符号，然而仅当鼠标hover 到具体节点时，会出现该条线对应的信息（“New York”）。
另外除了鼠标hover 的交互方式以外，我们甚至也可以为色盲人士提供单独的色盲模式切换，这样也可以兼顾视觉上的美观，避免了太多信息的干扰。这种形式在游戏和软件中也有先例。例如iChat ，一般情况下仅有不同颜色来区别用户的在线状态，但同时，它也提供了“User shapes toindicate status”选项，可以将“空闲”状态换成橙黄色三角形符号，将“忙”状态换成红色方形符号表示。
参考资料：
We are colorblind http://wearecolorblind.com/
Designing For, and As, a Color-Blind Person http://webdesign.tutsplus.com/articles/design-theory/designing-for-and-as-a-color-blind-person/
Color Universal Design (CUD)- How to make figures and presentations that are friendly toColorblind people http://jfly.iam.u-tokyo.ac.jp/color/
Designing maps for the colour-vision impaired http://colororacle.org/design.html
设计同理心——关注色盲人群http://lovelyrosa.blogbus.com/logs/54856107.html
Web Accessibility之为色盲设计http://www.2beusable.com/web-accessibility-1-what-is-color-blindness.html
(本文出自Tencent CDC Blog，转载时请注明出处)
人人都是产品经理（woshipm.com ）中国最大最活跃的产品经理学习、交流、分享平台