什麼是色盲模擬器？

色盲模擬器向您展示不同類型色覺障礙人士眼中的圖片和配色方案。測試紅色盲、綠色盲、藍色盲和全色盲情況，找出在每種情況下會失效的顏色。

工具用 Brettel 和 Machado 的色覺缺陷模型,把每個像素套用對應矩陣,近似還原八種常見色覺下的畫面。「全部對比」模式把所有類型與原圖並排,審 UI 設計或圖表時比一個個切換省事得多。

使用方法

1. 上傳圖片或輸入要測試無障礙性的顏色。
2. 選擇一種色覺類型,接著拖曳分隔線即可在原圖與模擬畫面之間淡入淡出,並用程度滑桿調整輕度異常情境。
3. 同時比較所有模擬類型，並下載模擬圖片用於存檔。

何時使用

• 在 UX 評審前先檢查儀表板狀態色標的可讀性。
• 確認圖表裡紅綠差異的標示是否還能被辨識。
• 公開報告挑配色時,確保不同視覺族群都能看清。

結果

一位UI設計師上傳了應用程式儀表板的截圖，發現紅/綠狀態指示器在綠色盲模式下難以區分。於是在顏色旁加入圖示形狀來解決這個問題。

常見問題

模擬畫面跟真實色覺缺陷者看到的差多少?

Brettel 和 Machado 矩陣給的是可用的近似,不是精準還原。真實感受還受光線與個體差異影響,適合用來抓明顯問題,但不能當醫療級參考。

Protanopia 和 protanomaly 差在哪?

Protanopia 是紅色錐細胞完全缺失,紅色會明顯變暗;protanomaly 是紅色感受變弱,看起來相似但變化較緩。綠色(deutera)和藍色(trita)也有「全色盲」與「色弱」之分。

設計時最該優先處理哪幾種色覺?

Deuteranomaly(綠色弱)在男性中約 5%,是最常見的紅綠色覺缺陷。Protanopia 加 deuteranopia 合計約 2%。藍色與全色盲都較少見。做大眾產品時,以綠色弱優先。

不上傳圖片也能測試單一顏色嗎？

可以。切換到「顏色」分頁，輸入任意十六進位代碼，每個顏色旁邊都會顯示七種視覺類型各自看到的樣子，不需截圖就能核對品牌色板或介面色值。至於整張圖片，「色彩校正」按鈕更進一步，會為圖片重新上色，讓色覺障礙者也能真正分辨這些色調。

上傳的圖會送到伺服器嗎?

不會。圖片在瀏覽器分頁的 canvas 解碼,色覺矩陣在本機運算,模擬畫面直接渲染出來。整個過程不離開頁面,關掉分頁就一切清空。

相關工具