為了給公司同事闡述這兩個問題，作者搜集了大量資料，翻閱了相關產品系統(tǒng)所給出的設計文檔，重點圍繞“什么是暗黑模式”展開，逐步推敲其中的理論原理，總結出便于理解的文字內容。這樣做的目的簡單有二，一是與產品、開發(fā)、測試方面的同事能夠達成向暗黑模式優(yōu)化升級的共識；二是能夠讓我們的各個產品線更從容地去擁抱暗黑模式的到來。

/“由理有劇”系列篇01：我們怎樣理解暗黑模式

文章大綱

1、是什么？

2、為什么？

一、是什么？

隨著 iOS 13 和 Android 10 的正式發(fā)布，“暗黑模式 (Dark Mode)”一詞逐漸走入了我們的視野，“暗黑模式是什么？”這個問題也一度霸占了Google搜索榜首。想要深入了解暗黑模式，也許我們可以換一個角度，從用戶界面的演進歷史中尋找線索，從而幫助我們更好地理解暗黑模式。

作者自從拜讀了《蘋果三劍客》，對于用戶界面的前世今生才有了更深的了解，蘋果的產品發(fā)展史，某種程度上也可以稱為用戶界面的演進史。廢話不說，下面讓我們一起簡單聊聊。

1、原來，“Dark Mode”是用戶界面的起源

計算機誕生的早期，其顯示器一直以“暗黑模式”面向操作者，其緣由是早期的顯示技術一直被CRT主導，CRT釋義為“陰極射線顯像管”，在19世紀末被研制出來，因為制造原理相對簡單，所以CRT一直是早期電腦顯示的主力，但在上世紀80年代之前僅支持單色顯示。

下面兩圖分別為蘋果公司于1977至1980年間生產發(fā)售的 Apple II 及 Apple III 型計算機

圖中顯而易見，兩款計算機的顯示方式均為單調的黑底白字或綠字，呈現出一種“暗黑模式”的視覺效果。蘋果公司的 Apple II 和 Apple III 兩支產品線一直以這種“暗黑模式”面向用戶。這也反映了早期的計算機以輸入代碼執(zhí)行數字運算作為主要功能，但是這從另一方面反應出：未來計算機會借助不斷成長、成熟的電子技術，必將掀起一場接一場的變革，用戶界面也隨之不斷地革新。

2、Apple Lisa（麗薩）奠定了計算機向“圖形用戶界面”演進的基礎

上個世紀80年代之后，CRT彩色顯示技術成熟，逐漸流行普及到各個電子行業(yè)，但當時主流的計算機操作系統(tǒng)并沒有“圖形界面”這個概念，所以大部分計算機產品依舊延續(xù)了先前黑色背景的顯示方式。

直到1983年1月9日，在年度股東大會上，蘋果宣布了兩款將在未來的計算機行業(yè)中占據關鍵地位的產品：一款叫 Apple Lisa （麗薩，老喬的第一個女兒），蘋果第一臺（也是全球第一款）基于圖形用戶界面（GUI）的計算機，也就是 Macintosh 的前身；另一臺叫 Apple IIe ，是已獲高度成功的 Apple II 系列的新一代進階產品。

Apple Lisa 向主流個人電腦行業(yè)介紹了一種全新的鼠標控制的圖形用戶界面，宣布向單調的黑白用戶界面告別。

運用形象的圖標、方便的下拉菜單和重疊的窗口，替代了此前一貫使用的輸入文字命令，Lisa的圖形用戶界面開啟了消費者與個人電腦交互方式的革新之路。盡管Lisa存在諸多缺點，如定價過高，功能缺失、運行緩慢等，但它的圖形用戶界面依然給它贏得一陣喝彩。

Lisa的GUI影響如此深遠，以至于諸多電腦制造商紛紛加入鼠標控制的GUI領域，爭相模仿。就在Lisa首次亮相十個月后，微軟于1983年11月推出了Windows操作環(huán)境。（對于此事，老喬總是公開譴責微軟的蓋茨抄襲他的產品創(chuàng)意，甚至想讓蓋茨吃官司，兩位大佬一直不合也是業(yè)界皆知，跑題了...）

///一個有意思的事兒：今年7月份，一位外國的蘋果粉在Twitter上發(fā)布了一條關于 Apple IIe 型計算機的動態(tài)，內容展示了自己使用 Apple IIe 型計算機進行智能化任務的過程，如發(fā)送推文、在Evernote中寫作、發(fā)送電子郵件，甚至控制智能家居（如下圖）。要知道，這臺計算機生產發(fā)售至今已有37年的時間。由此感嘆，不得不說蘋果對于產品的品控做到了那個時代的。

3、Macintosh（麥金塔）推動了“暗黑模式”向“淺色模式”的邁進

1984年，蘋果發(fā)布了個人計算機 Macintosh（麥金塔），Macintosh 延續(xù)了 Lisa 的圖形界面語言，并向世界普及了圖形用戶界面（Graphic User Interface）的概念，從而開啟了以白色為底色的圖形交互時代。

Lisa獲得的一些成就在 Macintosh 上體現的淋漓盡致，包括靈活的鼠標、點陣影像圖、桌面的布局、形象的圖標、相稱的字體、屏幕上方的下拉菜單和重疊的窗口，這些也得益于日益成熟的顯示技術和不斷進步的計算處理技術。形象生動的圖形設計和界面交互一直是老喬最引以為傲的杰作，不得不說，老喬對于計算機行業(yè)甚至是設計行業(yè)都有著極高的敏感度和先于旁人的前瞻性。（當然，這里的主語應該是蘋果）

Macintosh 產品的成功，不是蘋果一味地迎合計算機消費市場，而是利用創(chuàng)新的方式引導市場，引領計算機行業(yè)向人性化的用戶界面發(fā)展、邁進。

至此，我們也徹底地向“暗黑模式”說了再見，全面擁抱“淺色模式”的到來。

4、“淺色模式”成為用戶界面的主流

麥金塔搭載的 System 1 打破了字符終端的模式，淺色的界面風格一直持續(xù)到 System 6 都沒有顯著的改變。直到1991 年的 System 7 開始引入彩色，圖標也增加了隱約的灰色，藍色和黃色陰影。System 7 系列中的 7.6 版本正式被蘋果公司改名為 Mac OS ，而這一年是1997年。

與此同時，微軟的 Windows 從黑屏的 DOS 發(fā)展到全屏幕的 Windows 1，再到較為成熟的 Windows 3，最后演變到奠定當今 Windows 界面基礎的炫麗多彩的 Windows 95。用那個時代的眼光來看，微軟的變化是相當驚人的，微軟儼然成為了一匹計算機行業(yè)的黑馬，一路趕超蘋果成為行業(yè)霸主，而蘋果因為因循守舊，在界面設計上從領先掉到了最后。

此后，從 Mac OS 8 到 Mac OS X Server 1.0 ，蘋果一直專注于改善操作系統(tǒng)和優(yōu)化界面表現，直到2001 年 3 月，經歷了四個開發(fā)者預覽版和一個公共測試版之后的 Aqua 界面終于跟隨 10.0 正式發(fā)布，發(fā)布后改變了人們對計算機界面的印象，在隨后的10年里蘋果一直沿用這套界面風格。

OS X 系列用戶界面較大的更新來自于2007年10月發(fā)布的 10.5 Leopard 豹，雖然基本的界面仍為 Aqua 和其糖果滾動條，但新加入了一些鉑灰色和藍色，另外重新設計的 3D Dock和更多的動畫交互使得新界面看上去 3D效果更強，此外還改進了 Finder、半透明菜單條并新增了最初只用于 iTunes 的 Cover Flow界面。

整體來說，Mac OS X 10.5 Leopard 豹 這一版本的用戶界面相比之前有了翻天覆地的變化，靈活生動的圖形語言和交互體驗重新得到了用戶青睞，蘋果也以此，再一次走上了引領潮流之路，使得多彩的“淺色模式”成為用戶交互界面的主流。

蘋果開創(chuàng)性的界面圖形語言也延續(xù)到了移動設備領域。

2007年的初代iPhone作為蘋果公司第一個移動設備產品（iPhone1代）首次亮相市場，驚艷了整個行業(yè)，iPhone搭載的 iPhone OS 和后來更名為 iOS 的系統(tǒng)，延續(xù)了 Mac OS 用戶界面的設計語言。在歷代iPhone上可以看到沒有物理鍵盤侵占空間的屏幕，精美的的方塊圖案整齊的排列開來，顏色豐富且耐看。

依稀記得當時的我們，還玩著黑白屏幕上的俄羅斯方塊，還敲打著物理鍵盤上的九宮格，挪雞鴨也表示永不為奴。

2010年堪稱iPhone史上最重要的一年，蘋果推出了“改變一切”的iPhone 4，并對其用戶界面進行了革新。

生動的擬物化設計風格正式成為業(yè)界潮流，這也使得UI行業(yè)逐漸熱了起來，蘋果的界面設計規(guī)范也順勢成為了主流的移動端設計規(guī)范。

蘋果以此作為移動端界面設計的基礎，沿用到之后的iPhone系列中，期間iOS系統(tǒng)的風格保持依舊，只有 iPhone 5S 搭載的 iOS 7 做出了圖標由擬物化向扁平化的改變，但整體都以“淺色模式”作為主流的用戶界面視覺模式。

5、“暗黑模式”的正式登場

在 Mac OS 的系統(tǒng)上，用戶可以通過“通用設置-外觀”來對整體界面進行淺色、深色的切換，可以看出，蘋果早已把“暗黑模式”納入到他們的開發(fā)隊列中，也就是說，“暗黑模式”的概念主要來源于蘋果的 Mac OS，這也為“暗黑模式”的正式登場埋下了伏筆。

自從有了這個概念之后，很多網站都為用戶提供了“淺色”和“深色”兩套界面，便于用戶根據自己的習慣或愛好進行切換。在 Mac OS 之后，很多 App 和 Android 定制 ROM 也加入了所謂“深色模式”的支持，其中也不乏 Web 端的網站、系統(tǒng)等。

北京時間2019年6月4日，果粉期待已久的蘋果WWDC19如期而至。

發(fā)布會上，庫克一如既往地優(yōu)先調侃了Andriod系統(tǒng)一番….（蘋果一直喜歡用數據說話，想了解的同學可以回顧一下發(fā)布會的視頻）

言歸正傳，在發(fā)布了一系列硬件之后，庫克終于介紹了大家期待已久的 iOS 13。新發(fā)布的 iOS 13，除了提升系統(tǒng)流暢度和增加系統(tǒng)穩(wěn)定性外，還介紹了其他提升用戶體驗的優(yōu)化。

其中，最為引人注目的“暗黑模式”即將亮相于新系統(tǒng)。

發(fā)布會表示，暗黑模式可以“改善電池壽命，改善視力不佳和強光下的人的可視性，以及在弱光環(huán)境中更好地使用設備”。

“Wow，beautiful！”、“That’s beautiful！”、“That’s so beautiful！”發(fā)布會的主持人一邊演示使用在暗黑模式下的App應用，一邊不由自主地發(fā)出贊美。這也許也受到了老喬的影響，猶如在劇場舞臺中心的話劇演員，有著一種無可比擬的自信和氣場。

但有意思的一點是，主持人展示了 iOS 13 暗黑模式的開發(fā)團隊合照，從極客穿著到賽博朋克式的暗黑搖滾裝扮，這一戲劇性的變化似乎在告訴大家：“玩，我們也是認真的。”

發(fā)布會上簡單演示了暗黑模式下的漂亮界面，雖然沒有過多地闡述暗黑模式的開發(fā)細節(jié)，但是這標志著暗黑模式“重新”登上歷史舞臺。

6、小結

我們從蘋果產品發(fā)展史中，不難發(fā)現蘋果對于用戶體驗的理解是具有創(chuàng)造性的，總是能先于用戶發(fā)現用戶的潛在需求。蘋果產品的發(fā)展史也可以稱之為用戶界面的演進史，從早期黑色背景的計算機桌面發(fā)展到以淺色為主的用戶界面，再到 iOS 13 正式發(fā)布的“暗黑模式”，這一過程貌似是在“返祖”，但這些始終是圍繞以用戶體驗為中心的改變和突破。

“暗黑模式”是什么？拋開技術理論，簡單理解就是降低用戶界面在設備上的亮度，以深色的背景、較低的對比度、灰階的色彩來呈現用戶界面，提升用戶使用產品的體驗。

二、為什么？

上面我們提到了，根據 Apple 官方的說法，暗黑模式可以“改善電池壽命，改善視力不佳和強光下的人的可視性，以及在弱光環(huán)境中更好地使用設備”。

我們可以圍繞這個說法，結合我們與設備、環(huán)境的關系進行探討。

1、更好地適應弱光環(huán)境

隨著人們對智能設備的依賴性越來越強，設備使用的時間也高頻覆蓋了白天到黑夜，夜晚使用的頻率更是與日俱增，所以暗光環(huán)境的使用需求被實實在在地擺到了臺面上。以設計職業(yè)為例，在阿里巴巴 UCAN 2019 設計大會上分享的數據結果顯示：設計師群體夜晚的工作時間通常在5-6個小時…

不是在加班就是在加班路上的我們更習慣于在夜間工作，夜間安靜的環(huán)境更能讓我們專注設計、靈感爆棚。但這也在另一方面表達了我們需要設備更加符合我們在弱光環(huán)境下的視聽需求。

Dark Mode 由此應運而生，使用暗色模式可以縮小屏幕顯示內容與環(huán)境光強度的差距，可以保證使用者在暗光環(huán)境下使用設備的舒適度。也就是說 Dark Mode 可以降低屏幕的整體視覺亮度，降低對眼睛的視覺壓力，再也不用怕夜晚的設備屏幕刺瞎我們的雙眼了。

但這里我們要理解一個概念，“降低對眼睛的視覺壓力”并不等同于所謂的“護眼”，夜晚使用暗黑模式的設備，實際上并沒有改變屏幕的“頻閃”問題，所以說用戶看屏幕的時候依舊會有視覺疲勞的癥狀，所以各位大佬還是晚上少看屏幕，多愛護眼睛吧。

2、更好地專注顯示內容

想象一下，我們在電影院看電影時，為什么要全場關燈？

甚至有些APP， 在影片的下方也會有一個模擬關燈效果的按鈕，來讓整個手機屏幕變黑， 只剩下視頻畫面的部分，這都幫助我們可以更專注、更沉浸在當前的內容下，也就是所謂的“沉浸感”。

這其中的原理就是色彩本身是具有層級關系的，深色會在視覺感官上自動后退，淺色部分則會向前延展，這樣對比強烈的層次關系可以讓用戶更注重被凸顯出來的內容和交互操作；尤其在信息負責界面內層級關系的合理拉開對操作效率都有明顯的促進作用。

這一點在股票交易軟件上就是最好的驗證，目前來看全世界絕大多數的股票軟件采用的都是負極性，也就是暗色底的設計方式。紅色和綠色代表的漲或跌（不同國家顏色表示可能不一樣）在這樣的深色背景下就會特別顯眼，還有一些顏色比如藍色用于某些數據的走勢圖。這樣的顯示幫助用戶更好地集中精力在數據獲取上，更快地做出決策。

3、更好地迎合消費品味

這里所提到的消費品味是來自用戶層面的潛在心理需求。

從心理學角度而言，顏色可以影響觀者的感受和情緒，這直接影響到用戶對于一個事物的判斷和選擇，這就像我們消費購物一般，有時候我們的消費不完全是為功能、實用性買單，而更加看重的是一個產品的外觀屬性，當產品的外觀符合我們的消費審美甚至超越預期時，我們往往會更快地做出消費選擇。

而黑色在積極層面的外在直觀表現為高貴、莊嚴、鎮(zhèn)定、神秘，這代表著黑色相比其他顏色存在著更多的可能性，這也造就了黑色成為百搭色，可以作為其他顏色的底色、陪襯色進行使用。暗黑模式也存在同樣的心理暗示，沉穩(wěn)、神秘的黑色會讓用戶聯(lián)想到產品的穩(wěn)定和高級，提升用戶的心理信任度，迎合用戶的消費品味。

4、更好地改善電池壽命

最后才探討耗電功效方面的問題，算是一個壓軸問題了，在某種程度上說，智能移動設備目前最大的矛盾是性能與電池功效的博弈。如果去微博等社交網站進行搜索可以發(fā)現，為了省電而使用深色主題或者說黑暗模式的用戶大有人在，尤其是一些中高端采用 OLED 屏幕的手機。這是為什么？

暗黑模式省電的作用來源于 OLED 這種材質的特性，這種屏幕經過多年發(fā)展如今已經取代了 LCD 在中高端手機上的地位。和 LCD 依賴于背光不同，OLED 自發(fā)光的特性使得屏幕能夠獨立控制單個像素是否發(fā)光，也就是說畫面越黑，采用 OLED 屏幕的手機就越省電。下圖做了一個簡單的理解示例，每一列的格子代表亮度，在不同亮度下有相對應的耗電量顯示，閃電的亮度代表耗電量的多少。

理解了簡單含義，我們再來看一下Notebookcheck上對于OLED功耗的專業(yè)研究數據。在使用 OLED 屏幕時，屏幕上顯示的內容決定了功耗。當屏幕基本全黑時（OLED <1% White），OLED 屏在任何亮度下的功耗都保持恒定。顯示了白色內容的屏幕，功耗曲線會隨著亮度提高而逐漸變陡。

上面的可視化圖表相對來說可能需要一定的理解時間，讓我們翻譯簡化一下。

上圖顯而易見，OLED屏幕的耗電量不僅受到亮度高低的影響，關鍵在于在OLED屏幕顯示了什么，有多少區(qū)域是淺色甚至是白色的，有多少區(qū)域是深色甚至黑色的，深色區(qū)域占比越高，相比較之下OLED屏幕也就越省電。這也就證明：OLED屏幕在使用以深色為主的顯示模式時，能夠降低耗電量，提升供電效率，也就是改善電池壽命。

///題外話：關于為什么我們的智能設備普遍采用OLED屏幕，可以參考Notebookcheck（文本鏈接），小伙伴們可以自行研究。

文章來源：站酷   作者：強強0075

藍藍設計( www.bouu.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業(yè)提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務