顏色如何影響用戶體驗和用戶行為
已發表: 2016-12-24顏色：當一個設計做對了，你可能永遠不會注意到它——但是當它做錯了呢？ 無論是過於明亮、刺眼的背景，還是深灰色背景上的黑色文本，低於標準的顏色選擇都可能毀掉功能最強大的應用程序。 就像設計的其他方面一樣，顏色不僅僅是為應用程序增添趣味。 顏色可以是一種工具，就像用戶體驗的任何其他功能一樣。
用於設計應用程序的圖形設計理念——從每個元素的大小，到它在 UI 上的滑動方式，再到顏色——都會影響用戶行為。 畢竟，設計師經常在項目的前幾個月花費調色板而不是線框來苦惱，這是有充分理由的。
選擇完美的調色板可能是設計一款真正幫助用戶放鬆的冥想應用程序和一款讓他們想把手機扔到牆上的應用程序之間的區別。 銀行應用程序讓您對查看餘額感到緊張，而另一個銀行應用程序可以緩解您對下一份薪水何時到來的焦慮，這就是區別。
那麼你如何做到正確——你可以做些什麼來在你的設計中掌握色彩呢？
平面設計哲學：色彩理論
在深入了解平面設計哲學（和心理學！）之前，了解顏色和設計的一些基本原則很重要。 雖然顏色可能看起來不是一個非常複雜的主題，但有一個很好的理由為什麼每門藝術課都不僅從如何使用顏色的課程開始，而且從如何製作顏色的課程開始。
基礎——正如色輪所解釋的——很簡單：原色（紅色、黃色和藍色）可以組合成二次色（綠色、紫色和橙色）。 同樣，可以將不同比例的白色添加到顏色中以創建色調，並且可以添加黑色以創建陰影。
彼此相反的顏色（如紅色和綠色，或藍色和橙色）被認為是互補的。 這些顏色對比強烈，使它們在彼此相鄰（或重疊）時脫穎而出。
彼此相鄰的顏色被認為是相似的。 這些顏色的對比度要低得多，這意味著它們靠在一起時往往不會那麼突出。
高對比度或低對比度的顏色本質上沒有“正確”或“錯誤”之分。 有時，應用程序會要求使用鮮明對比的明亮色彩。 其他時候，你會想要一些更溫和的東西。 一般來說，你越想突出一些東西，你就越應該依賴對比色。
了解顏色如何搭配（和不搭配）的最佳方式是玩弄它們。 即使您現在沒有從事項目，快速旋轉 Adobe 的色輪也可能會讓您以一種新的方式思考顏色。
情感樣本：色彩與心理學
當您鞏固應用程序背後的圖形設計理念時，您不能只考慮事物的外觀 - 您必須考慮它們的感受。 我們也不是在談論觸覺反饋。 自從約翰·沃爾夫岡·歌德研究色彩的生理效應以來，我們就一直痴迷於使用色彩來產生身體和情感上的影響。
即使在今天，色彩在許多品牌的設計理念中仍佔據中心位置。 醫療保健、企業和政府都傾向於使用藍色，因為它散發出一種信任感和專業精神。 綠色被視為一種充滿活力的年輕色彩——當然，它反映了一種環保主義和親近自然的感覺。 紅色充滿活力和衝動，給人以速度、效率和力量的印象。 我們看到的每一種顏色（當然還有我們內在與某些品牌相關的每一種顏色）都直接或間接地暗示著某種東西，這有助於推動我們對各個品牌的認知。
想想你認為非常以顏色為中心的品牌和符號。 蘋果、維基百科和紐約時報都以灰度顏色為特色，象徵著冷靜的可信度。 這些品牌被認為是平衡和可靠的。 Whole Foods、John Deere 和 Starbucks 的標誌都採用綠色調，將自然和健康與他們的品牌和產品聯繫起來。
有些顏色甚至超越了他們的品牌，定義了整個行業。 例如，想想有多少快餐或連鎖餐廳使用紅色或黃色配色方案。 這些顏色有助於在精神上觸發我們，將我們置於某個心理位置，促使我們購買某種產品。
雖然這是營銷人員很久以前就想到的事情，但科學證明了我們對顏色的許多共同感受。 例如，人們發現紅色可以讓一些人對某些刺激做出更快、更有力的反應。 它也可能令人生畏：研究人員發現，當考生看到紅色時，他們的分數更差。
甚至陌生人？ 藥丸的顏色對其工作方式有輕微影響。 藍色藥丸作為鎮靜劑效果最好，黃色藥丸作為抗抑鬱藥效果最好，在所有情況下，鮮豔的顏色效果最好。 雖然這可能只是增強我們對活性藥物反應的安慰劑效應，但這種效應足以讓公司在生產新藥時考慮它。
現在，我們並不是說在您的情緒跟踪應用程序中使用基於黃色的配色方案會使其成為有效的抗抑鬱藥，但您選擇的調色板可能會對用戶的情緒產生合理的影響——所以要明智地選擇。
為你推薦：
元界將如何改變印度汽車業
反暴利條款對印度初創企業意味著什麼？
教育科技初創公司如何幫助印度的勞動力提高技能並為未來做好準備……
本週新時代科技股：Zomato 的麻煩仍在繼續，EaseMyTrip 發布強...
印度初創公司走捷徑尋求資金
數字營銷平台 Logicserve 獲得 80 盧比的資金，更名為 LS Dig...
顏色和可用性
設計不僅僅是看起來漂亮 - 它是關於功能和可用性，這兩個原則可以說是任何 UX 設計師最重要的。 如果用戶體驗不流暢，那麼你選擇的調色板有多漂亮，或者你的用戶界面有多漂亮都沒有關係。 如果用戶不能有效地瀏覽它，它就不會有任何持久力。
但是顏色與這一切有什麼關係呢？
很簡單：顏色是一種可以幫助引導眼睛的工具。 如果您可以有效地使用顏色，您可以引導新用戶完成您的應用程序，而無需冗長的教程、一系列複雜的視頻，甚至一個單詞。 直觀的 UI 使用顏色不僅可以引導用戶的注意力，還可以引導他們與整個體驗的交互。
想像一下，您正在為一家餐飲公司開發一個應用程序，幫助大型組織輕鬆定制食品訂單。 潛在客戶首次下載您的應用並將其打開。 他們看到了什麼？
在應用程序中，大多數菜單項——包括背景和任何信息框——都以柔和、暗淡的灰度調色板著色。 一個例外是一個橙紅色的盒子，上面寫著“訂單”。 作為設計師，您知道用戶在使用您的應用程序時想要做的第一件事就是輕鬆設置他們的食物訂單。 與其將這個功能隱藏在應用程序的深處，或者要求他們一頁一頁地向下滾動才能找到它，不如把它放在前面和中心。 不僅如此，您還會立即吸引他們的注意力。 顏色有助於它突出，並準確地向新用戶顯示他們需要去的地方。
同樣，我們每天以各種方式與顏色互動，並在我們的腦海中建立某些社會聯繫。 以紅綠燈為例：綠色表示前進，紅色表示停止，黃色表示減速（或提醒我們前方有事）。 通過將重要警告標記為黃色，或使用紅色突出顯示某些內容，您可以有力地傳達一條信息，引導用戶進行輸入。
然而，同樣的邏輯不僅可以用於警告屏幕。 更改應用上導致應用內購買的按鈕的顏色會顯著影響轉化率。
雖然它不在應用程序內部，但 HubSpot 發現他們只需將按鈕設為紅色而不是綠色，就可以將轉化率提高 21%。 現在，這並不意味著您應該將每個應用內購買按鈕更改為明亮的深紅色，但這裡有一個論點，即顏色不能只是您設計理念的一部分：它必須是您的整個應用程序開發理念。
明智地使用顏色：設計和可訪問性的哲學
在 Proto.io，可訪問性始終是我們設計理念的最前沿。 坦率地說，可訪問性是必須融入良好設計的東西。 如果它不存在，那麼設計根本就不是很好。
大約 8% 的男性和 0.5% 的女性患有某種形式的色盲。 與流行的想法相反，沒有單一的色盲，但紅/綠色盲往往是最常見的。 患有這種色盲的人通常很難看到紅色和綠色的變化。 雖然這種形式的色盲的嚴重程度差異很大，但即使是輕微的紅/綠色盲也會使許多應用程序幾乎無法使用。
除了色盲之外，近視用戶通常難以閱讀對比度低的文本，除非他們將屏幕靠近他們的臉——這可能會破壞許多應用程序的可用性。
這兩個問題的解決方案相當簡單：在背景上顯示文本時避免使用非對比色。 雖然你不能保證每個人都能以你想要的方式看到你的應用程序，但如果你使用對比色，你至少會給人們一個他們可以使用的應用程序。 同樣，使用高對比度的顏色將使每個人都更容易閱讀文本——即使他們沒有視力問題。
增加可訪問性的另一個選擇是在您的應用程序中提供可交換的調色板。 雖然這不是每個人的選擇，但它可以極大地提高您應用的可訪問性。 您還可以允許用戶更改特定功能的顏色。 例如，您可以選擇更改應用的強調色或整個應用中文本的顏色。 雖然這兩個選項可能會讓您失去一些控制權，但它們將確保您的應用可供更廣泛的受眾訪問。
如果您仍在努力弄清楚如何以不損害應用程序可訪問性的方式將顏色集成到您的設計理念中，我們建議您查看 Google 的材料設計庫。
選擇完美的調色板：鞏固您的設計理念
儘管應該清楚在顏色方面有一些規則可以遵循，但它也不一定是一門科學。 顏色通常與更抽象的事物有關，例如感覺。 即使您的應用程序沒有試圖在用戶中表現出某種情感，但這並不意味著它不會。 雖然找到完美的調色板不是黑白的，但我們建議從灰度開始。
以灰度漸變構建應用程序的平面原型，並將其用作基線。 記下它的外觀和感覺：將其傳遞給您的 QA 團隊，看看他們要說什麼。 您的入職流程是否沒有色彩？ 您是否將注意力吸引到應用程序的錯誤部分？ 有了這個反饋，設計更多的原型，這一次帶來顏色。 不要依賴單一的調色板。 取而代之的是，從 Google 的材料設計網站中獲取靈感，並嘗試使用他們的一些樣本。
也將這些修訂發送給 QA。 不要害怕對它們進行 A/B 測試（以及對原始灰度版本）。 確保你問了一些關於你要加入戰鬥的顏色的棘手問題。 您是否在應用程序中使用顏色來引導用戶的視線？ 你只是為了增加火花而在屏幕上塗上顏色嗎？ 顏色是否會分散用戶到達他們想去的地方的注意力？
不要忘記用戶心理或可訪問性。 如果您正在創建一個旅行應用程序，您真的希望一切都是鮮紅色的嗎？ 如果您正在創建一個醫療保健應用程序，您的背景真的應該是綠色的嗎？ 您的顏色對比是否足以使文本清晰易讀？
好的用戶體驗設計會考慮所有這些問題——畢竟，顏色對用戶行為和享受有著決定性的影響。 如果您的設計理念沒有考慮到這一點，那麼您可能正在製作一個不像您想像的那樣可訪問或可用的應用程序。 確保您在每一步都對您的設計進行原型設計，並且不要過於拘泥於一種或兩種顏色。
嘗試，選擇另一種顏色，然後繼續修改，直到找到最適合您的調色板。