我們的日常生活是無(wú)盡的選擇。在個(gè)人和職業(yè)生活中，我們必須考慮許多對(duì)立面和挑戰(zhàn)，解決方案不僅基于建議，而且還基于事實(shí)，經(jīng)驗(yàn)和知識(shí)。今天，我們將討論UI設(shè)計(jì)師需要頻繁選擇的項(xiàng)目之一：哪種方案對(duì)于界面更好，光線還是黑暗？

影響配色方案選擇的因素

可以肯定的是，沒有人會(huì)為所有目標(biāo)而努力。該解決方案在很大程度上取決于許多因素，不僅涉及用戶方面，還涉及業(yè)務(wù)目標(biāo)，市場(chǎng)條件和當(dāng)前設(shè)計(jì)趨勢(shì)。讓我們回顧一下在這個(gè)問(wèn)題上必須考慮的基本因素.

可讀性和易讀性

這些術(shù)語(yǔ)都與對(duì)文本內(nèi)容的感知直接相關(guān)。可讀性定義了人們可以輕松閱讀單詞，短語(yǔ)和段落。清晰度衡量用戶如何快速直觀地區(qū)分特定字體中的字母。

應(yīng)該仔細(xì)考慮這些特征，特別是對(duì)于填充了大量文本的界面。在許多其他因素中，為界面選擇的配色方案在文本感知的有效過(guò)程中起著至關(guān)重要的作用。例如，與在不同背景下感知的物理對(duì)象一樣，白色或淺色背景上顯示的黑色副本似乎大于黑色背景上的白色副本?？勺x性差導(dǎo)致用戶體驗(yàn)不佳：用戶無(wú)法掃描數(shù)據(jù)，甚至更多 - 即使數(shù)據(jù)相關(guān)但不可讀，用戶感覺到與文本糾結(jié)的莫名其妙的時(shí)態(tài)，甚至可能錯(cuò)過(guò)關(guān)鍵信息。

這是否意味著具有淺色背景的界面更具可讀性？不總是。其中一位著名的用戶體驗(yàn)設(shè)計(jì)大師JacobNielsen提到：“在文字和背景之間使用高對(duì)比度的顏色。最佳易讀性需要白色背景上的黑色文字（所謂的正面文字）。黑色背景上的白色文字（負(fù)面文字）幾乎一樣好。雖然對(duì)比度與正面文本的對(duì)比度相同，但倒置的顏色方案會(huì)使人稍微放松一些，并會(huì)稍微放慢閱讀速度。在顏色方案中，易讀性受到更多影響，使文字比純黑色更輕，特別是如果背景比純白色更暗。

因此，如果設(shè)計(jì)師在不同背景下研究復(fù)制感知的特性并仔細(xì)研究字體選擇，那么任何配色方案都可能足夠可讀。

然而，一些追溯到20世紀(jì)80年代的科學(xué)研究表明，對(duì)于大量的文本來(lái)說(shuō)，淺色背景似乎是大多數(shù)用戶更有效的選擇。研究廣告運(yùn)營(yíng)商如何運(yùn)作，D. Bauer和CRCavonius在文章“通過(guò)對(duì)比反轉(zhuǎn)提高視覺顯示單元的易讀性”（1980）中分享了他們的探索。特別是，他們發(fā)現(xiàn)參與者在閱讀文本時(shí)精確度為26％，并且在淺色背景中使用了深色字符。

為什么會(huì)這樣？Sensory Perception and Interaction Research Group（英屬哥倫比亞大學(xué)）的JasonHarrison以下述方式解釋了這種現(xiàn)象。散光的人（根據(jù)不同的統(tǒng)計(jì)數(shù)據(jù)提供了大約50％的人口）感覺黑色的白色文本比白色的黑色文本更難察覺。其中一部分與光照水平有關(guān)。有了明亮的顯示屏（白色背景），虹膜會(huì)更加閉合，從而減少“變形”鏡頭的影響。在黑色顯示器（黑色背景）下，虹膜會(huì)打開以接收更多光線，鏡頭的變形會(huì)在眼睛處產(chǎn)生更加模糊的焦點(diǎn)。因此，基于此，如果界面呈現(xiàn)大量副本并提示長(zhǎng)時(shí)間閱讀體驗(yàn)，則淺色背景可能會(huì)感覺更加用戶友好。

無(wú)障礙

可訪問(wèn)性主要定義為Web或移動(dòng)界面盡可能接觸更多人的能力，并提供其功能，而不受任何歧視。因此，“使用還是不使用”的決定必須基于用戶的需求和偏好，而不是其身體能力。色彩方案是影響這方面的最主要因素之一。選擇調(diào)色板和顏色組合時(shí)，設(shè)計(jì)師需要考慮不同年齡，特殊需求或殘疾的用戶，這些用戶還可以確定背景和布局元素的顏色選擇。用戶研究 成為向UX設(shè)計(jì)人員提供有助于更接近目標(biāo)受眾的數(shù)據(jù)的重要幫助。

明晰

清晰度定義了查看和區(qū)分屏幕或頁(yè)面上所有核心細(xì)節(jié)的能力。首先，它涉及導(dǎo)航的簡(jiǎn)單性和直觀性：能夠掃描布局并找到信息和交互元素的區(qū)域，用戶不需要付出太多努力來(lái)獲得他們所需的東西。如果這方面沒有得到適當(dāng)?shù)臏y(cè)試，可能會(huì)導(dǎo)致視覺層次較弱，并使屏幕變得一團(tuán)糟。對(duì)比度在這里起著重要的作用，配色方案成為它的基礎(chǔ)。為了檢查，如果界面清晰并且對(duì)比度足夠，在模糊模式下查看屏幕或頁(yè)面時(shí)，請(qǐng)不要忘記“模糊效果”的一個(gè)很好的舊技巧，并檢查是否所有重要內(nèi)容都容易到達(dá)并且明顯。

響應(yīng)

界面的響應(yīng)性意味著無(wú)論用戶使用何種設(shè)備，用戶都可以使用它。Sketch n高分辨率專業(yè)顯示器看上去很時(shí)尚和吸引人，可能會(huì)變成小型低分辨率屏幕上的臟污。因此，在設(shè)計(jì)階段看起來(lái)不錯(cuò)的一些配色方案可能會(huì)在其應(yīng)用的各種日常條件下失去美感。由于配色方案直接影響顏色，形狀和復(fù)制感知，所以在做出最終決定之前應(yīng)該在多種設(shè)備上進(jìn)行測(cè)試。

環(huán)境

Web和移動(dòng)界面被用在如果目標(biāo)受眾被仔細(xì)研究的情況下可能被認(rèn)為是典型的環(huán)境中。例如，關(guān)于在自然光線下不斷使用，深色背景可以從字面上創(chuàng)造反射效果，特別是在平板電腦和智能手機(jī)的典型光面屏幕上。相反，在光線不好的環(huán)境下，黑暗的背景可以將光線從屏幕上移開，這對(duì)導(dǎo)航和可讀性產(chǎn)生不利影響。所以，顏色組合，對(duì)比度和色調(diào)問(wèn)題在這里引起了很大的關(guān)注。

配色方案選擇清單

考慮到上面提到的因素，我們?cè)谶@里提供一個(gè)簡(jiǎn)短的基本步驟清單，同時(shí)為網(wǎng)頁(yè)或移動(dòng)界面選擇一個(gè)通用的配色方案。

1.定義界面的目的。確定了界面實(shí)用程序和解決問(wèn)題能力的核心點(diǎn)后，您可以更加合理地選擇顏色方案。如果UI是文本驅(qū)動(dòng)的（博客，新聞平臺(tái)，電子閱讀器等），淺色背景往往是一個(gè)有效的選擇。光線使得屏幕寬敞而寬敞，純粹專注于復(fù)制將更容易。另一方面，如果界面是視覺化驅(qū)動(dòng)的，并且移動(dòng)的是圖像而不是文本，則背景為黑色或明亮的配色方案可能是一個(gè)很好的解決方案，因?yàn)閳D像的顏色感覺更深，并且總體布局變得時(shí)尚甚至奢華。

2.分析你的目標(biāo)受眾。目標(biāo)受眾的定義和分析是設(shè)計(jì)師應(yīng)該做的首要事情。了解誰(shuí)是你的潛在用戶，他們想從網(wǎng)站或應(yīng)用中獲得什么，為可用，有用和有吸引力的界面奠定了堅(jiān)實(shí)的基礎(chǔ)。中年人和老年人傾向于喜歡淺色方案的界面，因?yàn)樗麄儼l(fā)現(xiàn)他們更直觀和可導(dǎo)航。年輕人通常會(huì)發(fā)現(xiàn)性能良好的界面具有更加原始和時(shí)尚的黑色背景，因此可以成為目標(biāo)用戶的參與方式。青少年和兒童被吸引到使用明亮背景和有趣細(xì)節(jié)的界面。顏色的選擇顯然取決于界面功能和內(nèi)容的性質(zhì)。但目標(biāo)受眾的偏好始終是以用戶為中心的決策的良好線索。

3.研究競(jìng)爭(zhēng)。另一方面要記住的是，你的產(chǎn)品不會(huì)在藍(lán)色海洋中出現(xiàn)。反之亦然，它將在巨大而充滿活力的競(jìng)爭(zhēng)環(huán)境中爭(zhēng)取用戶的關(guān)注。配色方案的選擇也成為使應(yīng)用程序或網(wǎng)站突出的方式，并導(dǎo)致用戶方的這種寶貴的第一次互動(dòng)愿望?；ㄙM(fèi)在探索該部分現(xiàn)有產(chǎn)品上的時(shí)間可以節(jié)省時(shí)間和精力，否則將浪費(fèi)在重新設(shè)計(jì)無(wú)效解決方案上。

4.測(cè)試，測(cè)試，測(cè)試。上述要點(diǎn)說(shuō)明了一個(gè)關(guān)鍵問(wèn)題：因?yàn)轭伾珜儆谥苯佑绊懡缑娴目捎眯院臀Φ囊蛩?，所以每個(gè)設(shè)計(jì)方案都應(yīng)該在不同的分辨率下，在不同的屏幕上以及不同的條件下進(jìn)行適當(dāng)?shù)臏y(cè)試。在產(chǎn)品投放市場(chǎng)之前，測(cè)試揭示了配色方案的強(qiáng)弱點(diǎn)，如果設(shè)計(jì)方案效率低下，就會(huì)被討論并失去令人驚嘆的第一印象的機(jī)會(huì)。

妥協(xié)解決方案

不希望遵循嚴(yán)格的配色方案，用戶界面設(shè)計(jì)師有時(shí)會(huì)發(fā)現(xiàn)妥協(xié)方案，如下所示。

黑暗的界面，復(fù)制白色標(biāo)簽

正如我們?cè)赨X設(shè)計(jì)趨勢(shì)回顧中所提到的，這種趨勢(shì)在基于黑暗背景方案的界面中特別流行。它還提供了一個(gè)更好的方法來(lái)實(shí)現(xiàn)適當(dāng)?shù)目勺x性，這通常是辯論的問(wèn)題：將核心數(shù)據(jù)塊的淺背景應(yīng)用框或空格，設(shè)計(jì)人員可以解決此問(wèn)題，并為屏幕或頁(yè)面增添優(yōu)雅的對(duì)比。其中一種情況是，當(dāng)它得到有效應(yīng)用時(shí)，是由Tubik團(tuán)隊(duì)設(shè)計(jì)的Watering Tracker應(yīng)用程序

給用戶選擇配色方案

另一種方法是讓用戶選擇模式。這就是我們?yōu)閁pper做的，一個(gè)待辦事項(xiàng)列表應(yīng)用程序，它為用戶提供了一系列配色方案。一方面，它使產(chǎn)品對(duì)用戶非常友好，并根據(jù)不僅可用性問(wèn)題而且根據(jù)審美偏好進(jìn)行更加個(gè)性化的選擇。另一方面，設(shè)計(jì)師和開發(fā)人員需要額外的工作時(shí)間來(lái)制定所有的方案。

～此文轉(zhuǎn)載，如有侵權(quán)，請(qǐng)聯(lián)系刪除