杉江デザイン事務所

BLOG

2016/09/28
カラーユニバーサルデザイン(CUD)について

先日、「カラーユニバーサルデザイン」について勉強する機会があったので、メモがてら簡単にまとめつつ、デザインにどう活かしていくか考えたいと思います。

ユニバーサルデザインという言葉は近年とてもよく聞くようになりましたが、
カラーユニバーサルデザイン(以下CUD)はその中でも色に特化したユニバーサルデザインの考え方です。
具体的に言うと、色覚異常の方でも明確に判別ができるデザインをしよう、ということです。

身近な例 〜テレビリモコン〜

テレビをお持ちの方は、リモコンを見てみてください。
地デジ用のテレビリモコンには青、赤、緑、黄色のボタンが付いています。
そこに文字でも「青」「赤」「緑」「黄」と書いてありませんか?
cud_1
しかし、色覚異常があると、この4色がこのように見えてしまうそうです。↓
cud_2
(画像は「1(P)型2色覚」というタイプの色覚異常の例)

もし、文字表示が無く色だけのボタンだと、「赤」と「緑」の区別がかなり難しいことがわかります。
そこで、色だけでなく文字情報を組み合わせることで確実に情報を伝えることを実現しています。
これが色覚異常の方に配慮したユニバーサルデザインです。
※このことを知るまで、私は「最近のテレビのリモコンはただでさえボタンだらけでゴチャゴチャしてるのに、
なんでわざわざ文字も書いてあるんだろう」と思っていました。汗

色覚異常とは

wikipediaの定義は以下です。

色覚異常(しきかくいじょう)は、ある特定の視覚の特性をさして呼ぶ診断名。ヒトの色覚が、先天的あるいは後天的な要因によって、正常色覚とされる範囲にない状態をいう。
(wikipedia)

呼び方は様々で、かつては「色盲」「色弱」といった呼ばれ方をしていたり、最近では「色覚異常」「色覚障がい」といった呼び方もされています。(NPO法人カラーユニバーサルデザイン機構では「色弱者」という呼び方を提唱しています。以降、「色弱者」と記載します)

日本の色弱者の割合

女性は500人に1人程度、男性はなんと20人に1人程度、程度は様々ですが色弱者の方がいるそうです。
程度の違いこそあれ、学校のクラスに1〜2人程度、会社だと自分の部署やフロアの中に数人程度いる、ということになります。
(海外では地域によって傾向があるらしくそれも興味深かったのですが、ここでは割愛します)

CUDに配慮したデザインの工夫

例えば、こんなカラーリングのデザイン。(書体:Frutiger)
cud_3
この場合、色弱者(1(P)型2色覚者)には文字の識別がかなり困難となります。

これを解決する1つめの方法は、色弱者の方にも識別できるカラーリングに変更することです。
(東洋インキさんが出している「UDing」というソフトが便利です)

しかし、この画像は単純な例なので良いのですが、もっと色数が多く複雑で簡単にカラーリングを変更することができない場合には、以下の2パターンの方法を試してみると良いのではないかと思います。

境界線を明確にする

cud_4
文字と背景の境界線を付けることで、文字色と背景色の区別が付かなくても文字が認識できるようになります。

明度の差を明確にする

cud_5
そもそもの文字色を白(背景が明るい色の場合は黒)等にして背景との明度差を付けることで、文字が認識できるようになります。

CUDが必要とされるシーンと、現実的なニーズとの折り合い

国や行政の発行する機関誌やウェブサイト、あるいは交通標識などの、見れない・あるいは色弱者に伝わる情報が異なっては困るものに関してはCUD導入は必須と言えるでしょう。現に、多くの自治体がCUDガイドラインをウェブサイト上で公開しています。(例:東京都カラーユニバーサルデザインガイドライン

一方、ファッションやコスメといった嗜好性の高いもの、その他いわゆるブランドと言えるものについては、状況に応じてバランスを取ることが現実的かと思います。色はブランディングにおいて非常に大きな要素なので、CUDを気にしすぎるあまりデザインの選択肢が狭くなってしまっては、割合として多数を占めるターゲット層に訴求できなくなる危険性があるからです。

今のところは自分の仕事でCUDを明確に求められたことはありませんが、寧ろどんなデザインであっても初期段階でCUDの観点が必要かどうかを検討していくことが今後求められるようになるでしょう。
デザイナーにとってCUDの観点を持つことは提案の幅が広がる強みになりますし、発注側にとってもCUDを意識することが今後ますます求められてくるのではないかと思います。

手始めに「カラーユニバーサルデザインの手引き」という本を買ったので、ひと通り勉強します。


Fatal error: Uncaught Error: Call to undefined function wp_social_bookmarking_light_output_e() in /home/lookandfeel/hiromisugie.com/public_html/wp-content/themes/hiromisugie.com/single-blog.php:23 Stack trace: #0 /home/lookandfeel/hiromisugie.com/public_html/wp-includes/template-loader.php(106): include() #1 /home/lookandfeel/hiromisugie.com/public_html/wp-blog-header.php(19): require_once('/home/lookandfe...') #2 /home/lookandfeel/hiromisugie.com/public_html/index.php(17): require('/home/lookandfe...') #3 {main} thrown in /home/lookandfeel/hiromisugie.com/public_html/wp-content/themes/hiromisugie.com/single-blog.php on line 23