當(dāng)我們談?wù)摻换ピO(shè)計（Interaction Design）時，可能有人會疑惑：在體驗設(shè)計（User Experience Design 簡稱UX Design）為主流的今天，為什么還要關(guān)注交互設(shè)計？
其實，交互有廣義和狹義之分，
廣義的交互不僅僅是指互聯(lián)網(wǎng)企業(yè)中的交互設(shè)計崗位，也包含從人機交互、人因工程等發(fā)展而來的大交互學(xué)科
（各大院校的交互設(shè)計專業(yè)）。而用戶體驗設(shè)計和UI設(shè)計只是互聯(lián)網(wǎng)發(fā)展中形成的職業(yè)類別：
所以說，無論是體驗設(shè)計、UI設(shè)計甚至是服務(wù)設(shè)計，它們都建立在交互設(shè)計的基礎(chǔ)之上。交互設(shè)計具備的學(xué)術(shù)背景和理論深度，是連接理論與實踐的橋梁，它幫助我們從執(zhí)行任務(wù)的“匠人”，變成能夠深入理解背后的邏輯和目的的“設(shè)計師”。
很多同學(xué)雖然非常熟悉信息架構(gòu)、任務(wù)流程和頁面搭建等工作，但他們?nèi)匀桓械嚼Щ?，無法將這些內(nèi)容串聯(lián)起來，也不清楚底層邏輯，就是因為他們?nèi)狈换ピO(shè)計學(xué)科背景的深入理解。只有掌握了交互設(shè)計的學(xué)科知識，設(shè)計師才能在職業(yè)道路上走得更遠，更好地理解和應(yīng)用設(shè)計原則。
今天我們就以“學(xué)科+職業(yè)”的方式，真正系統(tǒng)地介紹一下廣義交互設(shè)計的基礎(chǔ)知識。主要包括以下幾部分：
什么是交互設(shè)計，為什么會有交互設(shè)計；
第二章 交互設(shè)計依托的學(xué)科理論基礎(chǔ)
這門學(xué)科的背景是什么，理論依據(jù)在哪里；
“交互”這個詞是從Interaction意譯的，詞義為“相互作用”，從中文來說，即交流、互動。在人與人之間，相互的打招呼、交流，就算是最簡單的交互。那么人和機器之間的交流互動是什么樣的呢？舉個例子，如果你想給朋友發(fā)一條信息，交互過程可能是：
打開微信 → 打開對話框 → 輸入文字 → 點擊發(fā)送
在這個過程中，每一步的操作，手機都有所反饋，比如點擊微信icon，就會進入主界面，點擊“發(fā)送”，信息就會發(fā)到對方微信，一系列的操作和反饋就構(gòu)成了交互。
所以簡而言之，當(dāng)人和一件事物（無論是人，機器，系統(tǒng)、環(huán)境等等）發(fā)生
雙向的信息交流和互動
，就是一種交互行為。這種交流和互動必須是雙向的，如果只有一方的信息輸出，而沒有第二方的參與，就只是信息展示而不是交流互動。來而不往非交互。比如我們平時看到的平面廣告，只是信息呈現(xiàn)，沒有交互性，而下面的廣告設(shè)計，就具備了交互的屬性：
上圖是一個戒煙產(chǎn)品廣告，一般狀態(tài)下，畫面中的男士神態(tài)正常，當(dāng)有人在附近吸煙時，畫面中的男士就開始咳嗽。這個廣告牌會根據(jù)外界的變化而呈現(xiàn)不同的反饋。
既然“交互”是交流、互動，那么“交互設(shè)計”簡單來說，就是設(shè)計如何交流如何互動，讓交流和互動更加自然更加順暢。
交互設(shè)計有廣義和狹義之分。從廣義上說，人與外物的所有交互都是交互設(shè)計的范疇，比如一個人要開門，是用門把手還是直接推，需要鑰匙還是指紋，這屬于廣義的交互設(shè)計。而狹義的交互設(shè)計，就是特指人與互聯(lián)網(wǎng)產(chǎn)品或智能產(chǎn)品的交互，在這里主要討論后者。所以我們之后所說的“產(chǎn)品”主要就是指運行在各種聯(lián)網(wǎng)終端（手機、電腦、Pad、電視等）上的網(wǎng)站、應(yīng)用等產(chǎn)品，或者是可聯(lián)網(wǎng)并具有交互性的智能設(shè)備，如智能汽車，智能機器人，智能音響等。
另外從職位角度來看，交互設(shè)計專門指在互聯(lián)網(wǎng)產(chǎn)品設(shè)計過程中確定了產(chǎn)品功能之后、視覺設(shè)計之前這一段，主要包括功能架構(gòu)的搭建、用戶流程的設(shè)計和界面元素的排布等方面，眾多的交互設(shè)計培訓(xùn)班就是在做這部分的培訓(xùn)。比如一個APP的登錄注冊，打開登錄頁是開始，登錄成功是結(jié)束，這個過程如何進行，期間遇到各種問題如何解決，就是職業(yè)交互設(shè)計的范疇。
而從學(xué)科角度來看，交互設(shè)計是
定義、設(shè)計人與人造系統(tǒng)如何關(guān)聯(lián)的設(shè)計領(lǐng)域
。學(xué)術(shù)角度，對于交互會有更多偏研究的內(nèi)容，而不僅僅像職業(yè)交互設(shè)計師一樣去解決用戶需求，還要考慮很多基礎(chǔ)性的問題，比如人與環(huán)境的關(guān)系、人與人造物的關(guān)系等。
交互設(shè)計是由IDEO的一位創(chuàng)始人比爾·摩格理吉（Bill Moggridge）在1984年一次設(shè)計會議上提出的。后來它逐漸綜合了人機交互，人因工程，認(rèn)知心理學(xué)等領(lǐng)域的知識，形成了專門用于解決產(chǎn)品在使用和體驗方面問題的學(xué)科領(lǐng)域。
那么到底為什么會出現(xiàn)交互設(shè)計這個領(lǐng)域呢？
以前的產(chǎn)品，其實并不需要交互設(shè)計，比如較早的洗衣機（下圖左），只需要一個開關(guān)就足夠了，但是后來，有了雙桶、半自動、全自動洗衣機，操作越來越復(fù)雜，這時就需要交互設(shè)計師去研究用戶的使用流程與操作方式，
讓用戶能夠與復(fù)雜功能和平相處
：
這是實體產(chǎn)品的例子，計算機方面，比如以前的DOS系統(tǒng)（下圖左），一個命令對應(yīng)一種結(jié)果，只需要記住就行，也不需要交互設(shè)計，后來有了
圖形界面（下圖右），有了鼠標(biāo)，操作就變得復(fù)雜，就需要交互設(shè)計師和界面設(shè)計師來定義軟件系統(tǒng)。
所以說，
交互設(shè)計是順應(yīng)時代需求而產(chǎn)生的
，當(dāng)工程師無暇處理人與機器的交流互動問題時，交互設(shè)計師便應(yīng)運而生了。
在短短30多年的發(fā)展中，交互設(shè)計已經(jīng)涉及方方面面，從最初的網(wǎng)頁設(shè)計，app設(shè)計，到智能設(shè)備、自然界面設(shè)計，甚至是服務(wù)體驗，都可以通過交互設(shè)計的方法找到解決方案。當(dāng)前交互設(shè)計的研究重點已經(jīng)放在了多模態(tài)（多通道）、多媒體交互，虛擬交互以及人機協(xié)同等方面。
新學(xué)科基本不會憑空誕生，一般都是從已有學(xué)科發(fā)展過渡而來，
往往是當(dāng)已有學(xué)科無法解決新出現(xiàn)的問題時，就會在他們的基礎(chǔ)上誕生新的學(xué)科
。而交互設(shè)計就是在工業(yè)設(shè)計、人機交互等學(xué)科的基礎(chǔ)上，借鑒人因工程，認(rèn)知心理學(xué)等領(lǐng)域研究結(jié)果，逐漸融合而成的一門交叉學(xué)科。下面這幅圖基本展示了交互設(shè)計的學(xué)科結(jié)構(gòu)，但并不全面：
這里由于篇幅原因，只簡單介紹與交互相關(guān)性較大的幾個領(lǐng)域：工業(yè)設(shè)計、人因工程、人機交互與認(rèn)知心理學(xué)。
對于工業(yè)設(shè)計(Industrial Design)大家應(yīng)該相對比較熟悉，很多大學(xué)都開設(shè)了工業(yè)設(shè)計專業(yè)。它與交互相關(guān)性很高，所以大量的工設(shè)畢業(yè)的學(xué)生都從事了交互設(shè)計職位（主要是薪資差別太大哈哈）。
從設(shè)計對象上來看，交互設(shè)計的對象比較偏網(wǎng)站、APP之類的虛擬產(chǎn)品，而工業(yè)設(shè)計主要針對實體產(chǎn)品，比如電腦、吸塵器、交通工具之類的，所以會更多的考慮產(chǎn)品的外觀、材質(zhì)、內(nèi)部結(jié)構(gòu)設(shè)計等。當(dāng)然對于電視、音響等操作較為復(fù)雜的產(chǎn)品，工業(yè)設(shè)計師也會考慮很多人與產(chǎn)品交互的問題，比如電視遙控器的設(shè)計就是一個經(jīng)典題目。不過交互設(shè)計的對象會更加的集約化、系統(tǒng)化和精細化，所以對于設(shè)計分析和方案實現(xiàn)方面，有了更高的要求。
工業(yè)設(shè)計與交互設(shè)計的融合
另外，工業(yè)設(shè)計與交互設(shè)計在很多方面都是相通的。特別是當(dāng)前市面上很多智能設(shè)備，都需要工業(yè)設(shè)計師和交互設(shè)計師緊密配合才能做出即好用又好看的產(chǎn)品。在漫長的工業(yè)設(shè)計發(fā)展史中，涌現(xiàn)的很多設(shè)計思考和方法，都可以為交互設(shè)計帶來養(yǎng)分，比如一直以來都在討論的“形式與功能”的問題，是形式追隨功能還是功能追隨形式或是功能形式各自獨立，其實跟交互與UI的關(guān)系很像，歷史總是在不斷的重復(fù)。
人因工程（Ergonomics）又稱為人機工程、人體工學(xué)等，主要是探討和應(yīng)用人類行為、能力本能極限和其它的特性等相關(guān)信息來設(shè)計器具、機器、設(shè)備、系統(tǒng)、任務(wù)、工作及其相關(guān)所屬的周遭環(huán)境，以增加生產(chǎn)力、安全性、舒適感和效率，進而提升人類的生活品質(zhì)。
人因工程對交互設(shè)計較大的貢獻主要有兩個方面：
一是人體測量。
首先是下圖所示的各種人體尺寸、活動范圍的測量，這些在實體產(chǎn)品中運用很廣泛。除了這些測量以外，還有對于記憶極限、注意力極限等的測量，對于交互中的可用性易用性提高都有很高的參考價值。
二是以人為中心的設(shè)計觀念。
現(xiàn)在各個設(shè)計領(lǐng)域都在提倡以人為中心，其實這個理念最早是由人因工程提出的，這種理念使設(shè)計師開始關(guān)注人的操作過程、人的感受，使得各種產(chǎn)品都有了巨大的進步。
很多人把交互設(shè)計和人機交互混為一談，其實這是不同的兩個領(lǐng)域。
簡單說來，
人機交互主要是為交互設(shè)計提供技術(shù)支持
，比如多點觸控、手勢交互等，都是人機交互的學(xué)科范疇。它研究人與機器之間進行信息傳遞的理論、技術(shù)和設(shè)備，既包括技術(shù)研究（包括算法、硬件技術(shù)等），也包括心理學(xué)研究；而
交互設(shè)計相對來說，是屬于設(shè)計中的一個領(lǐng)域，是一種實踐方法，
通常為了解決特定使用場景下特定人群的使用過程中，人與機器（或軟件、網(wǎng)站）如何更方便簡單地「對話」的問題。
當(dāng)然兩者也有比較大的交匯，比如人機交互研究中發(fā)現(xiàn)的一般規(guī)律可以指導(dǎo)交互設(shè)計或提供參照，人機交互研究中還包括對交互設(shè)計方法論的研究，而交互設(shè)計實踐中遇到的挑戰(zhàn)和難題也能夠促發(fā)新的人機交互研究。
在介紹交互設(shè)計的定義時，我們提到它是“定義、設(shè)計人與人造系統(tǒng)如何關(guān)聯(lián)的設(shè)計領(lǐng)域”，如何關(guān)聯(lián)當(dāng)然很重要，但在讓他們更好的關(guān)聯(lián)之前，我們需要深入的了解自身。而在交互設(shè)計領(lǐng)域，我們不可能專門研究人，所以就可以直接運用相關(guān)的研究結(jié)果了。在大量的研究人的領(lǐng)域中，認(rèn)知心理學(xué)是跟我們的設(shè)計息息相關(guān)的學(xué)科，因為人與人造系統(tǒng)要很好的關(guān)聯(lián)，必須綜合運用人的感知系統(tǒng)。下面從幾個最基礎(chǔ)的方面進行簡單的介紹：
感知融合是指人對外界的感知與反饋是系統(tǒng)性的過程，這個系統(tǒng)由視覺、聽覺、觸覺、前廳感覺（運動和重力覺）、整體位置及軀體感覺等等一起組成，它們在反饋機制的作用下互相制約，互相協(xié)調(diào)，從而使人可以在日常生活中能夠感知事物和適應(yīng)環(huán)境變化。所以
在設(shè)計過程中，對于視覺、聽覺、觸覺等感知系統(tǒng)進行綜合考慮，不能孤立的看待
。
人類接收信息80%是通過視覺，而交互設(shè)計產(chǎn)品，整個交互過程基本都要緊密依賴于人的視覺系統(tǒng)，所以了解視覺系統(tǒng)就非常有必要了。視覺系統(tǒng)具有主動性、動態(tài)建構(gòu)等特點。視覺認(rèn)知分為色彩認(rèn)知、運動認(rèn)知、形狀認(rèn)知、控件認(rèn)知等方面。這些認(rèn)知特點與界面設(shè)計都有很大的相關(guān)性，比如其中的形狀認(rèn)知包括相似性、接近性、連續(xù)性、簡潔性和完整性等特點。而且很多設(shè)計原則都是從人類視覺特點中來的，在這里不做展開，以后有機會專門做介紹。
上圖左邊是某購物平臺的舊版購物車，右邊是新版，他們?yōu)槭裁匆鲞@樣的改進呢？我們可以看到左圖中元素與元素之間間距都差不多，我們無法較快的區(qū)分信息的歸屬，比如滿贈的商品是屬于上面的商品還是下面的；而右圖中間距進行了調(diào)整，可以一眼就能分辨出贈品是屬于上面的產(chǎn)品。
可能有的同學(xué)這時會說：“這不是很基礎(chǔ)的UI原則嘛，跟人的視覺有啥關(guān)系？”，其實主要就是因為人的視覺有之前提到的接近性的特點，所以才會有這樣的原則。什么是接近性呢？請看下面這張圖：
左邊的九個菱形，橫向間距小，豎向間距大，所以人眼會認(rèn)為每一排是一個整體；右邊圖里，橫向間距大，豎向間距小，所以人眼會認(rèn)為每一列是一個整體。這就是人眼睛看事物做判斷的特點，各種設(shè)計都需要遵循這些特點。所以去學(xué)習(xí)那些別人總結(jié)出來的設(shè)計原則，不如直達根本，了解認(rèn)知學(xué)理論，你也可以創(chuàng)造出自己的設(shè)計原則！
除了視覺之外，認(rèn)知學(xué)里還有一塊非常重要，就是注意。有句話說，
現(xiàn)代互聯(lián)網(wǎng)之戰(zhàn)基本上就是注意力之戰(zhàn)
，那打好這場仗，必然得了解人的注意是怎么回事。
一是選擇性：
注意是主動選擇的過程，也就是說，人要是把注意力集中在某個地方，需要主動做出選擇，不像聽覺和嗅覺，可以被動接受。所以，在設(shè)計過程中，需要通過一些方法，讓重點內(nèi)容成為被注意對象。比如在新消息到達時，通過彈窗、小紅點等形式提示用戶，就是典型的影響用戶注意選擇的方法。
二是集中性：
正在集中精力所在的最多只能有一個實體，無論它是一個對象、一個特征、一個記憶還是一個概念。因為這個特點，在設(shè)計中就應(yīng)該避免過多干擾注意的內(nèi)容，盡量讓用戶集中注意在重點內(nèi)容、重點任務(wù)上。
三是注意分配：
雖然集中精力所在只能有一個，但整體的注意資源還是可以得到有限度的分配。但也取決于并行活動的性質(zhì)、復(fù)雜程度以及熟練程度。比如左手畫圓右手畫方，是很難做到的，但是同時走路并看手機，就沒有問題，主要就是因為走路這個動作我們非常熟練，只需要分配很少的注意力資源。所以在設(shè)計過程中，需要關(guān)注用戶同時進行的任務(wù)，是不是會對注意造成壓力，合理進行注意管理。
上圖是Evernote從2008年到2020年的UI設(shè)計變化史，這里我們可以很明顯的看出一個趨勢，就是簡單化和扁平化，那為什么會有這種趨勢呢，只是因為人們的審美發(fā)生了變化嗎，肯定不是這么簡單。
早年間，蘋果手機將屏幕分辨率一下子提升了不少，這讓眾多手癢的設(shè)計師們終于有了發(fā)揮余地（以前那種可以看到一個個像素的屏幕實在沒啥可做的），所以他們對于圖標(biāo)和界面無所不用其極，描繪的美輪美奐。當(dāng)然，一開始之所以這樣，另外一個原因也是為了沿用現(xiàn)實中的心智模式，讓用戶可以在屏幕上迅速理解，但是這兩者之間的成分，我覺得還是前者更多。然后到了一定的階段，人們發(fā)現(xiàn)這些精美的圖標(biāo)和控件很大程度上吸引了用戶的注意力，真正重要的東西反而不容易看到，當(dāng)然也是物極必反吧，終于在iOS7當(dāng)中，蘋果徹底做了大革新，全部扁平化，提出內(nèi)容至上的原則，其實就是對于注意力資源的重新考慮。
在人的認(rèn)知系統(tǒng)中，記憶也是一個神奇的東西。
人的記憶分為短期記憶和長期記憶。短期記憶也稱工作記憶，是為了完成任務(wù)而臨時儲存的信息。工作記憶的容量有限，大約是7±2，即我們能夠同時記住的互不相關(guān)的東西的數(shù)量在5~9之間。此外，工作記憶還非常不穩(wěn)定，如果我們將注意轉(zhuǎn)移到新事物上，之前工作記憶中的內(nèi)容就可能遺失。所以在設(shè)計中，需要考慮用戶的記憶壓力，盡量避免過多過長的記憶。
《上癮》中關(guān)于習(xí)慣是這么說的：“所謂習(xí)慣，就是’在情境暗示下產(chǎn)生的無意識行為’，使我們幾乎不假思索就做出的舉動。如今，我們習(xí)以為常的那些產(chǎn)品和服務(wù)正在改變我們的一舉一動，而這，真是產(chǎn)品設(shè)計者的初衷。”
產(chǎn)品設(shè)計者的初衷一定是要改變用戶的習(xí)慣嗎？到底應(yīng)該引導(dǎo)用戶習(xí)慣還是順從用戶習(xí)慣呢？其實都不一定，要視情況而定。比如手機設(shè)計從物理鍵盤到觸摸屏，大勢所趨，需要引導(dǎo)習(xí)慣；而觸摸屏上鍵盤的字母排布，就需要順從用戶習(xí)慣了。
第一部分和第二部分介紹了什么是交互設(shè)計，以及這門學(xué)科出現(xiàn)的原因和發(fā)展歷程，然后介紹了它的一些學(xué)科理論基礎(chǔ)，因為篇幅原因，這里只是點到為止。要是想深入了解，還是需要自己深入到相關(guān)學(xué)科中，不但可以拓寬視野，也能夠?qū)换ビ懈由钊氲睦斫狻?/span>
作者：覺之設(shè)計鏈接：https://www.zcool.com.cn/article/ZMTY0MTU0OA==.html來源：站酷著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請注明出處。
