關鍵詞: 交互設計、交互行為五要素、行為邏輯、物理邏輯
經過前幾年的廣泛關註和不斷實踐,國內學術界和行業對交互設計理念的理解和方法的運用已經初顯成效。尤其是當百度、淘寶、支付寶、微信、小米等壹批從單壹產品到整個產業鏈的新興商業生態逐漸成熟的時候,設計師所服務的產業環境、工作中所關註的產品屬性、設計流程以及成果評價標準都和五年前我們熟悉的實體產品設計大相徑庭。在我們反思設計對象本體屬性(what)、改變設計流程(how)、重新確定判斷標準(why)之前,有壹件很重要的事情需要闡明,那就是交互設計的對象以及設計過程中的決策邏輯。
壹、交互設計的對象:行為的設計
交互設計作為正式的研究方向早在上個世紀六十年代就開始了。早期的交互設計主要關註的還是人與機器、尤其是與計算機的交互,其主要的目的是通過提供簡單易懂的操作界面使計算機和其他新興的數字產品能購為更多的普通用戶所接受。隨著信息技術的不斷成熟,互聯網行業的發展以及用戶體驗對消費決策影響力的不斷增強,壹時間,交互設計幾乎覆蓋了包括信息技術、互聯網、物聯網、服務與體驗等不同領域、不同行業的產品研發。然而,作為壹種有著廣泛應用的理念和方法,交互設計依舊缺少壹個相對穩定的理論框架概括其研究本體、描述它的決策規律。
1 、“行為的設計”與“物的設計”之區別
設計在傳統意義上壹般被理解為造物,也就是對物的設計。交互設計則不同,是在創造“行為”,它也需要物,但只是把物當作實現行為的媒介。
以手機為例。手機作為被消費者廣泛使用的壹個軟硬件壹體、產品與服務結合的通訊和社交產品,它的用戶體驗常常被交互設計師津津樂道,也往往是手機品牌和服務供應商重點關註的內容。iPhone通常被認為是交互設計成功的典範,雖然很少有人能夠清楚地描述出iPhone的交互形態或者它有別於其他手機的交互特點,但我們可以從下面壹個簡單現象中獲得很多啟示。不管是設計師還是普通用戶有了自己的iPhone之後,都壹定會關註其中的種種界面,並喜歡向朋友和家人演示這些界面。從滑動開啟界面、圖片放大、自動轉向、CD唱片的翻轉等等。再回想壹下Motorola V3推出時的情形,從公司自身到設計師再到用戶,他們津津樂道的是V3薄薄的黑色金屬翻蓋式外形。隨後推出的V3繼續保持原有的造型,並引入了不同的色彩。這個看似平常的現象,它為我們提供了認識交互設計的重要線索。人們描述Motorola V3的時候,都是把它作為成功的工業設計的案例來著重描述其物理屬性,諸如形狀、尺寸、結構、色彩、質感等。但是,人們在描述iPhone時,卻很少去試圖描述其物理屬性,而是選擇去演示某個事件,譬如說瀏覽圖片或播放音樂。
再看手機交互設計的另外壹個例子。圖1是某型號諾基亞手機和三星手機在用戶可用性方面的對比,通過信息架構可視化進行用戶可用性分析[1]。該圖對諾基亞(黑色標註)和三星(藍色標註)手機的各項功能(即可實現的任務)以及實現任務的流程進行了疊加對比。中心的圓圈是手機的各項功能,沿著同心圓依次展開的是實現各項功能所需要經歷的每壹個操作步驟。如圖所示,使用諾基亞手機撥打電話需要5個步驟,而使用三星手機則需要8個步驟;使用諾基亞手機發送短信需要8個步驟,而使用三星手機則需要(8 6)14個步驟。依此類推,可以看出兩者的更多區別。因此不難理解,為什麽在先前的用戶感性評測中,用戶普遍認為諾基亞有更好的用戶體驗,因為它可以使任務的完成變得更加簡單,操作當然也更容易。
圖1諾基亞和三星手機用戶可用性對比
同樣是調整屏幕的亮度,在外形也很相似的情形下,蘋果的iOS操作系統和Android系統為用戶提供的路徑卻完全不同(如圖2)。圖中不同顏色的線條是在實際用戶測試中,用戶嘗試過的路徑。顯然,iOS的路徑更加便捷明了。Android系統雖然提供了更多的可能路徑,卻使用戶在選擇過程中耗費更多的時間,犯錯誤的機會也相應增加了。
圖2 iOS(左)和Android操作系統(右)調整屏幕亮度路徑對比
前述iPhone和Motorola V3的用戶關註點對比、諾基亞與三星的用戶可用性對比、iOS和Android操作系統的對比,應該說很清晰地揭示了交互設計和傳統產品設計的本質區別。交互設計改變了以往工業設計、平面設計、空間設計中以物為對象的傳統,直接把人類的行為做為設計對象。在交互行為過程裏,器物包括軟硬件只是實現行為的媒介、工具或手段。交互設計師更多地關註經過設計的、合理的用戶體驗,而不是簡單的產品功能。這樣,消費者獲得的不只是單壹的產品,而是以產品作為媒介的壹個完整的服務平臺。交互設計和產品設計的區別如圖3所示。[2]
2 、交互行為的五要素
早在20世紀九十年代初,Richard Buchanan教授就清晰地把交互設計的對象定義為行為,“creating and supporting human activities through themediating influence of products”(通過產品的媒介作用來創造和支持人的行為)。[3]遺憾的是,雖然這個定義明確地指出了交互設計的對象是人的行為,而且這個定義也成功地指導了卡耐基梅隆大學的交互設計學科的發展,但是這個定義並沒有被更多的人、更準確和深入地理解。很多的人都把註意力放在用戶界面,也就是媒介的影響上(the mediating influence of products),而忽略了行為(activities)本身。
當行為過程作為設計對象的時候,其屬性不再是傳統工業設計通常關註的諸如功能、結構、材料、色彩等物理屬性。交互(interaction)是因為有了“動作”(action)和相應的“反饋”(reaction)才形成了壹個回合的交互行為。這裏的動作壹般是指有意識的行為,當然也就有了執行動作的人、行為的目的、實現動作的手段或工具(可以是軟硬件,也可能是身體的某個部位,甚至可能是外在的環境媒介)、行為發生的場景。暫且把人、動作、工具或媒介、目的、和場景界定為交互設計的基本元素或行為五要素(圖4)。五要素的提出是受了文藝理論家肯尼斯.伯克(Kenneth Burke)戲劇五位壹體和“同壹”理論的啟發[4]。如果說,通過改變材料、色彩、結構或功能可以獲得壹個新的工業產品的概念,那麽壹個新的交互設計概念則往往需要從重新確定參與者、定位行為動機、規劃行為過程、謀求新的手段、營造新的場景和環境等角度來入手。
圖4交互行為的五要素
二、從物理邏輯到行為邏輯
當設計師需要把人、動作、工具或媒介、目的和場景等五要素合理地整合到壹起,去完成壹個任務並使用戶獲得良好體驗感受的時候,他所遵循的邏輯規律壹定有別於產品設計師,後者考慮的主要是如何合理地運用結構、材料和色彩等物理屬性去實現產品的某項功能。
1 、Yahoo和Flickr主頁界面對比
讓我們再看兩個互聯網服務的對比,Yahoo網站和Flickr網站(圖5)。為了組織復雜的信息,Yahoo主頁至少同時使用了“LATCH(位置Location、字母Alphabet、時間Time、分類Category、層級Hierarchy)方法”、信息組織方法中的分類法(頂部和左側的信息或服務板塊)、層級劃分(正中的視頻和右上角“熱點話題”)和按時間順序排列(中間偏下的“所有新聞”)。當然了,這些還不是Yahoo主頁信息組織的所有方法。作為九十年代中期起步的搜索引擎和門戶網站,為了滿足人們獲取信息的需求,精心組織信息和相應的服務成為了Yahoo主要的任務。在這裏信息的組織(比如說LATCH方法的運用)和展現(排版、視覺呈現等)類似於傳統的實體產品設計中對產品功能、結構、造型、材料、色彩的優化組合,因為設計師相信經過合理組織的信息和服務是Yahoo為互聯網用戶服務的基礎。接下來看Flickr網站。Flickr主頁的設計則采用了完全不同的思路,中心位置“Upload”、“Discover”和“Share”三個醒目的入口顯然不是按照圖片的某種分類方法而設定的三個圖片信息板塊[5],它們的出現是因為用戶三種典型行為。來到Flickr的人首先想到的是我可以做些什麽,“上傳、尋找還是分享?”,而不是瀏覽Flickr裏提供了什麽樣的圖片。在這裏,用戶的行為成為了設計的對象主體,各種用戶的不同行為通過用戶研究以典型用戶行為呈現在主頁上,最大限度地契合了主流用戶可能的、理想的行為路徑。
2 、行為邏輯與物理邏輯
如果把“合理組織行為作為決策依據”稱之為“行為邏輯”,那麽,“強調物的自身屬性合理配置的決策依據”則可稱之為“物理邏輯”。Yahoo和Flickr同樣是互聯網產品,盡管都強調為用戶服務,反映的卻是兩種完全不同的思路。首先是關註對象的不同,Yahoo關註的物(虛擬的信息)和Flickr關註的行為;更重要的是,由於對象的不同,設計決策過程中依賴的是完全不同的邏輯思維。Yahoo是對信息作為虛擬物的“物”屬性(分類、結構、呈現形式等等)的合理組織,它遵循的是物理邏輯;另壹方面,Flickr是根據人的行為、目的和習慣來規劃行為過程,它遵循的則是行為邏輯。很難簡單地用Flickr的設計理念去評判Yahoo的信息組織方式,相信Yahoo的設計師也是盡可能地考慮多種用戶需求,最大限度地把信息合理地呈現給了它的用戶群體。同樣,也很難用類似Yahoo的思維去判斷和修改Flickr的設計方案,除非徹底改變Flickr,比如說用Yahoo的信息分類去把用戶上傳到Flickr的圖片按種類(風景、人物、藝術等)、地區、時間、像素等等呈現在主頁供用戶瀏覽。
如果把Yahoo和Google同樣作為搜索引擎的互聯網服務對比,兩種不同思維邏輯帶來的差異更是顯而易見。當Yahoo希望把所有復雜的信息按照合理的方式呈現給用戶的時候,它依賴了很多組織信息的方法和工具。同時,用戶也需要在Yahoo的信息架構不同層級裏去發現自己需要的信息。而Google則是采用行為邏輯,它的壹鍵到達的模式無疑從行為角度講是最經濟合理的。很難說某壹種邏輯思維有更多的優勢,角度不壹樣,得出來的結論可能不壹樣。
讓我們看另外壹個例子,是關於辦公室廣泛應用的復合復印機的用戶體驗測試。這裏我們選擇的是柯尼卡.美能達Bizhub 751型復合復印機,實驗由香港理工大學交互設計研究生謝彬歡在筆者的指導下完成(圖6)。可以肯定,美能達的設計師和工程師壹定最大限度地、合理地利用了各種復雜的機械、電子構件,配合相應的軟件,在相應的成本區間內,很好地同時滿足了商業用戶的復印、掃描、裝訂等多種復雜任務。其造型想必也充分考慮了現代辦公室的風格。尤其當我們把它和早期的復合復印機相比,它的功能更強大、體積更小、性價比更高。單純考慮柯尼卡.美能達Bizhub 751的功能、結構、造型,甚至價格等物的屬性,應該說它很好地符合了它作為商品的物理邏輯,是壹個成功的設計。然而,當我們開始考慮用戶的使用體驗時,很多用戶發現如果缺乏使用經驗或沒有經過指導,即便是壹個很簡單的任務也可能變得非常復雜(圖7)。圖7裏,3種顏色代表了3個測試用戶,他們都被要求完成同樣壹個簡單的A4紙雙面復印的任務;每壹個灰色或有顏色的小方塊代表了壹個操作界面上的按鍵,其中有顏色的小方塊是被測試用戶點擊過的按鍵;每壹根線條代表了從壹個按鍵到另壹個按鍵的路徑底部的橫軸代表了時間,時間軸上的“X”表示了任務失敗的路徑。從圖中繁復的路徑和眾多被點擊的按鍵,可以想像操作者當時的困惑和無奈,也就是說,壹個原本功能完善、結構合理的機器,如果從使用行為,尤其是任務流程的角度看,它沒有能夠很好地滿足行為邏輯的要求。
圖6 柯尼卡.美能達Bizhub 751型復合復印機
圖7使用柯尼卡.美能達Bizhub 751型復印機的用戶體驗測試
柯尼卡.美能達Bizhub 751型復印機之所以出現簡單任務操作困難的現象,根據測試分析報告,主要由於以下幾個方面的問題:1)控制界面上的符號不能很好地和用戶的復印任務行為語言吻合,也就是說,按鍵圖標不能清楚地告訴用戶,它執行的具體任務和相應的結果;2)界面提供的信息架構很好地遵循了機器本身功能、結構或者後天軟件程序的需要,但是不能和用戶的思維與行為習慣匹配;3)界面信息分區往往遵照了功能板塊的劃分,而沒有對應典型的任務流程;由於機器希望完整地展現各種功能,結果造成了每壹步操作過程都會出現很多的信息幹擾,帶來很多的誤操作;4)沒有避免出現誤操作的結果預覽或提醒,無法及時修正誤操作。因此,不難理解是操作界面設計的“不合理”導致了測試過程中糟糕的用戶體驗。然而,即便是不能順利完成既定任務的測試者,也能清晰地感覺到機器本身功能的強大和結構的合理以及操縱界面背後的壹套完整的邏輯,只是遵循機器物的屬性的物理邏輯和用戶完成復印任務的行為邏輯不能很好地匹配。這樣壹來,也就不難理解,為什麽當客戶購買了復合復印機之後,大多數生產商都會提供免費上門的使用機器培訓,也就不難理解為什麽柯尼卡.美能達Bizhub 751型復印機的使用說明書有604頁紙之厚了。
3 、功能型用戶界面設計和行為型用戶界面設計
按照Yvonne、Sharp和Preece的說法,用戶和硬件產品或軟件產品的交互可以分為四種模式,命令式(instructing)、對話式(conversing)、操縱式(manipulating)和探索式(exploring)。用戶界面又往往根據界面的技術實現手段分為圖形用戶界面、實體用戶界面、自然用戶界面等等。
從前面對比分析的物理邏輯和行為邏輯來劃分,界面還可以分為功能型用戶界面和行為型用戶界面。前者用物理邏輯組織界面,以滿足功能實現為主要目的;後者則強調用戶體驗,用行為邏輯來組織界面。
圖8是同壹款冰箱分別用物理邏輯和行為邏輯設計的不同用戶操作界面比較(因為保密原因,部分細節這裏不便展開)。圖中左邊是圍繞物理邏輯的冰箱功能型用戶界面信息架構,右邊是在滿足同樣功能的前提下,按照行為邏輯理念重新設計的行為型信息架構。粉色和橘色的折線分別代表了兩個典型任務在實際測試中基於不同信息架構上的操作路徑。盡管兩個不同界面的設計過程中都采用了幾乎同樣的用戶研究方法,也同樣針對典型用戶分析了典型任務流程,並由此獲得了任務流程中的所有功能節點,也就是反映到界面信息架構上的不同操作圖標。顯然,原本的設計把所有的功能節點,按照功能點相互之間的技術屬性合理地整合在了壹個簡潔信息架構裏;重新設計之後的信息架構明顯要比原先的架構復雜,因為它並沒有對不同任務路徑中相同功能節點進行整合,而是保留了所有典型路徑的完整任務流程,從而不可避免地造成了同壹個功能節點在不同任務流中的多次重復。從某種意義上講,或者說從功能屬性自身分類或技術實現手段的合理性(包括後臺程序的難易程度)角度來說,原先的信息架構可能是更合理的,從理論上這樣的功能型用戶界面能夠滿足完成所有任務的順利完成,但是它要求用戶在反復實踐中學習和熟悉不同功能節點在信息架構中的分布。壹個原本簡潔的信息架構由於它和用戶的使用習慣並不吻合,使得用戶在完成壹個任務的時候往往需要在不同的功能板塊、不同的信息層級之間跳躍。另壹方面,看似復雜的行為型信息架構,由於它的組織原則結合了典型任務的典型路徑,實際使用的時候,它的路徑更直觀、便捷。其實,這個簡單的案例還反應了不少交互設計師常常忽略的壹個現象,那就是用戶在使用過程中是不可能在大腦裏呈現出壹個完整的信息架構層級的,他也很少會通過全面了解信息架構然後進行操作的。用戶在每壹個決策的時刻,呈現在他面前的往往是壹條路徑上的簡單選擇,包括退出。也就是說,信息架構自身的復雜程度和用戶使用的復雜程度是由不同的邏輯思維判斷的。
圖8智能冰箱功能型用戶界面和行為型用戶界面信息架構對比
(設計師:唐堯、王鈞渺等;項目指導:辛向陽;2013)
結語
行為邏輯的提出旨在為交互設計方法的構建提供壹個理念層面的支撐,並希望為區分功能型用戶界面設計和行為型用戶界面設計提供壹些線索。這裏有幾點補充說明。
首先,由於從用戶行為本身受場景的、情感的、人為的、社會的等多種不確定因素的影響,因此,行為邏輯的提出並非期待尋找行為流程自身的某種科學的甚至機械式的邏輯聯系,而是強調以行為作為界面設計的本體,對界面設計的考量依照具體任務的流程合理性和用戶體驗來衡量。作為壹個新的設計理念,行為邏輯可以指導設計方法,尤其是從情景設計到用戶界面信息架構的轉化。“講故事”之所以成為交互或用戶體驗設計常常使用的方法,目的也在於通過設計故事在合適的“場景”、運用合適的“手段”、合理地組織“人”以及他們的“行為”,從而實現某種合理的“目標”,這是演示交互設計成果的方法。行為邏輯的提出有助於豐富設計理念和方法,但並不否定物理邏輯以及在物理邏輯思維指導下的各種設計方法。哲學概念的作用往往在於為解決困惑提供思想工具,而不是闡述原本就未必存在的真理。
其次,心理學和認知學領域有很多研究行為的學術成果可供參考。行為學是20世紀初發展起來的心理學派別,和研究內在思維活動的傳統心理學不同,它強調研究可以觀察和測量的人或動物的行為。早期行為學學者包括John B. Watson, B. F. Skinner等等[6]。20世紀後半葉,行為學逐漸被認知學的影響覆蓋。心理學家唐納德.諾曼成功地把對人認知、行為等心理學研究成果轉化成了以人為本的設計準則和方法,包括概念模型、反饋、限制因素、啟示(原文“Affordance”,也譯為“預設用途”),這些都是從用戶心理、認知和行為等角度對設計提出的要求[7],顯然這些原則遵循的不是強調器物自身屬性合理性的物理邏輯,而是符合人的認知與行為習慣的行為邏輯。
最後,交互設計作為壹個重要的設計領域,發展自己的語匯是必不可少的。單純作為研究方向,交互設計可以追溯到上個世紀六、七十年代,然而,很多從事交互設計實踐的人還無法用準確的語言描述交互的概念、判斷交互設計結果的好壞。發展設計語言不是單純的理論研究,而是在充分實踐基礎上,通過抽象,獲得可以解釋設計現象並為設計實踐服務的概念。Donald Norman教授引入“Affordance”概念,解釋了很多看似簡單,卻又常常無法用傳統設計語言描述的設計現象,他的研究為交互設計準則貢獻了很多有用的語言或哲學概念。交互五要素、行為邏輯等概念的探索目的也在於通過豐富設計概念為設計實踐服務。
註釋
[1]利用信息架構可視化進行用戶可用性分析是辛向陽教授在香港理工大學擔任交互設計課程主任時發展的方法,部分研究成果在2010年第四屆全國新媒體藝術系主任(院長)論壇“研究生課程大綱設計”,2010年廣州交互設計體驗日“被忽略的交互本質”,2011年交互設計國際大會(香港)“信息與決策”等場合發表。
[2]更多關於交互設計與產品設計的對比,可以參考辛向陽在2010年廣州交互設計體驗日“被忽略的交互本質”、2011年2月號《設計》雜誌 “混沌中浮現的交互設計”、2012年北京交互設計體驗周“交互設計與組織創新”,2013年交互設計國際大會“行為的屬性與表達”等演講或文章。
[3]Buchanan, Richard.“Design as Inquiry: The Common, Future and Current Ground ofDesign.” In FutureGround: Proceedingsof the International Conference of the Design Research Society, November 2004.Edited by John Redmond, et al. Monash University, Melbourne, Australia. 2005.
[4]Kenneth, Burke.“Introduction: The Five Key Terms of Dramatism”fromA Grammar ofMotives. University of California Press, Berkeley,1969. p.XV-p.xxiii.
[5]圖中展示的是2013年5月改版前的主頁。現在的主頁和改版前雖有不同之處,但不妨礙以老版本作為案例說明這篇文章所需要說明的問題。
[6]Graham, George, 'Behaviorism', The Stanford Encyclopedia of Philosophy (Fall 2010 Edition), Edward N. Zalta (ed.),URL =.
[7]Norman, Donald. The Psychology of EverydayThings. Basic Book, 1988.p.9.
本文是辛向陽教授在《裝飾》雜誌2015年第1期公開發表的學術論文