實(shí)際上，在計(jì)算機(jī)誕生的早期，這巴掌大的方寸之屏一直被「深色模式」占據(jù)著。
這是因?yàn)樵?0世紀(jì)60~80年代的計(jì)算機(jī)顯示屏使用的還是只能支持單色顯示的陰極射線管（CRT），黑底綠字的展示方式就成為了當(dāng)時(shí)的常態(tài)。
即使是80年代之后，彩色CRT顯示器逐漸流行普及，但當(dāng)時(shí)主流的DOS并沒(méi)有什么「圖形界面」的概念，依然延續(xù)了先前黑底的習(xí)慣。直到1984年，蘋(píng)果發(fā)布了個(gè)人計(jì)算機(jī)Macintosh，普及了圖形用戶界面（Graphic User Interface）的概念，從而開(kāi)啟了以白色為底色的圖形交互時(shí)代。
沒(méi)想到吧，蘋(píng)果開(kāi)創(chuàng)的歷史，現(xiàn)如今又被它自己改回去了。
但即便如此，程序員們還是對(duì)深色界面情有獨(dú)鐘。早在2005年就有為Textmate編輯器設(shè)計(jì)的深色主題存在了，甚至在10年前，他們就在Reddit上開(kāi)啟了對(duì)于「深色界面」的討論：
在他們看來(lái)，深色的背景界面能讓顏色顯得更亮，以及更好地被聚焦，但白色背景在陽(yáng)光直射的場(chǎng)景下會(huì)有更好的表現(xiàn)。由此可見(jiàn)，對(duì)于「Dark Mode」的思考，從來(lái)不僅僅停留在「夜間模式」那么簡(jiǎn)單。
我們可以先在Google Trends里看一下「Dark Mode」全球被搜索量的變化趨勢(shì)：
可以看到2016年前「Dark Mode」幾乎無(wú)人問(wèn)津，而最高的搜索峰值出現(xiàn)在2019年10月，正是iOS 13這一支持「深色模式」系統(tǒng)的發(fā)布時(shí)間。
再看看百度指數(shù)的記錄：
關(guān)鍵詞「夜間模式」自2013年就已出現(xiàn)，并保持著較為平緩的熱度，直到微信適配「Dark Mode」后出現(xiàn)了峰值。關(guān)鍵詞「暗黑模式」相比之下熱度就較為慘淡了。奇怪的是Apple的官方翻譯「深色模式」以及「Dark Mode」并未被百度指數(shù)收錄，故圖中沒(méi)有相關(guān)的數(shù)據(jù)。
由此推測(cè)，「Dark Mode」的逐步流行，很大程度受到了主流的移動(dòng)設(shè)備操作系統(tǒng)的影響，例如蘋(píng)果新系統(tǒng)的發(fā)布，以及微信這類主流應(yīng)用對(duì)系統(tǒng)變化的響應(yīng)。除此以外，2013年后中國(guó)移動(dòng)互聯(lián)網(wǎng)的飛速發(fā)展，也產(chǎn)生了更多不同的手機(jī)/電腦使用場(chǎng)景。
從這份2018年的《移動(dòng)互聯(lián)網(wǎng)行業(yè)分析報(bào)告》中我們可以看出，越來(lái)越多的人選擇在夜間/較為昏暗的場(chǎng)景下使用手機(jī)，短視頻的出現(xiàn)更是讓人們不舍得入睡：
夜間使用場(chǎng)景的增加助長(zhǎng)了大家對(duì)于深色模式的需求，畢竟誰(shuí)也不想天天在被窩里被各種白色背景亮瞎雙眼。但正如前文所說(shuō)，「Dark Mode」要做的，并不是簡(jiǎn)單地滿足用戶在夜晚的使用需求，切換了深色模式后所帶來(lái)的視覺(jué)沉浸感，也是提升人們使用欲望的一大原因。
關(guān)于這一點(diǎn)，在去年的 WWDC 大會(huì)上，蘋(píng)果人機(jī)交互團(tuán)隊(duì)的設(shè)計(jì)師 Raymond Sepulveda 也對(duì) macOS 「深色模式」的使用場(chǎng)景做了進(jìn)一步解釋：
他指出，只有閱讀瀏覽或是內(nèi)容創(chuàng)作型 App 才需要長(zhǎng)期啟用深色模式，比如文字或代碼編輯。它們會(huì)借助黑底白字的高對(duì)比度特性來(lái)讓用戶視線保持集中，這大概就是我們對(duì)深色模式感到「真香」的原因之一。
與此同時(shí)，越來(lái)越長(zhǎng)的屏幕使用時(shí)間也提升了我們對(duì)于設(shè)備續(xù)航的要求，而「深色模式」在這一點(diǎn)上表現(xiàn)不俗。目前的中高端手機(jī)大多采用OLED屏幕，這一材質(zhì)自發(fā)光的特性使得屏幕能夠獨(dú)立控制單個(gè)像素是否發(fā)光，根據(jù)谷歌官方數(shù)據(jù)來(lái)看，采用OLED屏幕的手機(jī)在「深色模式」下，耗電可下降達(dá)63%。
除此之外，隨著移動(dòng)設(shè)備在主流群體中逐漸飽和，邊緣的視障群體也隨之得到了更多的關(guān)注。雖然對(duì)于「深色模式」到底是否能夠起到「護(hù)眼」的作用，大家還各執(zhí)一詞，但人們確實(shí)需要「深色模式」，也正因如此，它越來(lái)越多地出現(xiàn)在了人們的生活場(chǎng)景中；從此，白天也懂了夜的黑。
說(shuō)道「深色模式」具體應(yīng)當(dāng)如何被應(yīng)用，必然躲不開(kāi)蘋(píng)果和谷歌這兩大主流操作系統(tǒng)下的規(guī)范。先來(lái)看看它們?cè)诟髯缘脑O(shè)計(jì)文檔中是如何描述這一模式的：
Human Interface Guidelines描述道，「深色模式」應(yīng)當(dāng)隨著系統(tǒng)設(shè)置變化而變化，否則你的應(yīng)用就會(huì)看起來(lái)像出了bug。由此我們可以看出蘋(píng)果對(duì)于整個(gè)操作場(chǎng)景系統(tǒng)統(tǒng)一性的高要求，但部分App將「深色模式」作為一種可選擇的皮膚存在，一定程度上也為用戶提供了更多的選擇。
此外，在光照充足的場(chǎng)景下保證「深色模式」的可用性與在夜晚一樣重要，在任何的場(chǎng)景以及任何的界面介質(zhì)上（無(wú)論是扁平、擬物還是毛玻璃或者其它風(fēng)格），都要保證內(nèi)容的可讀性。落到具體的操作上，我們不僅要關(guān)注正常視力的人群，也要關(guān)注有視力損傷的群里。對(duì)于自定義的前景色與背景色，尤其是在使用較小字號(hào)文字的時(shí)候（根據(jù)個(gè)人經(jīng)驗(yàn)，大約以20號(hào)字為界）最好能維持7：1的對(duì)比度。
除此之外，蘋(píng)果還提出了「Dynamic System」的概念，國(guó)內(nèi)大多翻譯為「語(yǔ)義化顏色」，即不設(shè)定固定的色值，而是用其所使用的場(chǎng)景來(lái)對(duì)顏色進(jìn)行描述：
舉個(gè)例子，同樣是系統(tǒng)背景色（System Background）這一定義，在「淺色模式」下指的是#000000，在「深色模式」下則指的是#FFFFFF，這樣一來(lái)，顏色就能更好地適用于所存在的場(chǎng)景，根據(jù)它對(duì)設(shè)計(jì)目標(biāo)的優(yōu)先級(jí)來(lái)進(jìn)行動(dòng)態(tài)的調(diào)整。
再來(lái)看看Material Design對(duì)「深色模式」的優(yōu)點(diǎn)描述：
減少屏幕明度、減輕眼睛負(fù)擔(dān)、提升視覺(jué)效率、節(jié)省電量，如第二段中提到的，這些都是我們選擇「深色模式」的理由。那么在具體的應(yīng)用中我們又該怎么做呢？
和蘋(píng)果的設(shè)計(jì)風(fēng)格不同，Material Design引入了Z軸的概念，于是在界面層級(jí)的深度上就需要更為靈活的展示范圍。與蘋(píng)果設(shè)定的純黑背景不同，Material Design選擇了深灰色作為展示大范圍區(qū)域的主色，同時(shí)有節(jié)制地選用能夠適配于「深色模式」的強(qiáng)調(diào)色，并通過(guò)滿足對(duì)比度的要求提升頁(yè)面的可用性。此外，對(duì)于需要更高效利用能源的產(chǎn)品（如OLED屏幕），它鼓勵(lì)使用「深色模式」來(lái)延長(zhǎng)電池的續(xù)航時(shí)間。
Material Design下的「深色模式」主題，需要滿足以下幾個(gè)屬性：
- 對(duì)比度：深色區(qū)域與純白字體的對(duì)比度至少要達(dá)到15.8：1；
- 層級(jí)深度：使用更淺的表層顏色來(lái)表示具有更高層級(jí)位置的元素；
- 去飽和度：主色調(diào)需要降低飽和度，以讓正文本的對(duì)比度達(dá)到4.5：1的Web Content Accessibility Guidelines（WCAG）AA標(biāo)準(zhǔn)。
- 用色節(jié)制：在大面積使用深色背景的時(shí)候，有節(jié)制地使用提亮色（如淺色，低飽和色、明亮色，或高飽和色）這是因?yàn)楦唢柡投鹊念伾菀自谏钌尘吧袭a(chǎn)生眩光，降低頁(yè)面的可用性。
了解了主流系統(tǒng)對(duì)于「深色模式」的規(guī)范后，我們可以再來(lái)看看以iOS為例，有哪些App已經(jīng)適配了暗黑模式：
大致看來(lái)，深色模式的趨勢(shì)大多是先從生產(chǎn)力工具（自己?jiǎn)为?dú)用）、到群體類工具（和有社交關(guān)系的人一起用）、到富內(nèi)容的大眾型平臺(tái)（和千萬(wàn)人一起用）推廣開(kāi)的，而在這些app中，近期最具有討論熱度的莫過(guò)于微信了。
作為一個(gè)富內(nèi)容的社交工具，「深色模式」首先影響的就是其多樣的內(nèi)容生態(tài)。例如公眾號(hào)的深色配圖文案「蜜汁消失」，表情包也變成了「視力測(cè)驗(yàn)」：
所以像這類富內(nèi)容的應(yīng)用平臺(tái)，出去那些已經(jīng)被前輩大牛們分析得十分透徹的顏色、對(duì)比度問(wèn)題，如何針對(duì)不同場(chǎng)景下的內(nèi)容展示，例如圖片豐富的場(chǎng)景，如何考慮顏色的極限顯示，是在發(fā)布時(shí)進(jìn)行限定，還是由平臺(tái)進(jìn)行統(tǒng)一的后期調(diào)整，都是需要設(shè)計(jì)師去重點(diǎn)考慮的。
除了微信之外，相信有些朋友已經(jīng)注意到了，淘寶和京東近期也進(jìn)行了深色模式的適配，那么當(dāng)電商平臺(tái)遇上深色模式，會(huì)擦出什么樣的火花呢？
由這兩張截圖我們可以看到電商界面的特點(diǎn)：
- 商品圖居多，且大部分為了保證日間模式下的界面清爽程度，都會(huì)選用白底商品圖為主；
- 有很多飽和度較高、動(dòng)態(tài)效果豐富的氛圍圖存在；
此外，在實(shí)際的頁(yè)面鏈路中，往往會(huì)涉及到多種不同類型頁(yè)面的跳轉(zhuǎn)，例如從首頁(yè)進(jìn)入商詳頁(yè)、店鋪?lái)?yè)、搜索集合頁(yè)等等，更不必說(shuō)每年豐富多樣的大促活動(dòng)，這些頁(yè)面的內(nèi)容類型和展示信息偏好都各有不同，也就給電商應(yīng)用的深色模式適配帶來(lái)了極大的挑戰(zhàn)。
此外，從色彩心理學(xué)的角度上來(lái)說(shuō)，雖然深色背景能夠?yàn)橛脩魩?lái)更強(qiáng)的瀏覽沉浸感，但在大部分現(xiàn)實(shí)中的購(gòu)物中心還是更偏好于使用明度更高的顏色作為商場(chǎng)的主色，這一方面是出于與不同受眾的店鋪、品牌主色、燈光顏色進(jìn)行搭配，空間感知上也更具有膨脹感；另一方面明亮的顏色和場(chǎng)景也能更好地吸引用戶的注意力，調(diào)動(dòng)用戶購(gòu)物的積極性。
但在移動(dòng)設(shè)備的場(chǎng)景中，涉及到電子屏幕光的反射，明度過(guò)高的顏色就很容易引起用戶的視覺(jué)疲勞感。針對(duì)如此復(fù)雜且大量的色彩轉(zhuǎn)換需求，淘寶和京東都針對(duì)自身平臺(tái)的品牌特質(zhì)，進(jìn)行了對(duì)應(yīng)的調(diào)整：
除了基本的組件顏色變化，在未來(lái)的迭代中，是否可以根據(jù)深色模式進(jìn)行智能的商品圖適配（例如使用較少白底的，更具有氛圍感的單品圖），都是我們可以考慮的方向。但回歸到最原本的出發(fā)點(diǎn)，暗黑模式在電商購(gòu)物場(chǎng)景下是否能為用戶帶來(lái)更好的體驗(yàn)，還是讓數(shù)據(jù)來(lái)檢驗(yàn)吧。
承擔(dān)因您的行為而導(dǎo)致的法律責(zé)任，
本站有權(quán)保留或刪除有爭(zhēng)議評(píng)論。
參與本評(píng)論即表明您已經(jīng)閱讀并接受
上述條款。