我們每天的日常生活中都有無盡的選擇。 在個人生活和職業(yè)生活中，我們必須考慮許多對立面和挑戰(zhàn)。當解決方案更多地基于事實，經驗和知識的時候，會比僅僅基于建議更好。 今天，我們將討論UI設計師在項目中經常需要作出的一個選擇：哪種方案更適合界面，明亮的還是黑暗的？
影響配色方案選擇的因素
可以肯定的是，沒有一個特定的選擇可以用于所有的目標對象。 解決方案在很大程度上取決于多種因素的影響，不僅涉及用戶方面，還涉及業(yè)務目標，市場條件和當前設計趨勢。 讓我們討論一下在配色方案選擇的問題上必須考慮的基本因素。
可讀性和易識別性
這些術語都與對文本內容的感知直接相關。 可讀性界定了用戶可以怎樣輕松地閱讀單詞，短語和模塊。 易識別性衡量了用戶如何快速直觀地區(qū)分特定字體中的字母。
在選擇配色方案時應該仔細考慮這些問題，尤其是充滿了大量文本的界面。 在許多其他因素中，為界面選擇配色方案在文本感知的有效過程中起著至關重要的作用。 例如，與在不同背景下感知的物理對象一樣，白色或淺色背景上顯示的黑色副本似乎大于黑色背景上的白色副本。 可讀性差導致用戶體驗不佳：用戶無法掃描數(shù)據(jù)，更有甚者 - 即使數(shù)據(jù)互相關聯(lián)但不可讀，用戶會感到文本莫名其妙地糾纏在一起，甚至可能錯過關鍵信息。
這是否意味著具有淺色背景的界面更具可讀性？ 不總是。 其中一位著名的用戶體驗設計大師Jacob Nielsen提到：“在文字和背景之間使用高對比度的顏色。最佳易讀性需要在白色背景上顯示黑色文字（所謂正面文本），同樣，黑色背景上顯示白色文字（負面文本）效果一樣好。 雖然對比度與正面文本的對比度相同，但負面文本的配色方案會使人稍微放松一些，并會稍微放慢閱讀速度。 在配色方案中，如果文字比純黑色淺的時候，易讀性會受到很大影響，尤其是當背景色不是純白色時?！?/p>
因此，如果設計師在不同顏色背景下研究文本感知的特性并且慎重選擇字體，那么任何配色方案都可能具有足夠的可讀性。
然而，一些可追溯到20世紀80年代的科學研究表明，對于大量文本來說，淺色背景似乎是大多數(shù)用戶更有效的選擇。 通過研究廣告運營商的工作習慣，D. Bauer和C.R.Cavonius在文章《通過對比反轉提高視覺顯示單元的易讀性》（1980）中分享了他們的研究成果。 特別是，他們發(fā)現(xiàn)參與者在淺色背景中閱讀黑色文本時比其他場景下辨認文本更加精確了26%。
為什么會這樣？感官認知和互動研究小組（英屬哥倫比亞大學）的Jason Harrison以下述方式解釋了這種現(xiàn)象。 散光的人（根據(jù)不同的統(tǒng)計數(shù)據(jù)，大約占50％的人口）感覺黑色背景下的白色文本比白色背景下的黑色文本更難識別。 其中一部分與光照等級有關。 有了明亮的顯示屏（白色背景），虹膜會更加閉合，從而減少“變形”鏡頭的影響。 在黑色顯示器（黑色背景）下，虹膜會打開以接收更多光線，鏡頭的變形會在眼睛處產生更加模糊的焦點。 所以基于此，如果界面中呈現(xiàn)大量文本并提示長時間閱讀體驗，則淺色背景可能會對用戶更加友好。
無障礙
無障礙主要定義為Web或移動界面盡可能服務更多人的能力，不包含任何歧視地提供其功能。 因此，“使用還是不使用”的決定必須基于用戶的需求和偏好，而不是其身體能力。 色彩方案是影響這方面的最主要因素之一。 選擇調色板和顏色組合時，設計師需要考慮不同年齡，特殊需求或殘疾的用戶，這些用戶還可以確定背景和布局元素的顏色選擇。 用戶研究成為向UX設計人員提供有助于更接近目標受眾的數(shù)據(jù)的重要幫助。
清晰度
清晰度定義了查看和區(qū)分屏幕或頁面上所有核心細節(jié)的能力。 首先，它涉及導航的簡單性和直觀性：能夠掃描布局并找到信息和交互元素的區(qū)域，用戶不需要付出太多努力來找到他們所需的東西。 如果這方面沒有得到適當?shù)臏y試，可能會導致視覺層次較弱，并使屏幕變得一團糟。 對比度在這里起著重要的作用，配色方案成為它的基礎。 為了檢查，如果界面清晰并且對比度足夠，請不要忘記“模糊效果”這個很好的舊技巧，在模糊模式下查看屏幕或頁面時，檢查是否所有重要的東西都容易明顯地找到。
響應
界面的響應性意味著無論用戶使用何種設備，它都具有可用性和功能性。 界面在Sketch n高分辨率專業(yè)顯示器看上去很時尚和吸引人，卻可能在小型低分辨率屏幕上會顯得臟污。 因此，在設計階段看起來不錯的一些配色方案可能會在其應用的各種日常條件下失去美感。由于配色方案直接影響顏色，形狀和感知，所以在做出最終決定之前應該在不同設備上進行測試。
環(huán)境
Web和移動界面被用在如果目標受眾被仔細研究的情況下，可能被認為是典型的環(huán)境中。 例如，關于自然光線下的不斷使用，深色背景可以從字面上創(chuàng)造反射效果，特別是在平板電腦和智能手機典型的光面屏幕上。 相反，在光線不好的環(huán)境下，黑暗的背景可以將光線從屏幕上移開，這對導航和可讀性產生不利影響。 所以，顏色組合，對比度和色調問題在這里引起了很大的關注。
配色方案選擇清單
考慮到上面提到的因素，我們在這里提供一個簡短的基本步驟清單，同時為網(wǎng)頁或移動界面選擇一個通用的配色方案。
1.明確界面的核心功能
確定了界面實用程序和解決問題能力的核心點后，您可以更合理地選擇顏色方案。 如果UI是文本驅動的（博客，新聞平臺，電子閱讀器等），淺色背景往往是一個有效的選擇。 光線使得屏幕寬敞而寬敞，純粹專注于復制將更容易。 另一方面，如果界面是視覺化驅動的，并且移動的是圖像而不是文本，則背景為黑色或鮮明的配色方案可能是一個很好的解決方案，因為圖像的顏色感覺更深，并且總體布局變得時尚甚至奢華。
2.分析你的目標受眾
目標受眾的定義和分析是設計師應該做的首要事情。 了解誰是你的潛在用戶，他們想從網(wǎng)站或應用中獲得什么，為可用而有吸引力的界面奠定了堅實的基礎。 中年人和老年人傾向于喜歡淺色方案的界面，因為他們發(fā)現(xiàn)淺色界面更直觀和可導航。 年輕人通常會發(fā)現(xiàn)性能良好的界面具有更加原始和時尚的黑色背景，因此可以成為吸引目標用戶的方式。 青少年和兒童被吸引到使用鮮明背景和有趣細節(jié)的界面。 顏色的選擇顯然取決于界面功能和內容的性質。 但目標受眾的偏好始終是以用戶為中心的決策的良好線索。
3.研究你的競品
另一方面要記住的是，你的產品不會在未開發(fā)的市場中出現(xiàn)。 反之亦然，它將在激烈的競爭中爭取用戶的關注。 配色方案的選擇也成為使應用程序或網(wǎng)站變的突出的方式，并可以使用戶愿意做出珍貴的互動。 花費在探索該部分現(xiàn)有產品上的時間可以節(jié)省時間和精力，否則將浪費在重新設計無效解決方案上。
4.測試，測試，測試
上述要點說明了一個關鍵問題：因為顏色屬于直接影響界面的可用性和吸引力的因素，所以每個設計方案都應該在不同的分辨率下，在不同的屏幕上以及不同的條件下進行適當?shù)臏y試。 在產品投放市場之前，測試揭示了配色方案的強弱點，如果設計方案效率低下，就會失去令人驚嘆的第一印象的機會。
折衷的解決方案
不需要遵循嚴格的配色方案，用戶界面設計師有時會發(fā)現(xiàn)折衷的解決方案，如下所示。
黑暗的界面，白色的標簽
正如我們在UX設計趨勢回顧中所提到的，這種趨勢在基于黑暗背景方案的界面中特別流行。 它還提供了一個更好的方法來實現(xiàn)適當?shù)目勺x性，這通常是辯論的話題：將核心數(shù)據(jù)塊的淺背景應用框或空格，設計人員可以解決此問題，并為屏幕或頁面增添優(yōu)雅的對比。 其中一種情況是，當它得到有效應用時，是由Tubik團隊設計的Watering Tracker應用程序。
讓用戶自己選擇配色方案
另一種方法是讓用戶選擇模式。 這就是我們?yōu)閁pper做的，這是一個待辦事項列表應用程序，可為用戶提供一系列配色方案。 一方面，它使產品對用戶非常友好，并根據(jù)不僅可用性問題而且根據(jù)審美偏好進行更加個性化的選擇。 另一方面，設計師和開發(fā)人員需要額外的工作時間來制定所有的方案。
我的設計作品（Dribbble）：https://dribbble.com/exciting
本文翻譯來自Medium感謝Tubik Studio
