設計師手冊（一）：公共空間設計必知的色盲者友善配色
色盲聽起來是個很有距離的名詞，事實上色盲者的比例佔了全部人類的8%，如果把色弱者算進去恐怕多更多。最知名的例子，像facebook創辦人祖克伯就是紅綠色盲，甚至很多藝術家和設計師都是色盲或有色弱的情況。
雖然我們無法在每次設計時都將所有人的權益考慮進去，但當你接到重要的設計案子時，像是公家機關、公共空間的標示設計（機場、火車站、戶政事務所、辦事處等等），這種「所有人都會使用」的情況，就得多加斟酌小心了。
「我又不是設計系出身的，不知者無罪！」
不要再為自己找藉口了啊～～我知道，大多數的設計師不一定是設計科系出身，而且大多數設計系其實也都沒有相關課程，至少我畢業的學校科系就沒有教任何這類的內容（真的都是要自己研究出結論）。
「設計是給所有人看的，你以為特別的配色計畫其實有可能對於色盲者是種歧視」
我深深體驗到這句話，是從我的俄羅斯朋友開始的。他對於色彩的缺乏自信，導致於連我問他喜歡的顏色，他都不大好意思說出口。他有些許辯色障礙，確切來說，他沒有告訴我他是哪一種色盲或色弱，但對他而言除了對比很高的配色外（像是黃黑），中間那些明度差異不大的色彩，對他來說都是很模糊的界定。
我一個正常視力的人，怎麼知道他們看出去的世界是什麼樣子？
這裡我做了兩張圖，來讓大家看一下色盲者的世界看出去大概是什麼樣子。
是不是有種，你戴了某種濾鏡的太陽眼鏡，或顏色被PS過的感覺？那是因為你原本擁有的是正常視力，對色盲者而言，那就是他們的日常。
一般來說，分成四種大類，Protanopia（紅色色盲）、Deuteranopia（綠色色盲）、Tritanopia（藍色色盲）、Color Blindness（全色盲），當然每個人的色盲程度、種類都是不同的，就連正常視力的人，看出去的顏色也都有不同的呈現程度。
- 紅色色盲 Protanopia：臨床上和綠色盲表現相近，一般常統稱紅綠色盲。難以辨識紅色及綠色，常轉換成黃色為主的畫面。
- 綠色色盲 Deuteranopia：臨床上和綠色盲表現相近，一般常統稱紅綠色盲。難以辨識紅色及綠色，常轉換成黃色為主的畫面。
- 藍色色盲 Tritanopia：此基因者多半無法辨識藍色及黃色，常轉換成紅色為主的畫面。
- 全色盲 Color Blindness：眼球缺少椎狀細胞，或無作用，僅能靠桿狀細胞感受視覺光線強弱，故其看到的為灰階分布。眼睛對亮度極敏感，白天待室外須戴上太陽眼鏡保護眼睛
一般來說須注意的是，做設計的時候不能只依賴彩度高低所呈現的清晰程度，對色盲者而言有很多時候根本無法辨識清楚。假設運用在網站、app上面，這還不會是個大問題，但若是牽涉安全的標誌（像是我一直都覺得紅綠燈是個很歧視色盲者的設計），千萬不能僅考慮正常視力者的情況。
Q1.
如何能夠使字體清晰呈現？你需要調整的是「明度」而已？
很多人以為只要不把同樣明度、不同彩度的顏色放在同個畫面就沒問題，但其實事實並非如此。讓我們用為協助色盲者開發的配色指南（點按可進入該網站）來看看以下幾個案例：
你可能認為黑色配什麼顏色都可以被辨識？其實不然，在這個螢幕中你會發現情況是這樣：
正常視力者：桃紅底黑色 ◯ 黑底桃紅字 ✕
紅色色盲： 桃紅底黑色 ✕ 黑底桃紅字 ✕
綠色色盲： 桃紅底黑色 ✕ 黑底桃紅字 ✕
藍色色盲： 桃紅底黑色 ✕ 黑底桃紅字 ✕
全色盲： 桃紅底黑色 ✕ 黑底桃紅字 ✕
所以其實這樣的配色，不管是哪一種色盲者都是看不清楚字的。
舉個例子，各位可能滿常見到紅底黑字的泡麵包裝（營養成分標示那邊），但事實上對紅色色盲、綠色色盲、及全色盲來說，這種案例都是無法辨別文字的。
彩度高的顏色對色盲者來說會轉換成深色，所以黑色字體搭在上面看不清楚；此外，黑底鮮艷顏色的字體也是同樣道理。
彩度高的顏色 ✕ 黑色 = 不易辨識
解法：彩度降低，或將配色中的黑色換成白色（如下）
Q2.
不是鮮豔的顏色，明度也調整出不同，這樣就可以很清楚了？
經過剛才的測試，你知道鮮豔色會帶來不好的辨識度，於是換了「熟色」（幫你們解釋一下，熟色指的是降低純度之後得到的效果，像是沙色、灰藍、梅紅，都算熟色。簡單說，就是像「混過淡灰色」得到的結果），結果發覺怎麼還是一堆叉叉，為什麼色盲者仍有些看不清楚？
正常視力者：桃紅底黑色 ◯ 黑底桃紅字 △
紅色色盲： 桃紅底黑色 ◯ 黑底桃紅字 △
綠色色盲： 桃紅底黑色 △ 黑底桃紅字 ✕
藍色色盲： 桃紅底黑色 △ 黑底桃紅字 ✕
全色盲： 桃紅底黑色 △ 黑底桃紅字 ✕
原因是，在明度差異沒有很大時，深色底的情況不利於他們看清楚。
回想一下，在學校老師用很多顏色的粉筆，白色是最清楚的，黃色也很明顯，但藍色和紅色呢？尤其紅色，如果你是坐在最後一排的人，是不是準備舉手說：「老師，紅色的部分我看不清楚。」這樣解釋你就能理解。對色盲者而言，深色底的情況下，就算明度拉出極大對比，也需考量是否足夠讓色盲者看得清楚。
深色底 ✕ 明度沒有高很多的字（比起底色）= 不易辨識
解法：底色的明度降低（如下），或將字體顏色明度調高
Q3.
那我用明度值差異不大，剛好是對比色的配色來做設計應該可以吧？
很多設計師喜歡對比色設計，但也要運用得當，否則會慘不忍睹。以上圖為例，大部分的人都還可以看出個字，雖然視覺上彩度過高是很不舒服的事就是了。但是藍色色盲就沒那麼幸運了，他能看到的字非常不清楚。
正常視力者：桃紅底黑色 ◯ 黑底桃紅字 △
紅色色盲： 桃紅底黑色 ◯ 黑底桃紅字 ◯
綠色色盲： 桃紅底黑色 ◯ 黑底桃紅字 △
藍色色盲： 桃紅底黑色 △ 黑底桃紅字 ✕
全色盲： 桃紅底黑色 ◯ 黑底桃紅字 △
來解析一下為何如此，藍色色盲通常接收不到黃色，所以像這張圖，綠色看上去只會像藍色（因為綠色為藍加黃組成，而黃色是無法被藍色色盲者看到的），而藍色的字在紅色的底色上，就會顯得更不清楚。
最常見紅色與綠色讓人分不清的情況如上（到底誰發明紅綠燈的？）。
明度接近的對比色搭配 = 不易辨識
解法：把其中一方的明度拉高或拉低，即可以看得清楚（如下圖）
上述舉了這麼多例子，希望各位可以更留心把無障礙空間也延續到視覺上。現在是少數人知道這套設計法則，但希望在越來越多設計師體認到這件事之後，能夠改善我們的環境，不管是公共空間的標示，或是學校、教育環境，以及網路上重要機關的官網，都能謹慎使用配色計畫。
我自己因為身旁有好友和老師就是案例，一位是紅綠色盲，一位是辯色障礙（他沒說明程度），所以一直以來非常注重這塊設計教育的推動。但當我自己當色彩學助教的時候，很驚訝在設計系也沒有半點提供到相關資訊，甚至業界很多設計師不是很在乎這個，因為大多數能當上設計師的人多半不是色盲者吧，但我還是希望在學習之後，不管是新手還是老手，都能了解這個網站的功能，下次要製作新作品之前，別忘記先查詢一下配色計畫是否恰當。
總結
不易辨識的情況：
1. 彩度高的顏色 ✕ 黑色
2. 深色底 ✕ 明度沒有高很多的字（比起底色）
3. 明度接近的對比色搭配你可以這麼做：
1. 明度值差距拉大
2. 謹慎使用彩度高的色彩
3. 避免使用用彩度做區別的設計
希望這次的分享對大家有很大的幫助和收穫，如果喜歡也請不吝鼓勵我喔！有任何問題或者深有所感想和我有更多交流，可以在下方留言，我有空都會一一回覆大家的，祝大家可以在設計的路上越來越進步，一起改善我們的環境吧！
更多拾光好文章
