文：喬莎莎 | 轉(zhuǎn)自微信公眾號：騰訊大講堂
談論交互設(shè)計本質(zhì)是起源于日常的很多談論，不管是向朋友介紹自己從事 " 交互 " 相關(guān)崗位，還是需要向親戚通過三言兩語解釋自己的工作內(nèi)容；甚至在工作的上下游溝通中，也經(jīng)常會被問道 " 你怎么就判斷用戶是這么想的 "" 產(chǎn)品如何從 0（概念）到 1（頁面界面）的 "；這些問題促使我想要追本溯源，捋順一下交互的由來、工作內(nèi)容，以及依照什么方法執(zhí)行等問題。
01 交互前言
現(xiàn)在談論的 " 交互 " 是一個泊來詞，本來的漢語語境中沒有這個概念，或者說漢語語境中的概念并不是現(xiàn)在經(jīng)常提到的用戶體驗設(shè)計中的這部分內(nèi)容。這就導致很難解釋，詞語的界定模糊不清。為了更接近今天談論的交互的概念，不妨把 " 交互 " 拆解一下，分成 " 交流、互動 "。
交流、互動是一個非常容易理解的語境，在日常生活中持續(xù)進行。不僅發(fā)生在當代，也不僅發(fā)生在人與人之間，甚至于每一種文化背景中都可以理解這個概念。
在下面的圖中，我們可以觀察到：圖 1 人與人之間通過語言、表情、肢體等等傳達，都是他們交流互動的表征；圖 2 人站在水里，水紋波動，水與人之間也存在著一種溝通交流；圖 3 包含人與物的，躺在椅子上的人，本身就是與椅子持續(xù)的互動。這么一看，交互真是非常自然、無處不在。人與環(huán)境（H-E-I）、人與人（H-H-I）、人與物（H-O-I）之間都是存在著交流互動，也就是有 " 交互 " 的關(guān)系。
當然上面談到的只是大的范疇上的 " 交互 " 概念，大的范疇有助于我們?nèi)ダ斫饨换サ谋举|(zhì)上是一個研究交流、互動的概念。
但也是因為概念的寬泛，導致模糊不清、不能辨明。那更具體的交互概念，也就是今天我們經(jīng)常談論的互聯(lián)網(wǎng)中用戶體驗設(shè)計相關(guān)的 " 交互 " 概念，是怎么樣的呢？這個概念源于 20 世紀 80 年代，計算機科學興起之后，涉及到很多——人的輸入界面，最初指的是 " 計算機相關(guān)的設(shè)計 "，后來比爾 · 摩爾理吉提出了 " 交互設(shè)計 " 的概念，為人與計算機的輸入與輸出尋找一種合理的溝通方式，這就是交互設(shè)計的由來。
人與計算機的交互（Human-computer-interaction 簡稱 HCI）的合理溝通方式也是從本身已經(jīng)存在的人與環(huán)境、人與人、人與物的交互演化來的。比如圖 5 的語音輸入也是模仿了人與人之間的溝通交流，使用語音作為最自然的交互方式；圖 6 虛擬現(xiàn)實的交互則模仿了人本身在鏡子前面換衣服的場景，讓人與機器的交流順暢自然。
交互設(shè)計的概念提出之后，也不是一層不變的，計算機本身的更新、增多，個人計算機用戶的普及等等都對交互設(shè)計的演化起到了推動作用。到了 2007 年，這個概念變得熱切起來，Bill.Moggridge 在麻省理工出版了《Designing Interactions》一書，提供了燈塔式的作用。等到 2010 年 iphone4 橫空出世之后，每個人都在向別人展示自己的 iphone4 的滑動界面、圖片放大、唱片轉(zhuǎn)動等等，而不再執(zhí)著于手機的翻蓋還是滑蓋之爭。人與計算機（手機是一種手持計算機）的交互被前所未有的關(guān)注了，更多的可能性被打開，交互設(shè)計也開始成為一個更普及的概念、獨立的崗位。
02 交互設(shè)計，設(shè)計什么
交互設(shè)計雖然是叫做 " 設(shè)計 "，但是感覺跟傳統(tǒng)的造物設(shè)計并不同。這里可以舉一個例子，下面的兩張圖片都是必勝客的廣告。圖 7 展示了必勝客的新品披薩，體現(xiàn)了披薩的色澤鮮亮、食材優(yōu)質(zhì)、色香味俱全，我們一般稱圖 7 為一個產(chǎn)品 / 平面的設(shè)計；圖 8 則不同，畫面中包含了很多內(nèi)容：兩個點披薩的人、使用一個可以點披薩的桌面、正在 DIY 披薩菜單等等。圖 8 其實算是一個比較典型的交互設(shè)計，來具體分析一下圖 8 包含了什么。
圖 9 中將整個點餐的場景進行了分解，可以看到圍繞著點披薩的這個目的，場景中包含了以下五個元素：點餐顧客（people）、點披薩（purpose）、點餐行為動作（actions）、餐臺多媒體（means）、披薩店的環(huán)境場景（contexts）；其實這個也就是辛向陽博士提出的交互設(shè)計的五個元素。
交互設(shè)計的五要素在圖 9 中看是比較混亂的，可以試著整合一下。如圖 10 中所示，交互設(shè)計五要素可以按照這樣排列，因為工具（means）、場景（contexts）是已經(jīng)存在的次背景，所以重要關(guān)注的應該是主線流程：用戶（people）采用什么樣行為、有哪些關(guān)鍵動作節(jié)點（actions）才達到了自己的最終目的（purpose）。這樣就會發(fā)現(xiàn)，交互設(shè)計由傳統(tǒng)的平面、產(chǎn)品等對物的設(shè)計轉(zhuǎn)化為對用戶行為的設(shè)計。
交互（interaction）本身泊來詞，原詞 interaction 就是由 inter-action 組成，對 action（動作）的設(shè)計是交互設(shè)計的本質(zhì)，action（行為動作）和 reaction（動作的反饋）構(gòu)成了交互的基本單元。交互設(shè)計是對用戶行為動作（action）的設(shè)計。
03 為什么梳理交互邏輯
交互的初衷是為了幫助用戶與計算機的溝通，溝通需要遵循一定的邏輯方法。計算機邏輯到底與用戶邏輯有什么出入呢，這里可以舉一個 Alan cooper 在《軟件創(chuàng)新之路——沖破高技術(shù)營造的牢籠》里提到的比喻：想象有一架客機，客機有兩個艙門，左邊是飛行員的駕駛艙，右邊是乘客艙。飛行員和乘客的目的地是相同的——他們都想平安到達目的城市。但是他們面臨的場景卻很不同：
飛機員艙要面臨很多任務，保證飛機平穩(wěn)加速、安全起飛、云流層、與控制臺聯(lián)絡、安全降落等等；飛行員控制著這架飛機，熟知一切突發(fā)場景，了解復雜情況的背后邏輯。
乘客卻很不同，登上飛機之后，放棄對飛機的控制權(quán)，只想簡單的度過兩個小時，最后安全的達到目的地。
飛行員和乘客可以喻指：產(chǎn)品的開發(fā)人員（產(chǎn)品經(jīng)理、開發(fā)人員）和用戶；兩者面臨的場景很不同，產(chǎn)品開發(fā)面臨各種產(chǎn)品背后的邏輯、復雜的子任務、意外情況等，所以思維是嚴謹復雜的，任何可能出現(xiàn)的意外情況都要被考慮到，所以他們遵循著 " 功能邏輯 "；但是用戶很不同，他們使用產(chǎn)品為了達到目的，并不在意背后邏輯，也不打算對產(chǎn)品進行控制，遵循著 " 行為邏輯 "。
由此可以預見，產(chǎn)品開發(fā)人員與用戶之間因為遵循邏輯不同，存在著天然的鴻溝，不同的邏輯對應不同的產(chǎn)品走向。下面兩個打印機可以說明遵循 " 功能邏輯 " 和 " 行為邏輯 " 不同的產(chǎn)品走向：
圖 12 是我們公司的大型打印機，功能非常強大，可以完成 A4、A3 打印復印、雙面掃描、復印質(zhì)量很高；但是很遺憾的是，我第一次使用的時候完全一頭霧水，不得不找來詳細的教程，一步一步操作，還因為鏈接不上求助專業(yè)同事，甚至直到現(xiàn)在，我仍然沒有辦法保證自己能夠一次雙面復印成功——因為我沒有辦法分清楚反面復印的紙張的朝向，這就是一個典型的遵循了 " 功能邏輯 " 的產(chǎn)品。
圖 13 是 2013 年紅點產(chǎn)品設(shè)計的一個獲獎作品，這也是一個掃描復印機的設(shè)計，操作特別簡單，對準要復印的內(nèi)容，按住手柄下方的掃描，就可以完成掃描，然后在新的紙張上按住手柄上方的按鈕，就可以對剛剛掃描的內(nèi)容進行復?。徽麄€流程出奇的簡單，也已經(jīng)滿足了 80% 的掃描復印的用戶需求，相信看過一遍應該都會用；為什么這個手柄復印機如此簡單好用？它遵從了 " 行為邏輯 "，從用戶使用打印機的目的出發(fā)，規(guī)劃了合理的行為。
對比了 " 功能邏輯 " 和 " 行為邏輯 " 之后，不難發(fā)現(xiàn)，行為邏輯讓用戶的認知成本更低，更愿意使用。但是生活中還是充斥著很多功能邏輯的產(chǎn)品，是產(chǎn)品開發(fā)人員不愿意改進產(chǎn)品的使用體驗嗎？其實誰也不想與用戶為難，之所以會發(fā)生這種與用戶使用體驗背道而馳的情況，是因為產(chǎn)品開發(fā)人員不了解用戶和用戶的邏輯，自然開發(fā)出來的東西無法與用戶產(chǎn)生共鳴、被用戶認同。
04 怎么進行交互設(shè)計
前面提到如果不了解用戶和用戶的邏輯，就沒有辦法開發(fā)出被用戶認同的產(chǎn)品。那么交互設(shè)計顯然就需要想辦法連接用戶和產(chǎn)品開發(fā)者，梳理產(chǎn)品功能，遵循用戶邏輯，幫助產(chǎn)品得到用戶的共鳴?；氐轿覀冏铋_始提到的交互設(shè)計的五個元素，除了媒介工具、場景是根據(jù)不同的任務具體而定的，這里暫且不做討論。其余主線流程需要關(guān)注的元素剩下三個：用戶、行為動作、目的。
下面我們就對三個元素分別進行討論：
了解用戶
關(guān)注任務流程中的用戶要素，主要是關(guān)注用戶做決策的過程。了解用戶大腦做決策的過程，可以幫助設(shè)計師無限接近用戶的想法，與用戶產(chǎn)生同理心。
下面有三種類型的問題，看一下大腦的決策過程：
起床之后那只腳先放進拖鞋？
算數(shù) 15＊16=？
投資什么基金？
對于：
第一類問題，用戶的決策幾乎是無意識的，不需要消耗注意力的情況下，就已經(jīng)憑借直覺做出了反應；
第二類問題，不管是先把 15*16 分成 15*2*8 還是 15*10+15*6，都是用戶根據(jù)自己以往的經(jīng)驗，有意識的去分析解決，并且一次只能專注在這一個任務；
第三類問題，用戶無法直接做出決策，需要研究大量的規(guī)則、知識，尋求外界手段輔助決策過程。
在大腦認知和心理學上，這三個決策過程被歸納為 " 自主心智 ( Autonomous mind ) "" 算法心智 ( Algorithmic mind ) "" 反省心智 ( Reflective mind ) "，這個概念比較難理解，舉個比較形象的比喻，就是用戶大腦決策的 " 省電模式 "、" 正常耗能 "、" 發(fā)燙模式 "；大腦一點都不喜歡 " 發(fā)燙 "，大腦最喜歡 " 省電 "。
了解了大腦的 " 省電 " 機制之后，根據(jù)心理學對心智的結(jié)論（本文不再展開說明），可以歸納為用戶設(shè)計中應該注意的幾點規(guī)則：
用戶討厭思考，喜歡選擇顯而易見的答案；
生動的信息更容易被接受，信息的表現(xiàn)會影響用戶的決策；
喜歡遵循自己既往的經(jīng)驗、路徑，只了解自己的邏輯。
這幾點規(guī)則基本上幫助設(shè)計師了解了用戶：用戶喜歡簡單的流程，只用自己能夠理解的產(chǎn)品，遵循自己既有的經(jīng)驗習慣。
了解目的，對應路徑種類
不同的目的會影響用戶的行為路徑，搞清楚用戶目的，才能規(guī)劃出合理的行為步驟。這里舉個天貓商城的例子，來說明一下目的對應不同路徑，這里有三個目標：
逛雙十一會場，看一看有哪些優(yōu)惠商品；
搜索洗面奶，比較、選擇一下；
購買蘭蔻洗面奶。
面對三個目標，用戶的行為路徑會隨著目標不同而變化，在第 1 個逛雙十一商城的目標中，用戶的路徑是隨機的，隨時可能被內(nèi)容吸引，完成不同的路徑軌跡；第 2 個搜索洗面奶，比較選擇的目標中，可能會不停的收藏，再返回挑選，這個動作是往復式的；第 3 個明確購買蘭蔻洗面奶，目標明確，任務是推進式的，持續(xù)深入的過程。
從上面的路徑分類可以清晰的看出：不同的目的對應了不同的路徑，隨機式、往復式、漸進式是一種對路徑的簡單分類。搞清楚目標之后，可以初步劃分路徑種類。
合理拆分動作流程
目的明確之后，路徑的種類也就明確了，下一步是在既定目標下，合理的劃分動作流程中的關(guān)鍵節(jié)點。什么是關(guān)鍵節(jié)點呢？有個段子，問如何把大象放進冰箱。其實答案也挺簡單的：
（1）把冰箱門打開
（2）把大象放進去
（3）把冰箱門關(guān)上
這個段子流程的劃分三個節(jié)點是沒問題的，每個步驟都是在前面一個步驟完成的情況下持續(xù)進行，但是之所以這個問題成為一個段子，是因為第 2 個步驟是不合理的，大象無法放進冰箱，這個步驟的問題沒有解決，那么這個流程就無法跑通。
所以，如何合理拆分動作流程呢？講一個合理的用戶流程，劃分出關(guān)鍵的動作步驟，找到步驟中的問題，解決問題，最后給出完整的方案。在這個里面，首先要做的是規(guī)劃一個合理的用戶流程，流程是應該符合用戶預期的。舉一個例子來說明一下如何符合用戶預期。
假設(shè)我現(xiàn)在想要給手機號碼充值，那么我們來設(shè)想一下，手機充值需要哪些步驟？大致歸納一下有三個步驟：
（1）要充值的手機號碼
（2） 確認充值多少錢（用 " 確認 " 是因為很多軟件提供了默認金額）
（3）付款搞定。
這是我們設(shè)想中的手機充值的步驟，也就是對這個任務規(guī)劃的一個用戶流程。下面體驗一下天貓商城充值和微信手機充值：
圖 20 中展示了天貓的整個手機充值過程，在天貓的營業(yè)廳的右上角找到了充值入口。下面是我的充值描述：
首先輸入了自己的手機號碼，發(fā)現(xiàn)金額那里有一個下拉框，點擊了一下沒有反應；
好的，這是一個輸入框，我輸入了 10 元，點擊立即充值；
突然彈出了一個新的彈窗，手機號碼不見了，我只好重新輸入了一遍手機號碼，此時金額默認為 50 元，但是我想充值 10 元，這里沒有；
我點擊了其他金額，選擇了 10 元，頁面顯示 " 缺貨 "，立即充值按鈕置灰，這個時候不知道怎么退出這個流程，因為點擊其他金額沒有了反應，只好點了彈窗右上角的 " × "；
又退回了之前的右上角入口，但是號碼并沒有被記錄；
為了體驗產(chǎn)品，我耐心又輸入了一遍號碼，并且放棄了 10 元，直接輸入 50 元，點擊立即充值；
提示我沒有登錄天貓，讓我拿手機掃二維碼，我拿出手機掃碼登錄；
終于來到了支付寶收銀臺。
整個充值過程我輸入了三次號碼，經(jīng)歷三次金額選擇，兩個設(shè)備的切換，粗略經(jīng)歷 8 個步驟，這跟我在開始之前預期的用戶流程相距甚遠，糟糕的體驗讓我?guī)缀踉诿恳粋€步驟流失。
圖 21 中展示了我體驗微信手機充值的流程：
打開微信充值之后，發(fā)現(xiàn)自己的號碼已經(jīng)被記錄，只有六種金額；
選擇最小金額，支付完成。
可以發(fā)現(xiàn)整個過程只經(jīng)歷了兩步，甚至比我之前預期的用戶流程 3 個步驟還要更少，體驗順暢，流程劃分合理。
舉這個例子是基于對兩個產(chǎn)品的體會，好的流程、合理的步驟是交互設(shè)計的重點，優(yōu)質(zhì)的流程拆分會極大的增加用戶粘性，反之則面臨流失。
總結(jié)
借鑒辛向陽博士的交互設(shè)計五元素，基本上貫穿了本文的架構(gòu)，交互設(shè)計的淵源本來就是自然的設(shè)計語言，交互設(shè)計是設(shè)計用戶的行為，與行為相關(guān)的 " 用戶 "、" 目標 "、" 動作拆分 " 則都是交互設(shè)計師的研究、工作內(nèi)容，對每個元素更深入的理解，都可以幫助交互設(shè)計師準確的判斷、給用戶帶來認同。
擴展
本文提到的交互理論只是交互與人物學科的一個交叉范疇，交互設(shè)計不是一個單獨底蘊的學科，它與各種學科交叉互溶，與藝術(shù)的、美學的、技術(shù)的、造物的也都有不同的方向，可能也會遵循不同的設(shè)計理論。
用戶做決策的過程非常復雜，跟用戶個體的既往經(jīng)驗、文化背景、感性理性思維等等都有關(guān)系。我自己也只是在不斷探索中。
更多擴展，歡迎探討。
參考文獻
[ 1 ] 交互設(shè)計 - 從物理邏輯到行為邏輯，辛向陽；
[ 2 ] 混沌中浮現(xiàn)的交互設(shè)計，辛向陽；
[ 3 ] 軟件創(chuàng)新之路 - 沖破高技術(shù)營造的牢籠，【美】Alan cooper；
[ 4 ] 超越智商：為什么聰明人也會做蠢事，【美】基思 .E. 斯坦諾維奇 .
