見出し画像

カラーユニバーサルデザインについて調べてみた

色弱の方を考慮しての配色、というと、赤と緑の組み合わせが見づらいから避ける、明暗差のある色を選ぶ、という大雑把な知識しかなかったんですが。

このツイートを見て、「グレーが緑に見える」「ピンクが水色っぽくみえる」方がいらっしゃるこということを知りました。

えっこれ大変じゃない。
色の差の判別ができなくて困る、というLEDランプのパターン以外にも、色が別の色に変換されて見えるということがあるのか…これは日常生活がけっこう困るのでは。私のように大雑把な知識しかない人の方が多いかもと思いますし。

で、そのスレッドの続きにも、その他のタイプの方の様々な苦労話などがあり、色弱って様々なタイプがあって、見え方が全然違うんだなと。以下まとめを貼っておきます。

お肉の焼き加減が分からないとか、困りますよね…。知らなかった。

色の数値を調べてみた

上記のツイート、例にあげられた二色同士の組み合わせ、これって見た目が違うように見えても、多分なにかが近似値では。

色の数値って、よく聞くのは「RGB」か「CMYK」かと思うんですが、その他にも、いくつかあります。
RGBでの数値が載せてありましたが、たぶん違うもので数値を出す方がいいのでは、と。
Lab、というのがありまして。

「Labの利点
RGBやCMYKとは異なり、Lab色空間は人間の視覚を近似するよう設計されている。知覚的均等性を重視しており、L成分値は人間の明度の知覚と極めて近い。したがって、カラーバランス調整を正確に行うために出力曲線を a および b の成分で表現したり、コントラストの調整のためにL成分を使ったりといった利用が可能である。RGBやCMYKは人間の知覚よりも出力機器の都合が優先されており、これらの変換は編集ソフトの適切なブレンドモードの補助が必須である。」from wiki「Lab色空間」

私が見つけたのは、上記ツイートの色の組み合わせは、「lab」の数値の「l」の値がほぼ同じかすごく近いということ。

(図の数値が一部間違っていたので修正しました)

「明暗差」の数値化で、ここは判別、見分けがつくかどうかが分かりやすくなりそう?
…と思って、別の色で試してみたら、全然違いました。あれれ。
そうそう簡単にはいかないようです。ふむー。

この検証、簡単に分かるのが、シミュレータツール。以下に、いくつか紹介してみます。
ただ、色の変換されて見えるのは、シミュレートできませんでした。

✁-------

カラーシミュレータアプリ

▼ 「色のシミュレータ」Android版とiOS版

スレッドにも紹介されていたアプリがこれです。
4分割画面で4タイプの表示がされるので、比較がしやすいです。
意外とパステルピンクがダメなんですよね…

私、以前これを入れて某所のサイトリニューアルの時チェックしてました。それ以前のものが春カラーだったので、一部見分けがつきにくい色になっていたりしてて、そこの改善もしておきたかったし、その頃ちょうどユニバーサルカラー、優しい配色設計みたいのを言われていたんですよね。

(webでよくやりがちなの、文字色だけで重要度の優先順位を表現するのはよくないので、文字なら太字とか、背景色でマーカーみたいにするとか、するといいのかもですね。
あともうひとつ!
webでの強調下線<u>は、見た目がリンクと紛らわしいのでだめです。リンクの文字色が設定されていたとしても、色のみでは認識がされにくいので、強調するなら太字その他です。いまだにたまに見かけるんですよねこれ)

他のカラーシミュレータ

他にも、ブラウザに拡張機能があるとかも聞いたことがあったので、調べてみたら、まとめ記事がありました。

色覚の仕組み

カラーユニバーサルデザインという、色弱の人にも優しいデザインを広げる取り組みをしている「特定非営利活動法人(NPO法人)北海道カラーユニバーサルデザイン機構」のサイトで、色覚の仕組みについて説明があったので、ご紹介。

これを見ると、なぜ赤と緑が判別しづらいのかが何となく分かる気がします。わりとどのタイプでも青は判別が可能なのは、グラフの形が全然違うからなのか…
(目の仕組みからしてよく分かってないのですが、これはたぶん光の色と受け取る器官の関係とその違いですよねきっと)

そのサイトでも、シミュレータのまとめがあったので、そちらも。

✁-------

色を選ぶ配色、一度グレー化して見てみる、という工程は、このカラーユニバーサルデザインという視点でも、大事。
明暗差で認識しやすいかどうか。
パステルカラーが多い春先は、少し注意が必要になりそうですね。

ちょっと気になったので、メモ代わりにまとめました。


追記

パワーポイント、エクセル用カラーパレットが無料配布!

これはいいですね、こういったものがあれば、迷わずにすみます!
素晴らしい〜!

詳細はこちらを。


↙左下の♡マークをポチして下さるととても喜びます。(未登録の場合はポチのカウントのみです、ご安心を) よろしくお願いします❤️ もちろん投げ銭サポートもできればよろしくです!