<b>本文講的是色彩如何影響 UX 和使用者行為，</b>
<b></b>
色彩：設計得當時你可能從未關注過它 - 但是設計不得當時呢？無論是過亮且灼眼的背景，或者暗灰色背景下的黑色文字，還是以次充好的色彩選擇都足以毀掉一款功能強大的 app。如同設計的其他方面，色彩不僅僅是為 app 錦上添花。色彩與使用者體驗的其他方面一樣，也可以是一種工具。
用于設計 app 的圖形 設計哲學 - 從元素尺寸，滑動方式，當然也包括色彩 - 都在影響着使用者的行為。是以，設計師通常在項目前期用幾個月的時間搭配色彩而不是設計布局。
選擇顔色搭配的差別就在于，完美的色彩搭配能設計出一個能讓使用者感到放松并沉浸于此的 app，糟糕的色彩搭配會讓使用者有拿手機砸牆的沖動。以銀行業務的 app 來看，糟糕的顔色搭配會讓你每次查餘額時都非常緊張，而完美的色彩搭配能夠緩解你的焦慮，比如馬上要清付下一次賬單了。
那怎麼才能設計得當 - 即如何在你的設計裡掌握色彩呢？
在深入圖形設計哲學（和心理學！）之前，需要了解一些色彩和設計的基本原則。雖然色彩看起來不是一門非常複雜的學問，但我們仍然有理由讓每堂藝術課不光教授如何使用色彩，還要教授如何 創造 色彩。
基本原則 - 拿色盤來說 -很簡單：原色（紅，黃，藍）可以結合調出二級顔色（綠，紫，橙）。同樣地，不同分量的白色加到顔色裡，能調出淺色，不同分量的黑色能調出深色。
實作圖形設計哲學的時候，色盤将會是一個不可或缺的重要工具。
對角線上的兩個顔色（如紅色和綠色，藍色和橘色）是互補色。這些顔色反差強烈，放在其互補色顔色旁邊（或之上）時十分突出。相鄰的兩個顔色是類似色。這些顔色對比度低，放在一起并不突出。
顔色對比度的高低沒有絕對的 ”正确“ 和 ”錯誤“。有時一個應用需要強對比的亮色組合。有時，又需要溫和一些。一般來說，越想要突出的東西，越需要強對比度。
感受色彩組合是否搭配的最好方法就是親身體驗。即便你手頭沒有項目，快速旋轉 Adobe 色盤 也許會讓你對色彩有新的認識。
鞏固 app 的圖形設計哲學史，你不應隻考慮外觀 - 你必須要思考它們給你的感受。我們說的不是觸覺回報。自從 Johann Wolfgang Goethe 研究 色彩對生理學影響 以來，我們着迷于用顔色産生生理和情感效果。
甚至今天，色彩在許多品牌的設計哲學中都占有主導地位。醫療，商業，和政府都傾向于使用藍色，因為藍色給人一種值得信任和專業的感覺。綠色看起來更年輕富有活力 - 當然，還反映了環境主義和親近自然的感覺。紅色是精力充沛和沖動的象征，給人速度，效率和力量的印象。我們看到的每個顔色（當然每個顔色本身都會與特定品牌相聯系）都暗示了一些東西，直接或間接地，影響着我們對于獨立品牌的看法。
你能認出的品牌和辨別都是以顔色為中心的。Apple、Wikipedia、 New York Times，在這些品牌裡灰色是主色，灰色象征着沉着可靠。這些品牌被視為和諧可靠的。全部食品品牌，John Deere，和 Starbucks 的辨別均以暗綠色為主色，把自然、有益身心健康和他們的品牌産品聯系起來。
許多顔色甚至超越了品牌自身，定義了整個行業。例如，想一下有多少快餐或連鎖餐廳品牌色是紅色或黃色的。這些顔色觸發精神開關，讓我們從心理上自願購買一些商品。
當經銷商很久以前就摸透個中道理時，科學也證明了我們關于顔色的一些共同感受。比如，紅色能夠讓人 反應更快速 或者對特定的刺激産生強烈的反應。紅色也可能會變得危險：研究者發現考試者看到紅色的時候，正确率會降低。
更不可思議的是，藥片的顔色對藥效也有輕微的影響。藍色藥片最合适做鎮靜劑，黃色最适合做抗抑郁的藥，在所有案例中，亮色的藥片藥效最好。雖然這更像是安慰劑，影響我們增大了對藥力的反應，但這影響已足以使制藥廠在生産新藥時把顔色作為考慮條件之一。
現在，并不是說在記錄心情的 app 中使用黃色基調就能有效地消除抑郁，而是你選擇的色彩搭配有理由認為能夠影響使用者心情 - 是以請謹慎選擇。
設計不僅是為了好看 - 還有功能和實用性，這兩條原則對任何 UX 設計師來說都可以說是最重要的。如果 UX 不流暢，你選擇的色彩搭配再怎麼完美，UI 再怎麼酷炫都沒用。如果使用者不能高效地使用，當然也不會想留下來。
那麼色彩在其中又能起到什麼作用呢？
簡單來說：色彩是能幫助引導視線的工具。如果顔色使用得當，能夠引導新使用者快速學會使用你的 app，不需要長時間的新手教程，一系列複雜的視訊，甚至不需要一個字。一個使用簡便的 UI 不隻能引導使用者注意 - 還能引導使用者全身心互動。
一幅彩鉛圍成圈的黑白照片，隻有筆尖部分有顔色。
試想一下，你正在為一家餐飲公司開發一款 app，提供友善大型機構訂餐的服務。一個潛在客戶第一次下載下傳了你的應用并打開它。他們會看到什麼？
在這個 app 裡，大多數菜單項 - 包括背景和其他資訊欄 - 都用柔和暗淡的灰色調配色填色。唯一例外的是一個橘紅色的寫着 “點單” 的方框。作為設計師，你知道大多數使用這款 app 的使用者都希望輕松地設定食物訂單。你要把這個标志放到顯眼的位置，而不是把這個特點隐藏到 app 深處，或者需要使用者滾動到頁面底部才能看到。不隻是這樣，你還需要讓使用者立即注意到這個按鈕。顔色能幫助實作這些目的，還能給新使用者準确的引導，知道需要到哪裡去。
同樣地，我們每天都在生活的方方面面中都在和顔色打交道，在心裡建構社會聯系。例如，紅綠燈：綠燈行，紅燈停，黃燈慢行（或者提醒我們前面有情況）。黃色代表重要警告，紅色代表強調，你能夠有力地傳達資訊并提醒使用者為他們的輸入做好準備。
另外，該邏輯不光可以用于警告界面。 改變 app 内購買按鈕的顔色顯然會顯著影響 轉化率。HubSpot 發現把綠色按鈕變成紅色按鈕後，轉化率輕松上升了 21%。此時，雖然不意味着要把每個 app 内購買按鈕調成亮色，但卻表明了顔色不僅是設計哲學的一部分：應該是整個 app 開發哲學的核心。
我們甚至在強調色的選擇上嘗試挖掘軟色調。色彩和陰影是優化圖形設計哲學的最好的方式。
在 Proto.io，可通路性 一直在我們設計哲學的重點。可通路性是好設計必過的一關。如果可通路性不通過，那麼就不是一個好設計。
大約 8% 的男人和 0.5% 的女人有不同形式的 色盲。與常見觀點不同的是，沒有單色色盲，紅綠色盲是最常見的。紅綠色盲患者通常分辨不清紅色和綠色。紅綠色盲程度不同，甚至輕微的紅綠色盲在使用一些 app 的時候都有明顯的障礙。
除了色盲，近視眼使用者有時無法閱讀低對比度的文字，除非把螢幕靠近一些 - 這潛在地破壞了一些 app 的可用性。
所有這些問題的解法相當簡單：展示文字時避免使用低對比度的背景顔色。當你不能保證每個人都能按照你設計的方式浏覽 app 時，如果你使用對比色，至少應用是可用的。類似的，強對比色的文字對任何人來說都便于閱讀 - 甚至在有視覺障礙時。
另一個提高可通路性的可選項是在 app 中提供可改變的主題色。雖然不是每個人都會用的，但是這能很好的提升 app 的可用性。你也可以允許使用者改變特定功能的顔色。例如，你可以有個開關改變 app 的部分顔色，或者整個 app 的文字顔色。把這些顔色的控制權交給使用者，你的 app 會對更多使用者來說都具有良好的可用性。
如果你仍然不清楚如何在可通路性與設計哲學的色彩之間尋找一個平衡，建議你看看 Google 的 material design library。
即使确實有一些顔色選擇時必須要遵守的規則，它也不是必要的。色彩通常是抽象的東西，像一種感覺。即使你的 app 不是為了在使用者身上表明情緒，也不代表它不會。當發現黑白色并不是完美色盤的時候，我們建議使用不同深度的灰色。
用灰色漸變色建構 app 的平面原型并且作為基本準則。記住它的展示和給你的感受：傳達給 QA 團隊，關注他們的說法。你的新手教育訓練是否灰暗無色？你是否錯誤關注到了應用的其他部分？帶着這些回報，再設計更多的原型，這次加上顔色。别依賴單色色盤。并且，從 Google 的 material design 網站獲得提示，考慮它提供的色盤。
這個人的圖形設計哲學是添加一個醒目的紅色元素。
把修訂版本也發送給 QA。不要擔心對兩個版本進行 A/B 測試（然後推翻原始灰階版本）。確定在讨論階段提出了關于色彩值得探讨的問題。你是否在 app 中使用顔色引導使用者注意？你是否為了添加閃光就向螢幕随便扔了個顔色？色彩是否分散了使用者的注意力？
别忘了使用者哲學和可通路性。如果你在開發一款旅遊應用，你真的希望所有内容都是亮紅色的嗎？如果你在開發一款健康應用，你的背景色必須是綠色嗎？文字的色彩對比是否足夠了？
好的 UX 設計會把這些問題一并考慮在内 - 畢竟，色彩對使用者行為和使用舒适度都有絕對影響。如果你的設計哲學還沒把這些問題考慮在内，設計出來的 app 并沒有你認為的好用和無障礙。確定按步驟設計你的原型，别拘泥于一個或兩個顔色。通過實驗選擇其他顔色，并重複實驗，直到完善你的色盤。
Proto.io 使得建構手機應用原型變得真實。無需程式設計或者設計技巧基礎。得以快速實作想法! 今天 注冊 Proto.io 獲得 15 天試用 并開始你的下一個手機應用設計。
<b>原文釋出時間為：2017年2月12日</b>
<b>本文來自雲栖社群合作夥伴掘金，了解相關資訊可以關注掘金網站。</b>