「自然交互」Ant Design 設計價值觀解析
來自專欄 Ant Design
70 人贊了文章
本文 6,500 字，預計閱讀時長 10 分鐘。
引言
一年前，我們將「自然」確立為 Ant Design 的核心價值觀，來指導我們的設計工作。一年來，越來越多的產品通過使用 Ant Design 為成千上萬用戶提供優質的企業級服務；同時，也有越來越多的設計體系基於 Ant Design 蓬勃生長。這一次，我們將清晰闡述「自然」這一價值觀，希望能啟發或幫助大家完成自己的產品 / 體系構建；同時，你們的反饋和互動也會成為我們進步的源泉和動力。
真誠地邀請設計師反饋共建，一起讓用戶體驗美好~
在接下來一系列的文章，我們會從「什麼是人機自然交互」、「為什麼選擇自然作為價值觀」以及「如何實現人機自然交互」這三個方面進行論述，詳細闡述我們背後的思考和實踐。
什麼是人機交互
對比建築設計和工業設計，人機交互設計是一個相對年輕的領域，同時這三個領域又有諸多共性。縱觀幾十年的人機交互應用史，我們經歷過初期的 TCD（以技術為核心的設計）、BCD（以商業為核心的設計），直到現在撥亂反正的 UCD（以用戶為核心的設計）。那麼未來會走向哪裡？發展了幾千年的建築設計和幾百年的工業設計，目前已經很少提及以用戶為核心的設計。尤其在建築設計領域，我們更多感受到的是大師對於人、環境、建築三者和諧共處的探討和實踐。
我們可以以史為鑒，從建築領域、工業產品領域獲取靈感，來觀察整個人機交互的發展現狀，以及推測未來的發展方向。
工業設計中的功能
所謂的功能：並非只存在於「人」或「工具」一方，而是藉由雙方的力量進行融合。
——深澤直人
上圖中有兩把鎚子，一把在美國叫 Hammer；一把在日本叫做金槌。兩把工具在主要功能和結構上差不多，但是在設計理念上差異很大。
- 先看 Hammer 的設計。考慮到人在使用鎚子時，需要很大力氣敲擊，但是由於塑料材質比較滑，所以設計師在手柄的下半部分添加了黑色橡膠，通過增強摩擦力。這看起來沒問題，卻忽略了一些使用細節。人在使用鎚子時，往往先握住手柄中上部將釘子定位；再滑到手柄底部，大力敲打釘子。而這額外的橡膠卻阻礙了滑動。
- 再看金槌的設計。由於是木製手柄，在一開始使用時沒有多大區別。但是多次滑動和大力握持後，人的手汗和勁道會和木製手柄發生反應，從而改變手柄的形狀。這些重複的互動行為，讓手柄中部光滑，從而容易滑動；讓手柄底部出現握痕，從而更容易施力。
正如深澤直人說的，功能是由人和工具共同完成的。所以，我們不能孤立的看待人，或者孤立的看待工具/系統，尤其在人機交互領域。
人機交互的定義
人機交互（英語：human–computer interaction[1]，縮寫：HCI，或 human–machine interaction，縮寫：HMI），是一門研究系統與用戶之間的互動關係的學問。系統可以是各種各樣的機器，也可以是計算機化的系統和軟體。
——來自《維基百科》
人機交互這個英文是 Human-Computer Interaction ，我們可以拆開來 4 部分理解：
- Human：人類，下文統稱人
- Computer：計算機或者系統，下文統稱系統
- Inter + action：互相的影響、作用。Inter：在...中，間；action：作用，行為，動作。
通俗的講，人機交互指的是人和系統互相影響、互相作用的過程。
- Human Output—>Computer Input：人將信息處理後，通過 Actions 將其輸出；系統通過 Controls 接受這些輸入，引發系統狀態的改變。
- Computer Output—>Human Input：系統將改變後的系統狀態，通過 Display 輸出；人通過感知器官，將這些 Information 作為輸入，並引發人腦的信息處理，並引發下一個輸出。
人機交互中的 7 個階段
1988 年，Norman 在《The Psychology of Everyday Things 》（中文名：設計心理學 1）中，將行為的 7 個階段引入到設計中。雖然距今已超過 30 年，但其理論任然具有很高的指導價值，尤其是對於研究人機交互設計中。在接下來的論述中，我們會將這個理論作為基本框架，不斷進行推理和演化。
人機交互的過程，可以分為以上 7 個階段。舉個例子來說明：
- 假設辦公室空調很冷，那我形成一個目標：調整辦公室氣溫。
- 我可以自己去去調整空調，也可以讓別人調高空調，這就是達成我目標的計劃。
- 最後我決定自己去調整，那麼我要先離開座位走過去，並找到空調調節按鈕，這是我計劃的確認序列。
- 具體如何離開座位，先邁左腳還是右腳，用左手還是右手，這是我具體實施執行動作的細節。
- 操作完成後，我通過視覺從儀錶盤看到溫度數值的變化，以及通過皮膚從環境中感知到溫度變化（如果靠的夠近的話）。
- 將我視覺和觸感進行認知，eg：23° 變成 26° 是溫度升高的信號；皮膚的觸感也會告訴我，溫度有上升。
- 將我認知到的結果和目標進行對比，eg：這個溫度不冷了，剛剛好。
注??：當然不是所有的人機交互都要走完這個過程，也不是所有的人機交互都是從目標開始的。我們很多行為可以非常快速完成，只需要經歷幾個階段。舉個例子說明：
- 假設我們從一個很暗的房間到了一個亮光處。
- 我們的眼睛（感知器官）感受到強光後，原先放大的瞳孔會自動縮小，眼皮也會眯起來，甚至手也會不自覺地抬起來遮擋光線。這個過程快速，幾乎沒有意識參與，也沒有具體的目標。就是發生了。
小結
- 研究人機交互，不只著眼於「人」和「機」，更要關注人和機互動的過程。
- 人機交互包含了 7 個階段，分別為：目標、計劃、確認、執行、感知、認知、對比。
什麼是人機自然交互
人腦的重量雖然只佔人體重量的2％左右，但是大腦消耗的能量卻佔全身消耗能量的20％。人體消耗的能量主要由膳食中的糖、脂肪和蛋白質提供。 但人腦在利用能源物質上與其他器官不同，它主要依靠血液中的葡萄糖氧化供給能量。
——《MBA 智庫百科》神經系統比身體任何一個部位消耗的葡萄糖都多。若把葡萄糖當錢幣來比喻的話，費力的心智活動顯然特別昂貴。當你主動做一個困難的認知推理，或做一個需要自我控制的作業時，你的血糖會下降。——《快思慢想》
在人機交互的行為中，除了在「執行」、「感知」過程中會消耗體力，在「目標」、「計劃」、「確認」、「詮釋」、「對比」看不見的活動也會消耗腦力，消耗高質量的葡萄糖。甚至對於現代腦力勞動者而言，腦力的消耗會遠大於體力消耗。回想一下以下過程：
- 考試前一天複習完整個學期的課程，走出圖書館大門之後，是不是想大吃一頓？
- 周五下午回顧完一周的工作，並完成周報的撰寫，感覺飢餓的可以吃掉一頭牛？
- 除了努力思考，白日做夢也是會消耗葡萄糖，也是會累的。
所以，大腦（神經系統最主要的組成部分）屬於非常典型的「體積小、能耗高」的器官，能量消耗約等於肌肉消耗。在物質極度匱乏的時代，人體將大量的優質葡萄糖和氧氣供給一個看似無用的寶貝，這是極其奢侈的。然而在進化過程中，我們的祖先選擇並持續進化我們的大腦，最終成為萬物之靈，那自然有其原因。
人腦是如何運作，從而保證我們在惡劣的生存環境中存活下來的呢？
人腦中的兩套系統
先做兩組試驗，其中左側記做黑色組，右側記做白色組。
- 在黑色組中存在兩列字，如果這個字偏向左邊，就在心裡默念左；如果在這個字偏向右邊，就在心裡默念右。
- 在白色組中也存在兩列字，操作同上。
多嘗試幾次後，是不是覺得黑色組有點難度，感覺腦子裡有兩個小人，同時一不小心出錯率也會提高；而白色組就簡單多了，因為壓根看不懂字，很自然默念出來（不過對於泰國人就沒那麼簡單了，因為白底上恰是泰文的左和右）。
在幾百萬年的進化中，人的大腦形成了兩套不同的思維模式，來合理高效的利用能量。在黑色組的實驗中，正是有這兩個不同系統在同時工作，甚至產生了衝突。
在《快思慢想》一書中，諾貝爾獎得住丹尼爾·卡尼曼將它們定義為「系統 1」和「系統 2」：
系統 1：自動化運作，非常快，不費力氣，即使要費力，也很少，它不受自主控制。舉幾個例子：
發現一個物體比另外一個物體遠回答 2+2=？在棋局中發現一條好路（如果你是象棋大師的話） 系統 2：動用到注意力去做費力的心智活動，包括複雜計算。它的運作通常都跟代理人、選擇和專註力的主觀經驗有關。舉幾個例子：在賽跑時，注意裁判的槍聲（如果你不是專業運動運的話）回答 66x73=?維持比平常更快的步伐
系統 1 和系統 2 的工作分配非常有效率：它將工作符合減至最低，將效能充分提高。常規時，系統 1 自動化運作，處理常見問題；系統 2 則處於很舒適的低費力模式中，只用一小部分的資源在運作。當系統 1 碰到困難，就呼叫系統 2 支持，提出比較詳細和比較特定處理方式，以解決目前的困難。eg：貝多芬的電話號碼。系統 1 和系統 2，經常會有衝突。eg：你努力控制自己的眼睛，不看奇裝異服的客人。
在剛才的實驗中，系統 1 能快速識別一個字在「偏左」還是「偏右」，同時系統 1 也能快速識別這個漢字是「左」還是「右」（對於識字的人）；但是黑色組中，有些字明明「偏左」卻寫成了「右」，系統 1 感知到困難，就呼叫系統 2 來支持，來進行控制和認知。
系統 1 和系統 2 是由心理學家 Keith Stanovich 和 Richard West 率先提出的術語，又在丹尼爾·卡尼曼的《快思慢想》一書中得到詳盡推理和廣泛傳播。但是系統 1 和系統 2 是一種代號，在設計圈是一種陌生辭彙，也並不友好。所以，筆者想尋找一些設計師能理解的辭彙，來代替這兩個系統的稱謂。此時，無意識設計走入我們的視野。
無意識 unconscious 和意識 conscious
我把無意識定義為所有那些未被意識到的心理現象的總和。這些心理內容可以恰當地稱之為「閾下的」。如果我們假定每一種心理內容都必須具有一定的能量值才能被意識到的話，一種意識內容的能量值越是變低，它就越是容易消失在閾下。
——卡爾·榮格《本能與無意識》
榮格用能量值的概念來區分人腦的兩種不同工作模式，非常貼切和具有啟發性。能量消耗是區分無意識和意識的根本標準，也是區分系統 1 和 系統 2 的根本標準。
所以，在後續的行文中，筆者會將「系統 1 ≈ 無意識」，將「系統 2 ≈ 意識」，以便設計圈理解和學習。雖然在科學界並不精確，在設計領域卻恰到好處。
小結
在這幾百萬年的進化中，正是進化出了這兩套不同的模式：低模式處理日常、低難度的行為，讓我們的祖先在惡劣的自然環境中生存下來；高能耗模式處理異常、高難度的行為，並逐步進化成萬物之靈。複雜事情簡單化；簡單事情標準化；標準事情流程化；流程事情自動化，萬事莫不如此。
而我們今天講的「人機自然交互」，就是如何讓「人機交互」自然，其實是要求我們關注能量的消耗，關注眾多無意識人機交互行為。所以，自然的人機交互核心：節能，既要節省身體運動的體力，更要節省大腦思考的腦力。
我們現在知道了人腦/神經系統存在兩套工作模式，那麼在人機交互的設計中，我們應該注意什麼？
人機交互的動態耗能
如上圖所示，我們將能耗的概念引入到人機交互的 7 個階段中。其中，越靠近人的部分往往越耗能，越是有意識的。在一個相對常規的人機交互行為中，意識和無意識的分割線往往在「計劃」和「對比」這兩個階段之下。
但是對於異常的狀態或者需要學習的情況下，這條區分意識和無意識的分割線會動態調整，會大幅下降，甚至會下降至「執行」和「感知」這層之下。比如：
- 玩手機太久了，發現抬胳膊都需要付出很大的努力/能量；
- 身體機能發生病變後，行走、站立這些對於普通人極其容易的事情，都需要付出很大的努力/能量。
當然在人機交互過程中，分割線的動態調整主要來自於「學習」這一種特殊過程。
學習前
人必須有意識地控制注意力，付出很多能量來學習「制定動作序列」和「對事物進行認知」上。
回想教練教授我們如何靠邊停車時，這包含了一系列動作序列：打轉向燈，觀察後視鏡，踩剎車，打方向盤，緩慢滑行，避開消防栓，把車挺穩，拉手剎，關閉轉向燈等動作。
學習後
通過「過度學習 overlearning」/刻意訓練，可以將這些意識行為轉換無意識行為，讓他們自然而然的發生。
我們通過幾十次的訓練，我們終於可以自如的做到靠邊停車，再也不用記住動作的前後順序，也不需要刻意控制踩剎車的力度、滑行的距離，停車這一動作就不再需要這麼多意識介入，一切發生的非常順利。
碰到異常時
如果有新問題、錯誤和僵局發生時，意識才會再次介入。
如果今天上了一輛新車，剎車的腳感完全不同，一踩就停，此時你就必須讓意識介入避免危險的發生。
小結
對於不同的人機交互行為，會存在不同的耗能表現；同時，對於同一個人機交互行為的不同階段，也會存在不同的耗能表現。所以我們在進行設計時，應當注意幾點：
- 保證產品視覺和交互的一致性，可以有效減少用戶學習的數量，從而減少整體能耗。
- 通過映射、隱喻等方式，提升產品的易學習，讓用戶能夠快速渡過新手階段，也能減少單個能耗。
認知和情感
認知和情感是緊密交織在一起的，在認知的任何階段都有可能產生各種情感，同時情感也會影響相關的認知和行為。下文羅列了 Norman 在《設計心理學 3》的部分結論，方便大家理解。該段將大腦處理信息的三個層次的理論模型（本能層、行為層、反思層），運用在認知和情感處理過程中。在認知心理學上雖然是一種近似模型，但是對於設計這類應用領域已經足夠適用了。
- 本能層面：是人類情感系統最基本保護機制的一部分，能夠對環境做出快速的判斷：好或壞，安全或者危險。
- 本能的反應是快速和自發的。
- 本能層次與身體的肌肉——運動系統緊密相連。eg：緊張出汗
- 本能的反應是迅速的，完全是潛意識的。
- 偉大的設計師用他們的美學素養激發人的這些本能反應。
- 行為層面：是學習能力之本，在適當的匹配模式下被觸發。（前饋，就是去觸發這個模式）
- 當一個行為學習的很好時，我們所要做的就是認清目的，行為層次會處理其他所有細節。
- 對設計師而言，行為層次最重要。嘗試讓每個行為都與一個期望相關聯。如果期待一個積極的結果，其結果就是一個積極的情感反應（正價反應）；反之，成為負價反應。
- 行為狀態是可以習得的。當對行為的結果有很好的了解和預知時，就會產生控制感。
- 反思層面：是有意識的認知之本。是發展深層理解的地方，是產生推理和有意識決策的地方。
- 是認知的，有深度的而緩慢的，通常在事件發生以後才產生反思。
- 最高層次的情感來自反思層次，因為在這個層次確認事件的緣由，對未來進行預測。如果將因果關係加在經歷過的事件，人們會產生諸如內疚或者自豪的情緒，也會責備或者讚揚他人。
人機自然交互，創造極致心流
認知是環境輸出信息和人類輸入信息的重要通道，是人機交互的必備環節，所以情感和認知產生互相影響和作用的同時，也必然和人機交互產生同樣的影響和作用。那麼，當我們追求人機自然交互時，會產生什麼樣的情感？或者說，什麼樣的情感會對人機自然交互產生好的影響？
首先，雖然人機交互過程有 7 個階段，但不是所有的人機交互都一定要走完 7 個階段。舉兩個例子：
- 人碰到滾燙熱水，手會快速收回。在整個過程中，人只是經歷「感知」（感覺到滾燙），然後就「執行」（立馬將手收回），所用人機交互過程只發生在「本能層」，「反思層」的意識往往是事後才介入的。
- 看到微信/釘釘/郵件上的紅點，我們會不自覺的去打開。通過不斷的重複和訓練，我們養成了一種在「行為層」上的習慣，看見紅點就會無意識的自動點擊和閱讀，完全沒有「反思層」接入，反而控制自己不去看成了一種意識行為。
其次，一個行為往往由多個子行為完成，如果讓人在子行為的執行過程匯中頻繁讓意識介入到「反思層」，這不僅消耗更多能量，而且還會讓人分散注意力，讓人不斷產生和當前任務無關的想法和行為。舉個例子：
- 假設我們要完成一個彙報 PPT 並準備明天進行彙報，這個行為往往會有很多個子行為組成。
- 一開始我們非常順利，在投入半個小時候之後，可能一次困難操作或者一個粗魯彈框或者意外電話，都可能打斷了原先的行為，我們意識開始活躍和介入，將當前的注意力轉移去處理這些額外行為。
- 當我們處理完這些額外行為後或者過程中，活躍的意識會不自覺進行擴散，將注意力轉移到其他事情上，比如：和旁邊的同時聊個天；或者感覺肚子餓了，點個下午茶外賣。
- 當下班時間逼近時，我們不得不努力控制自己的注意力聚焦到原先的行為上，避免它在發散耽誤正事。但是，控制自己的注意力集中在某項事情上，本省就非常耗能。
所以，如無必要，勿擾用戶。一旦意識活躍或者介入大腦後，就像打開潘多拉的魔盒一樣，對人機自然交互的形成有害無益。這不不僅僅是因為意識行為非常耗能，更重要的是控制自己的注意力聚焦在當前任務更加耗能。對於那些需要長時間投入的行為/任務時，尤其明顯。
最後，讓人機交互過程集中在「本能層」和「行為層」，有助於人一個接一個完成行為，不僅僅降低整體能耗，更重要的是創造一種極其重要的心理學現象（ Flow 心流）。這是一種將個人精神力完全投注在某種活動上的感覺；同時，心流會引發高度的興奮感及充實感。在這種狀態下，把所有精力集中在手頭上的事情上，不用去控制自己的注意力，忘卻時間、忘卻自己、忘卻自己的問題。
備註：米哈里·齊克森認為，使心流發生的活動有以下特徵：
- 我們傾向去從事的活動
- 我們會專註一致的活動
- 注意力投入在當前活動
- 動作與意識的合併
- 反思自我意識的喪失
- 有清楚目標的活動
- 有立即回饋的活動
- 我們對環境與動作有主控感--挑戰與技能之間達成平衡
- 在從事活動時我們的憂慮感消失
- 主觀的時間感改變--例如可以從事很長的時間而不感覺時間的消逝
小結
作為設計師，我們應該將更多的注意力集中在「本能層」和「行為層」中，更多將人機交互行為控制在無意識狀態下，這樣才能讓人機自然交互。
這不僅僅能減少能耗，讓人高效完成這一系列任務；同時，這種狀態還能人感覺到極大興奮感、充實感、控制感，這是人機自然交互想要追求的最佳情感反饋，也是我們追求的最佳體驗。
總結
- 人機交互是人和系統互動的過程，不應該孤立的看人，或者孤立的看系統。
- 人機自然交互的核心在於：節能，既要節省身體運動的體力，更要節省大腦思考的腦力。
- 人機自然交互，創造極致心流。
參考書籍
《快思慢想》/《思考，快與慢》
《生態學的視知覺論》
《讓設計自然存在的新》
《設計心理學 1》
後續
本篇文章主要闡述「自然」這一價值觀的前因後果。在接下的文章中，提供實現和評價自然人機交互的原則和技巧，啟發在具體業務中應用。主要內容會從【執行線：前饋】和【評估線：反饋】兩個思路出發。
其中【執行線：前饋】已經有了初步框架，後續會逐步夯實：
- 利用情景和之前的用戶行為來推送功能
- 歷史記錄（偏好路徑）
- 文化習俗
- 人際關係
- 元數據
- 感測器
- 空間、時間
- 防呆理論
主編輯：林外
副編輯：瀚雅
最佳瀏覽體驗，可訪問自然——Ant Design 設計價值觀 · 語雀
最後的最後
一位建築設計師亞歷杭德羅·阿拉維納接到這樣一個任務：為智利北部無家可歸的人，建造一個社區。但是所有的資金全部來源於政府資助，而且每戶只有非常有限的 7500 美元，包括全部的土地與建築經費；然而同樣標準的住房大約花費 3 倍以上，所以錢遠遠不夠。
在一段時間思考之後，他決定啟動一個用戶參與式的設計流程，讓這些無家可歸的人參與進來。他為每一戶設計了一半的房子，人們可以在建好的一半房子中生活，也可以通過自己的努力再建另外一半。
不要孤立的看待人，也不要孤立的看待系統，要相信人和系統互動的力量。設計師應該發現並引導這些行為的發生，將得到難以置信的力量。
三年之後，一個活躍社區，拔地而起、欣欣向榮。
Not Design，Just Find.
推薦閱讀：