- CUDって何？
- 色覚弱者の方にも伝わる配色は？
- 具体的にはどんなことに気をつければ良いの？
こんな悩みを解決できる記事になっています！
多くの人に伝わるデザインを作るために「CUD」は非常に重要で、覚えておきたい事項です。
そこで、この記事の前半では「色覚障害」「CUDに基づいた配色の3つのポイント」について、後半では「CUDに基づいた色に依存しないデザイン」「CUD作成に使えるツール2選」について解説します。
この記事を読んで「CUD」について理解を深めると、多様な色覚に対応した誰もが分かりやすいデザインが作れるようになります。ぜひ最後までお読みください。
CUDとは色覚の多様性に対応した配色！
CUDとはカラー・ユニバーサル・デザインの略称。人によって変わる色の感じ方（＝色覚）の多様性に対応し、より多くの人に情報がきちんと伝わるように色の組み合わせや明度などを工夫したデザインのことを指します。
色覚障害って何？
人間の目の網膜にある「赤」「緑」「青」を感じる細胞のうちどれかが機能しなくなる状態を色覚障害と呼びます。
先天的に色覚に異常を持つ人もいれば、目の疾患や加齢とともに特定の色が認識しづらくなる場合もあります。
色覚障害を持つ人の割合は日本人男性の5％（20人に1人）、西洋人男性の10％（10人に1人）、全世界で見ると2億人以上にもなり、決して少なくありません。
同じものを見ていても、人によって色の感じ方は様々です。実際にどのように違うのか確認していきましょう。
1. 一般の人との見え方の違い
色の区別が困難で、色覚障害者の過半数は、暖色×暖色や寒色×寒色の配色に見えづらさを感じることが多いとされています。
2. どんなところが不便か
色覚障害の方は赤を目立つ色に感じません。そのため、強調に使われる赤い文字や危険を伝える赤い表示が分かりにくくなります。
また、小さい字や細い字は見えづらいので、色が見分けにくいです。色の組み合わせによっては、正しく情報が伝わらない可能性があるでしょう。
CUDに基づいた配色の3つのポイント
実際にデザインする際は、NPO法人カラーユニバーサルデザイン機構が定めている3つのポイントを押さえると効果的です。
a.できるだけ多くの人に見分けやすい配色を選ぶ。
b.色を見分けにくい人（場合）でも情報が伝わるようにする。
c.色の名前を用いたコミュニケーションを可能にする。
この中でも、特にa.の配色について3つのポイントを解説していきます。
1. 明度を変える
色覚障害の方は色の区別はつきにくいですが、明るいか暗いかには敏感です。同じ色を使う場合でも明るさをはっきり変えると伝わりやすくなります。
2. 彩度を変える
明るさと同じく、彩度が似ている色は見分けにくいです。そのため、使う色の彩度に差をつけるようにしましょう。
3. 背景との色の組み合わせに注意する
緑を感じにくいD型（2型）色覚の見え方を確認すると、文字が背景と同化してしまうことが分かります。
明度や彩度に差をつけたり、背景に柄をつけたりして文字と区別すると良いでしょう。また、文字に黒い境界線をつけて背景と同化しないようにするのも効果的です。
CUDに基づいた色に依存しないデザイン
色以外のデザイン要素にも区別をつけると、色が見分けにくい場合でも色以外の要素から情報を正しく受け取れるようになります。
テレビのリモコンやクレヨンのように色名が併記されていると、何色を選択、使用しているのかがはっきりと分かります。
また、グラフでは色だけでなく形を変えたり塗りのパターンを変更したりして差をつけると分かりやすいです。
CUD作成に活用できるツール2選
色覚シミュレーションツールを活用すると、色の見分けにくさを体感的に検証し確認できるので、デザイン制作時に役立ちます。
1. Photoshop/Illustrator「色の校正」
PhotoshopやIllustratorでデザイン制作をされる方におすすめの機能です。
色覚障害を持っている方の目にどう映るのかを疑似体験できるので、自分の作ったデザインがCUDに当てはまっているかどうかが簡単にセルフチェックできます。
シミュレーションしたい画像をPhotoshop/Illustrator上で開き、表示＞校正設定＞「P型（1型）色覚」※1または「D型（2型）色覚」※2を選択するとP型・D型のそれぞれの見え方が検証できます。
※1）赤い光を主に感じる錐体が無いまたは分光感度がずれている人
※2）緑の光を主に感じる錐体が無いまたは分光感度がずれている人
2. アプリ「色のシミュレータ」
スマホアプリを使うと、iPhoneやAndroid端末からでも、どのように見えるのかシミュレーションできます。
内蔵カメラや画像ファイルから読み込んだ画像をリアルタイムで反映して色の見え方を体験できます。無料で利用できるので、気になる人はインストールしてみてください。
https://asada.website/cvsimulator/j/
まとめ
今回は、CUDについてご説明しました。
ポイント
- 色覚障害の方には見えづらい色がある
- CUDとはカラー・ユニバーサル・デザインの略称で、色覚の多様性に対応した配色のこと
- CUDに基づいた配色を意識する
- CUDに基づいた色に依存しないデザインをする
- デザインの際はCUD作成のためのツールを活用する
色覚の多様性や配色についての理解を深め、どんな人にも平等に情報が伝わるようカラー・ユニバーサル・デザインに取り組んでいきましょう。