色覚シミュレーターとは
Webデザインや資料の配色が、色覚の特性を持つ人にどう見えるかをブラウザ内でシミュレーションするツールです。画像をアップロードするだけで、P型（1型色覚）・D型（2型色覚）・T型（3型色覚）・全色盲の4種類の見え方を一括確認できます。画像はすべてブラウザ内で処理され、外部に送信されません。
色覚のタイプ（呼び方と頻度）
| タイプ | 別名 | 特徴 | 頻度（日本人男性） |
|---|---|---|---|
| P型（1型） | Protanopia・赤色覚異常 | 赤と緑の区別が苦手。赤が暗く見える | 約1.5% |
| D型（2型） | Deuteranopia・緑色覚異常 | 赤と緑の区別が苦手。P型より頻度が高い | 約3.5% |
| T型（3型） | Tritanopia・青色覚異常 | 青と黄の区別が苦手。非常に稀 | 0.001%以下 |
| 1色覚（全色盲） | Achromatopsia | 色の識別が困難。極稀 | 0.003%以下 |
日本人男性の約5%、女性の約0.2%が何らかの色覚特性を持つと言われています。特にD型（2型）が最も多く、Webデザインでは「赤と緑の組み合わせで情報を伝えない」ことがアクセシビリティの基本ルールになっています。
変換アルゴリズム
Machado, Oliveira, Fernandes (2009) 提案の変換行列を使用しています。RGB値を色覚タイプごとの3×3行列で線形変換することで、それぞれの色覚での見え方を近似します。
P型: R'=0.567R+0.433G, G'=0.558R+0.442G, B'=0.242G+0.758B
D型: R'=0.625R+0.375G, G'=0.700R+0.300G, B'=0.300G+0.700B
T型: R'=0.950R+0.050G, G'=0.433G+0.567B, B'=0.475G+0.525BWebデザインでの活用シーン
- グラフ・図表の配色チェック：凡例が色だけで識別できるか確認
- ボタン・警告色の設計：赤（禁止）と緑（OK）のみでの伝達を回避
- 地図・ヒートマップ：段階的配色が色覚特性でも判別可能か
- プレゼン資料：棒グラフや円グラフの色分けが全観客に伝わるか
- ゲームUI：HP・MP・ステータス表示の視認性
配色改善のヒント
- 色だけでなく形・テキストラベル・パターンも併用する
- 赤と緑を同時に使う場合は明度差を十分につける
- 推奨配色: 青×オレンジ、青×黄（ColorBrewer系のパレット）
- コントラスト比（WCAG 4.5:1以上）を満たす
- Webサイト用のカラーコード変換ツールとあわせてチェック
