這些天黑暗主題無處不在。

隨著人們繼續(xù)花更多的時(shí)間與科技互動(dòng)，黑暗主題提供了一種更輕松的方式與數(shù)字世界互動(dòng)。通常情況下，這些主題看起來更容易，更有吸引力，對(duì)專注的用戶來說更完美。

整個(gè)2020年，無數(shù)領(lǐng)先品牌都推出了自己版本的黑色主題。谷歌為你的硬盤提供了一個(gè)解決方案，而蘋果和安卓已經(jīng)在他們的操作系統(tǒng)中內(nèi)置了黑暗主題的性能。

如果你還沒有學(xué)會(huì)如何充分利用黑暗模式，那么你可能會(huì)錯(cuò)過一個(gè)極好的機(jī)會(huì)，讓你的設(shè)計(jì)技能與眾不同，并在未來贏得更多客戶。

為什么黑暗模式?

在我們深入探索創(chuàng)造自己的黑暗主題的可能性之前，讓我們先看看什么是黑暗模式，以及它為何如此有效。

最終，暗黑主題的創(chuàng)建是為了減少從臺(tái)式機(jī)和筆記本電腦到智能手機(jī)和智能手表等所有東西發(fā)出的亮度。黑暗主題有助于改善設(shè)計(jì)的視覺人機(jī)工程學(xué)，通過減少眼睛疲勞，調(diào)整亮度以適應(yīng)當(dāng)前的照明條件，等等。此外，許多暗模式產(chǎn)品在節(jié)省電池壽命方面也非常出色。

以下是在你的設(shè)計(jì)作品集中添加黑暗主題的一些主要好處。

更好的用戶體驗(yàn):關(guān)注用戶體驗(yàn)是數(shù)字時(shí)代最重要的趨勢之一。如果你想在今天脫穎而出，你需要愿意為每一個(gè)訪問你網(wǎng)站的人提供難以置信的體驗(yàn)。暗模式減少了從眼睛疲勞到電池功耗的一切。這有助于讓客戶在網(wǎng)站上停留更長的時(shí)間。

創(chuàng)新和前沿吸引力:大多數(shù)公司都想證明他們可以保持在行業(yè)的前沿。為網(wǎng)站主題或外觀提供可選的暗模式版本的能力可以幫助你的客戶從人群中脫穎而出。隨著移動(dòng)環(huán)境的日益關(guān)注，越來越多的公司將尋找能夠提供最佳移動(dòng)體驗(yàn)的設(shè)計(jì)師。

支持通用設(shè)計(jì):黑暗模式不僅僅適合那些在晚上對(duì)光線敏感的人。這個(gè)解決方案可能更適合視力受損的用戶，他們可能會(huì)在訪問你的網(wǎng)站時(shí)遇到眼疲勞。如果你想讓你的內(nèi)容更包容更廣泛的觀眾，那么學(xué)習(xí)如何設(shè)計(jì)黑暗模式是一個(gè)很好的開始。

設(shè)計(jì)黑暗模式的最佳實(shí)踐

暗模式的設(shè)計(jì)比你想象的要簡單。大多數(shù)時(shí)候，這只是簡單地考慮如何用一些更深更暗的東西來取代站點(diǎn)中一些更明亮、更壓倒性的方面。

這里有一些有用的建議，會(huì)讓你朝著正確的方向前進(jìn)。

1. 實(shí)驗(yàn)與顏色

很多網(wǎng)頁設(shè)計(jì)師在開發(fā)暗模式解決方案時(shí)遇到的一個(gè)大問題是，他們太過于關(guān)注純白色文本和純黑色背景。然而，這種高對(duì)比度的選項(xiàng)在一段時(shí)間后可能會(huì)有點(diǎn)多。

通常使用深灰色作為你的主要表面顏色要比真正的黑色容易得多。此外，與其使用明亮的白色，不如考慮使用略偏灰白色的替代品，這樣會(huì)更溫暖眼睛。

嘗試不太可能引起太多眼睛疲勞的表面和顏色組合。深灰色粉底通常也能提供更大的深度范圍，因?yàn)槟憧梢栽诨疑险故娟幱啊?/p>

此外，當(dāng)你在試驗(yàn)顏色時(shí)，記住飽和的顏色經(jīng)常會(huì)在非常暗的表面上產(chǎn)生劇烈的振動(dòng)，使它們更難閱讀。降低顏色的飽和度可以降低對(duì)比度，讓你的網(wǎng)站更受歡迎。

在200-50范圍內(nèi)較淺的色調(diào)在深色主題上會(huì)有更好的可讀性。然而，你總是可以試驗(yàn)?zāi)愕倪x擇。谷歌材質(zhì)設(shè)計(jì)推薦使用15:8:1左右的背景和文本對(duì)比度。

2. 考慮情感影響

暗模式設(shè)計(jì)的大部分工作是弄清楚某些顏色是如何協(xié)同工作的。鮮明的對(duì)比很容易讓人走神，尤其是當(dāng)你習(xí)慣了用白色背景工作的時(shí)候。然而，您需要記住，您是為用戶設(shè)計(jì)的，主要是尋找更容易和更柔和的瀏覽體驗(yàn)。

當(dāng)你在工作的時(shí)候，記住也要考慮設(shè)計(jì)的情感方面。在任何環(huán)境中，顏色所蘊(yùn)含的情感可以成就或破壞買家的旅程。然而，色彩心理學(xué)中一個(gè)經(jīng)常被忽視的方面是，人們?cè)诤谏尘跋聦?duì)陰影的感知是不同的。

例如，想想綠色。在明亮的背景下，它傳達(dá)了自然，甚至金融財(cái)富。然而，在深色背景下，同樣的綠色可能會(huì)讓人覺得有毒，有毒，甚至是病態(tài)的。重要的是要考慮終端用戶到達(dá)你的網(wǎng)站時(shí)會(huì)得到什么樣的印象。

3.給用戶選擇的自由

當(dāng)你開始設(shè)計(jì)黑暗模式時(shí)，你可能會(huì)犯的最大錯(cuò)誤之一就是認(rèn)為你應(yīng)該完全專注于黑暗主題。如果您與希望兩全其美的用戶進(jìn)行交互，那么就會(huì)遇到問題。如果你是專門為應(yīng)用程序設(shè)計(jì)的，你就需要能夠在明暗主題之間自然切換的網(wǎng)頁。

學(xué)習(xí)如何在您創(chuàng)建的辦公桌上同時(shí)設(shè)置暗模式和亮模式，將有助于您獲得更廣泛的客戶選擇。請(qǐng)記住，您需要在兩個(gè)主題中測試設(shè)計(jì)的性能和影響，以檢查無論用戶選擇如何瀏覽，它們都提供相同的體驗(yàn)。

雖然黑暗模式應(yīng)該會(huì)給終端用戶提供不同的體驗(yàn)，但它仍然需要讓用戶覺得他們?cè)跒g覽同一個(gè)網(wǎng)站。這意味著你需要嘗試最自然的明暗模式組合。

4. 記住最基本的

記住，盡管上述3個(gè)技巧能夠幫助你正確設(shè)計(jì)黑暗模式，但你也需要考慮你所面向的平臺(tái)的機(jī)遇和局限性。你可以為谷歌Chrome網(wǎng)站提供的黑暗模式體驗(yàn)將與你在iOS上創(chuàng)造的體驗(yàn)非常不同。

檢查您所設(shè)計(jì)的系統(tǒng)所提供的文檔將有助于您深入了解實(shí)際可能實(shí)現(xiàn)的內(nèi)容。

其他關(guān)于黑暗模式設(shè)計(jì)的建議包括:

關(guān)注你的內(nèi)容:確保你的內(nèi)容在頁面上突出，但不要太過突出。

測試你的設(shè)計(jì):不管是在亮面還是暗面，你都需要確保所有的東西都能正常工作。

為你的界面采用活力:活力有助于提高你的背景和前景之間的對(duì)比。

使用語義色彩:語義色彩會(huì)自動(dòng)適應(yīng)網(wǎng)站當(dāng)前的外觀。無法適應(yīng)的硬編碼顏色值似乎更具有侵略性。

桌面著色:試著用透明和濾鏡之類的東西給你的網(wǎng)站和應(yīng)用程序加點(diǎn)暖色調(diào)——適合深夜瀏覽

圖標(biāo):如有必要，在暗模式和亮模式中使用單獨(dú)的符號(hào)和圖標(biāo)。

準(zhǔn)備好設(shè)計(jì)黑暗模式了嗎?

為沉溺于黑暗模式的時(shí)代準(zhǔn)備你的網(wǎng)頁開發(fā)和設(shè)計(jì)作品集是一種復(fù)雜的體驗(yàn)。你需要仔細(xì)思考當(dāng)人們?cè)谒阉饕恍└⒚畹臇|西時(shí)，他們將如何瀏覽你的網(wǎng)站和應(yīng)用程序，而不是像我們所習(xí)慣的網(wǎng)站那樣在視覺上令人難以接受。

需要記住的最重要的一點(diǎn)是，你的網(wǎng)站或應(yīng)用程序上的所有內(nèi)容在暗模式下和在亮模式下看起來一樣漂亮。當(dāng)用戶想要在應(yīng)用程序中切換設(shè)置時(shí)，僅僅添加一個(gè)動(dòng)態(tài)黑色背景是不夠的。您需要深入研究您的設(shè)計(jì)，并檢查不同字體、顏色和圖像如何協(xié)同工作。