seahorse

忘れちゃいけない。色覚タイプのメモ

デザイナーって、細かな色の違いも見てわかる人が多いと思います。

色弱の方の人口って、どれくらいいると思いますか?
日本では男性の20人に1人、女性の500人に1人が色弱(P型色覚・D型色覚)であると言われています。
そう考えると多いですよね…

※「色盲」「色覚異常」等さまざまな言い方がありますが、今回は北海道カラーユニバーサルデザイン機構さまにならって「色弱」という言葉を使用します。
http://www.color.or.jp/about_cud/construction/

Photoshopの色覚タイププレビュー

Photoshopには色覚タイプのプレビュー機能があります。
調べたところCS4からはあるようです。それ以前は分かりませんでした…

「表示」→「構成設定」→「P型(1型)色覚」or「D型(2型)色覚」

私がデザインツールでPhotoshopを使用している理由の一つがこれです。

実際のWebサイトを色覚プレビューで見るとこうなります。
ゼクシィ(モニター通り)
ゼクシィ(P型プレビュー)

サンリオ(モニター通り)
サンリオ(P型プレビュー)
流山中央病院(モニター通り)
流山中央病院(D型プレビュー)

がらっとイメージが変わりますね。
最初に見たときは衝撃でした。

UIに置き換える

上記は直接UIには関係ないけれど、色だけで判断するようなUIは作ってはいけませんね。。
東京メトロの路線図は、「○○線」と路線の文字を入れることや、明度差をつけることによって限られた色数の中でも路線の判別ができるようになっています。

モニター通り
P型プレビュー


それを第一に考えろという訳ではないけれど、幅広い層が対象のデザインを作成する時など注意しなくちゃいけませんね。
ガイドラインを出している行政もあるので、一読しておくといいかもしれませんね。

『色覚障がいのある人に配慮した 色使いのガイドライン』大阪府
http://www.pref.osaka.lg.jp/attach/14768/00000000/guide1.pdf

『色使いのガイドライン』神奈川県
https://www.nig.ac.jp/color/guideline_kanagawa.pdf

copyright © 2016 saki all rights reserved