色覚多様性シミュレーター

色覚多様性シミュレーターの使い方

1. 1. 画像を読み込みます。 ファイルを選択 でPNG、JPEG、GIF、WebP、SVGを選ぶか、内蔵のサンプルを試せます。サンプルには色相の変化、Okabe–Itoの8色、赤・黄・緑のパレットが含まれています。大きな画像は、長辺900ピクセルまで縮小されます。
2. 2. 表示する見え方を選びます。 プロタノピア、デウテラノピア、トリタノピア、アクロマトプシアは初期設定でオンです。不要なものはオフにしてください。
3. 3. 強度を設定します。 100%では錐体の一種が欠けている状態（2色覚）をシミュレートします。低い値では、その錐体の反応が弱い状態（3色覚）になります。
4. 4. 比較して保存します。 各パネルは元の画像の隣に並びます。1枚ずつPNGでダウンロードするか、ラベル付きの1枚の画像にまとめて、報告書に貼ったり共同執筆者に共有したりできます。

各見え方の内容

• プロタノピアとプロタノマリー — 長波長（L、「赤」）の錐体がないか、弱い状態です。赤は暗く見え、茶色やオリーブ色に寄ります。赤と緑が混同されます。
• デウテラノピアとデウテラノマリー — 中波長（M、「緑」）の錐体がないか、弱い状態です。赤と緑が混同されますが、赤はプロタノピアほど暗くはなりません。デウテラノマリーは最も一般的な型です。
• トリタノピアとトリタノマリー — 短波長（S、「青」）の錐体がないか、弱い状態です。青と緑がにじんで見え、黄色とピンクが混同されます。まれな型です。
• アクロマトプシア — 錐体が機能しないため、世界が灰色の濃淡で見えます。このツールでは相対輝度として描いています。これはMachadoモデルには含まれないため、下の説明を参照してください。

米国国立眼科研究所によると、男性の約12人に1人が何らかの色覚特性を持ち、女性はそれよりはるかに少数です。講義室や査読者のプールには、影響を受ける人が含まれている可能性が高いということです。赤と緑の色覚特性が、最も一般的な型です。

シミュレーションのしくみ

このツールは、次の論文で公表された行列を使用しています。Machado, G. M., Oliveira, M. M., & Fernandes, L. A. F. (2009), “A physiologically-based model for simulation of color vision deficiency,” IEEE Transactions on Visualization and Computer Graphics, 15(6), 1291–1298. 著者らは、型ごと、強度0.0から1.0まで0.1刻みごとに、3×3の行列を1つずつ示しています。スライダーはこの表に沿って動き、その間の値では行と行の間を補間します。

1. 各ピクセルのsRGB値を、線形光に変換します（ガンマ曲線の逆変換）。
2. 線形RGBのベクトルに、選んだ型と強度の行列を掛けます。
3. 結果を0〜1にクランプし、再びガンマ変換します。
4. アルファ値は変更しません。どの行列でも各行の和が1になるため、灰色と白はそのまま変わりません。

シミュレーションでわからないこと

• これはモデルであり、一人ひとりの見え方ではありません。 実際の視覚は、同じ型の中でも個人差があります。このモデルが扱うのは錐体の反応だけで、脳の順応や文脈は含みません。
• アクロマトプシアは近似です。 Machadoモデルにはアクロマトプシアの行列がありません。このツールでは、WCAGの相対輝度 Y = 0.2126 R + 0.7152 G + 0.0722 B を灰色で表示しています。この状態には、通常、視力の低下や光への過敏さも伴いますが、それらはシミュレートしていません。
• お使いの画面によって結果は変わります。 キャンバスのピクセルはsRGBとして読み込まれます。広色域のディスプレイやナイトモードのフィルターは見え方を変えますが、保存されるシミュレーション画像はモデルに対して正確です。
• 色覚特性があっても、ほとんどの人は色を見分けられます。 2色覚は、各スペクトルの極端な端です。軽い色覚特性を持つ人も多く、それは強度スライダーで近似できます。

色覚に配慮した図を作るために

• 色相だけに頼らないでください。 直接ラベル、マーカー、線の種類、パターンを加え、どのカテゴリーにも色以外の手がかりを付けます。
• 明るさを変えます。 アクロマトプシアの表示で同じに見える2色は、白黒で印刷したときにも区別しにくくなります。
• 赤と緑、青と紫、緑と茶色を、2つの系列を分ける唯一の違いにしないでください。
• 安全なパレットから始めます。 このサイトのグラフ作成ツールで使われているOkabe–Itoのパレットは、この目的のために設計されています。ヒートマップには、viridis、cividis、ColorBrewerの連続配色が適しています。ヒートマップメーカーで選べます。
• コントラストも確認します。 色の上では区別できても、図形に対するWCAGの3:1を満たさない組み合わせがあります。カラーコントラストチェッカーで確認してください。

よくある質問

画像はサーバーにアップロードされますか？

いいえ。ファイルはブラウザで開かれ、このページのキャンバスに描画されて、そこで処理されます。ネットワークに送信されることはなく、ページを閉じるか再読み込みした後には何も保存されません。

プロタノピアとデウテラノピアの違いは何ですか？

プロタノピアは長波長（赤）の錐体がないこと、デウテラノピアは中波長（緑）の錐体がないことです。どちらも赤と緑を区別しにくくしますが、プロタノピアでは赤がはるかに暗く見えます。多くの図では両者が似て見えるため、一方に対応したパレットは、たいてい他方にも対応します。

最も一般的な色覚の型はどれですか？

赤と緑の色覚特性で、大半はデウテラノマリー（弱い緑の錐体）です。青の色覚特性と、完全なアクロマトプシアはまれです。

強度スライダーは何をしますか？

100%では、錐体の一種が欠けている2色覚をシミュレートします。低い値では、Machadoの行列を使って3色覚（プロタノマリー、デウテラノマリー、トリタノマリー）をシミュレートします。この場合、錐体は反応しますがずれています。0%では画像は変わりません。アクロマトプシアはスライダーの影響を受けません。

グラフを色覚に配慮したものにするには？

カテゴリー向けにはOkabe–Ito、連続データにはviridisのように、その目的のために設計されたパレットを使い、ラベル、マーカー、線の種類、パターンなど色以外の手がかりを加えます。そのうえでここで確認し、4つのすべての表示で各系列やカテゴリーを区別できれば、そのグラフは頑健です。

色覚のある人の見え方と同じですか？

デザインの確認には良い近似ですが、再現ではありません。同じ診断名でも人によって見え方は違い、このモデルは錐体の反応だけを扱います。問題を早めに見つけるための手段として使ってください。重要な図の場合は、その特性を持つ人に確認してもらってください。