勸導式設計在App中的視覺化方法研究
摘要：目的 探討勸導式設計理論下的App視覺化設計方法。 方法 通過對勸導式設計與使用者行為關係的研究，得出從使用者動機、使用者能力和觸發因素角度改變使用者行為的可行性。通過對勸導式理論在設計中的視覺化應用分析，得出該理論與視覺化設計結合的可能性及應用方向。通過對勸導原則與視覺化方法的結合和對現有案例的分析，得出視覺化設計在行為勸導中的設計方法。 結論 在理論研究和案例解讀的基礎上，提出了勸導式設計在App中的四個視覺化方法，即狀態視覺化、行為視覺化、目標視覺化以及成果視覺化。
關鍵詞： 勸導式設計；使用者行為；App；視覺化方法
隨著大容量資訊時代的到來，我們對數字介面的要求也越來越高。介面作為資訊的集結地，是建立在人類認知規律基礎上的對資訊的組織、呈現和反饋，它需要符合使用者的心理模型，才能最終形成流暢的互動行為和良好的使用體驗。視覺化技術在減少認知負荷與提升行為效率的宗旨下，通過組織化的資訊,在不減少資訊總量的前提下,通過平衡使用者的認知能力來實現目標[1]。對於勸導式設計來說，利用視覺化技術能夠以更直觀的方式從海量的資訊中簡化、抽象並凸顯出有效資訊，提升使用者行為的流暢度，從而提高勸導可行性。早在上世紀90年代初，Richard Buchman教授便提出，互動設計的物件是使用者的行為[2]。使用者與產品的互動不僅僅停留於產品的物理屬性，更是由一連串的行為構成的一個過程，是以產品為媒介的一個系統服務平臺[3]。故而，對於勸導設計來說，將使用者的行為過程加入設計的考慮範疇也尤為重要。在此過程中，視覺化的支援起到了不容小覷的作用。
1 勸導式設計與視覺化的關係
勸導式設計作為一門旨在“通過勸導技術改變人的行為或態度”的理論，自上世紀80年代由B.J.Fogg教授提出以來，經過30多年的發展，日趨完善，越來越多地被應用於設計中[4]。Fogg教授提出的FBM行為模型（FoggBehavior Model）表明，一個行為能夠達成必須同時具備三個要素：足夠的動機，足夠的能力和恰當的觸發因素[5]（見圖1）。
圖1 FBM行為模型（圖片來源：筆者自繪）
1.1 使用者動機與視覺化的關係
動機可以分為內在需要和外在誘因，設計主要通過外在誘因去影響使用者行為，外在誘因由低到高可分為喜悅與痛苦（Pleasure／Pain）、希望與恐懼（Hope／Fear）、社會接受與拒絕（Social Acceptance／Rejection）。人們的反應具有即時性，總是針對當下發生的事情做出行為反饋。喜悅與痛苦作為人最原始的反應，是驅使人們產生行為的有力動機。而希望與恐懼作為比喜悅與痛苦更深層次的情感狀態，對使用者行為過程的保持更為有力，故而凸顯使用者當前狀態、行為流程以及行為目標有利於加強使用者行為改變和保持的動力。例如，人們在使用運動類App進行跑步時，適時地對當前跑步程序、狀態進行視覺化反饋（包括視覺、聽覺等反饋），對鼓勵使用者完成跑步任務具有促進作用。Jonah Berger認為“任何事情，只要能啟用我們，形成生理喚醒狀態，我們的行為就會被觸動”[6]，以上兩類動機要素，無論積極正面或消極負面，皆屬於高生理喚醒的情緒範疇，都能對人們的行為產生影響。第三個主要動機是社會接受與拒絕，人們大部分的社會行為都受此因素影響。人們通過展現出表現良好的自己來獲得社會接受和肯定，並藉由相關符號的可視性，顯示個體差異性和獨特性，增強內心優越感和成就感，從而提高內在動機[7]。例如，蘋果公司在設計筆記本時，對筆記本的徽標朝向都有嚴格的要求。當使用者開啟電腦工作時，在他人面前呈現的徽標形象是正的，這是由於人們在使用筆記本時，也需要顧及到周圍人的眼光。
1.2 使用者能力與視覺化的關係
能力包括兩方面，一方面為使用者既定能力，例如一些健身App通過健身教學視訊來增加使用者健身知識和技能，從而幫助使用者完成健身行為；另一方面為產品的可用性和易用性，通過對目標人群和使用場景進行詳盡分析，呈現簡潔的介面、簡化產品操作步驟或給予明確的行為路徑指示，並在行為過程中用視覺化的方法給予明確清晰的操作指示和反饋，從而降低使用者的認知負擔和行為壁壘，提升使用者行為能力。
1.3 觸發因素與視覺化的關係
觸發因素作為行動訊號，可通過多種形式展現，比如純粹的意圖告知（文字提示、圖形、語音等），產品語義的隱喻和暗示，獎勵機制，社會影響（社會認同、社會權威等）以及潛意識的勸導等等。在這些形式之下，欲使目標行為有效發生，觸發因素必須具備以下三點特徵：第一，可察覺性；第二，與目標行為相關聯；第三，同時具備動機和能力，即合適的時機。可以說，人們幾乎所有的行為都通過外在的一些因素觸發產生，大到人生方向選擇，小到日常生活習慣。觸發因素的可視性越強、出現頻率越高，使用者行為越容易觸發。例如，培養人們健康的飲食習慣一直是件十分困難的事，雖然大部分人都知道多吃水果蔬菜的重要性，也嘗試每天多吃水果蔬菜，但經常在購物或者買飯時忘記加入水果蔬菜。如果我們藉助一定的視覺化方法，在餐盤或者購物籃上提醒人們“每天要吃五種水果蔬菜”，則可以大大影響人們的飲食習慣。
2 視覺化設計在提升產品勸導效率方面的策略與方法
移動網際網路產品本身具有應用情景複雜多變、攜帶方便、數字介面有限等特性，面對此類產品，使用者有一個從產生認識、發生行為、維持行為到達成目標的過程。通過上文對FBM行為模型三要素與視覺化設計及使用者行為改變的關係和應用分析，結合使用者的行為步驟，筆者對其重新整理歸納，分別從狀態視覺化、路徑視覺化、目標視覺化以及成果視覺化四個角度對勸導設計中的視覺化方法進行闡述。
2.1 狀態視覺化
從使用者體驗層級上來看，狀態視覺化屬於框架層級和表現層級[8]，主要包括對產品的介面設計、導航設計、資訊設計以及視覺設計。對於這兩個層級的設計，可從使用者認知角度的視覺化方法入手（即使用者對產品的認知和對自我的認知）。介面資訊的視覺化可從三個角度來進行討論，分別為有用資訊的篩選、資訊內容的組織呈現和資訊模組的合理排布。介於移動裝置不同於PC端的使用特性，移動產品具有更為多樣的使用情境，使用產品時的情境特徵、使用者狀態、網路特徵、使用時間等，都會對設計產生較大影響[9]。故而，應當精簡介面資訊，刪除與使用者需求、使用者目標、使用者行為無關的資訊，並重新組織資訊內容。資訊內容可通過文字或者圖形化的方式以使用者熟悉的語言表達出來，一般來說，圖形化的資訊更具表達性和直觀性，可藉助圖形隱喻的方式減輕使用者學習負擔，提高認知效率。在資訊模組的排布中，需保持設計的一致性（整體色調、視覺元素等），同時，藉助設計的對比（顏色、大小、粗細等）突出重點資訊，吸引使用者注意力[10]。其次，在使用者操作過程中，保持使用者行為狀態的實時更新和儲存，利用視覺或聲音反饋，對狀態進行呈現和提醒，有利於提高使用者對行為過程的理解力和判斷力，從而提升使用者的自我認知能力，提高勸導效果。例如，運動記錄類應用“動動”，在使用者跑步過程中，每隔5分鐘，都會通過聲音播報使用者跑步用時和跑步距離，使使用者獲取當前狀態的同時，對使用者行為也給予了鼓勵，有利於使用者繼續跑步行為。
2.2 行為視覺化
使用者行為路徑的視覺化方法主要針對移動產品的結構層，包括產品的互動設計和資訊架構。互動設計主要關注使用者行為以及對行為給予的反饋，資訊架構則著重於設計組織分類和導航的結構。結合Fogg教授所提及的，“由於使用者動機本身會受到場景、個體、社會等多種因素影響，所以減少行為阻礙是更為穩定有效的方式”，在移動產品的勸導設計中，可以通過簡化使用者操作步驟，使之符合使用者心理模型，並通過介面元素的視覺強化、隱喻等方式對行為路徑作出引導，減輕使用者學習成本和負荷，從而增強操作的流暢性及效率。例如，地鐵出入站通道會特意做出一定坡度，使人們不知不覺就加快步伐，實現勸導者欲保證出入站通道暢通的目的。另一方面，在使用者操作過程中，對使用者的行為作出清晰的反饋可以幫助使用者確認自己的行為，並繼續接下去的操作。反饋可通過視覺、聽覺、觸覺等方式傳達。例如，通過下拉的方式重新整理新浪微博主頁，重新整理過程中會出現等待的小圈，提示使用者動作指令正在進行中，重新整理完畢則發出音效反饋，使使用者得以確認動作完成。
2.3 目標視覺化
辛向陽教授提出，互動設計包含五個要素，分別為人、動作、工具或媒介、目的和場景[3]。每個行為背後都存在一定目標，或有意識或無意識。目標的視覺化設計可從以下兩個角度進行，一方面是對目標本身的視覺化描述。從行為心理學的角度來看，一個事物出現的越頻繁越顯眼，就越可能影響使用者行為。通過利用擬物化、大小對比、顏色對比、動效等視覺化方法突出使用者目標，可以提高對使用者行為的引導激勵作用[10]。例如，給一家紅酒商店播放法國的音樂作為背景音樂，會大大增加消費者購買法國產紅酒的比例。另一方面，通過加強目標與使用者行為的聯絡性，提升勸導觸發因素的有效性。例如，運動記錄類應用“樂動力”的首頁，用一個整圓表示今日步數目標，在圓環上用彩色色帶表示已完成步數，當圓環被彩色色帶填滿時，即表示今日目標完成，以此鼓勵使用者完成目標步數。
2.4 成果視覺化
人作為社會性群體，社會影響對人們的行為有很大的作用，人們不僅關心他們如何完成任務，更關心其行為對他人的影響以及共享對自我形象的提升作用。Jonah Berger認為，“讓某些事情更具觀察性，就可以讓它們更好地被模仿。如果想要讓產品、思想和行為變得流行，我們需要讓它們具有公共可視性”[6]。因而，如果對使用者的行為改變以更具公共可視性的方式表達出來，會加強使用者的行為動機，提高行為改變的可能性。使使用者知道並記錄自己所達到的成績。例如，處理使用者地理資訊的手機服務網站Foursquare，它鼓勵使用者同他人分享自己當前所在的地理位置等資訊。它會通過記載使用者的分享記錄，並根據使用者的分享記錄量來授予不同的徽章，使用者還可以將徽章分享至社交平臺，以顯示自己所獲成就，獲得滿足。其次，Berger還提出，“如果有明顯的證據能夠證明我們的每一次進步，就會讓我們感到無比欣慰與喜悅”。從使用者自身行為勸導角度來看，對使用者成就的視覺化，可以增強行為觸發因素的可察覺性，啟用使用者興奮情緒，提高使用者內在動機的強度和持續性。例如，跟蹤手機使用時間的應用“OFFTIME”，它會根據使用者的手機使用情況整理出一系列簡潔的圖形資料，還可以設定不玩手機的時間。應用的主頁面結構清晰簡潔，突出對比使用手機時間和關閉手機時間，強化了對使用者行為的勸導效果。
3 視覺化方法在實際產品中的應用
“動動計步”（見圖2）和“Pacer”（見圖3），是動動品牌針對市場和使用者群體差異，推出的針對中國應用市場的移動健康管理軟體及其國際版。“動動”的主要目標人群是希望通過輕運動方式改善自身健康狀況的人群，涵蓋人群範圍較廣。它基於LBS，能夠全天候記錄使用者運動行為，支援步行、跑步、騎行等有氧運動的手動輸入，同時還能自動呈現給使用者視覺化的健康指標和圖表分析，更直觀地呈現一段時間內使用者的運動情況，從而幫助使用者更好地自我分析和行為保持。在群組模組中，使用者可新增自己的微信好友等，通過與自己熟悉信賴的人分享交流運動狀況和經驗心得，獲得社交認同、聯結和鼓勵。
圖2為“動動記步”的主要介面，以明黃色為主色，與產品主要目標人群特性相呼應，顯得溫暖且充滿活力。介面結構清晰簡潔，主頁為當前各項運動狀態呈現，突出顯示當前步行數，並配合圓環對目標完成程度給予標記，在提供充分狀態視覺化和目標視覺化反饋的同時，給予使用者適當激勵，觸發使用者保持或加強運動的情緒和行為。主頁的左側和右側分別設有拍照／截圖分享鍵和快速開始GPS運動鍵，前者通過運動成果個性化的視覺化呈現，增強成果可察覺性，啟用使用者興奮情緒。同時，通過社交分享，提高了使用者的社交聯結和社會認同，有利於提高使用者內在動機。後者的設定方便使用者快速開始GPS運動記錄，通過行為視覺化方式，縮短操作路徑簡化使用者行為，提高了使用者能力。並且在運動過程中以語音的形式給予使用者適時的行為反饋，觸發使用者繼續保持運動行為。
圖2 “動動記步”軟體介面(圖片來源：筆者自繪)
圖3為國際版本“Pacer”的主要介面，以藍色為主色。“Pacer“在國內版的基礎上增加了血壓資料記錄和“我的教練”模組，著力打造一個全方位的健康資料管理平臺，故而選用比黃色更為穩重且放鬆的藍色作為主色。在“我的教練”模組中，通過使用者給定的個人資料和健康目標，為使用者量身定製個性化方案，並配以智慧AI教練適時給予指導和建議，給予使用者狀態視覺化、目標視覺化及成果視覺化反饋，以更有效和多元的觸發方式提高對使用者健康行為的勸導效果。
圖3 “Pacer”軟體介面（圖片來源：筆者自繪）
4 結語
勸導式設計涵蓋範圍較廣，本文僅從App介面的視覺化方法角度對勸導式設計給予闡述，藉此展現勸導式設計在實際應用中的設計原則和方法。結合使用者行為過程，本文提出狀態視覺化、行為視覺化、目標視覺化以及成果視覺化，對勸導設計中的視覺化方法進行分析和歸納，希望在未來的設計實踐和研究中加以不斷深入和完善。
參考文獻
[1] 章潔.面向大容量資訊移動介面的設計方法比較研究[J].裝飾,2016.01
[2] Richard Buchaman.Design as Inquiry:TheCommon,Future and Current Ground of Design[C]. In Future Ground:Proceedings ofthe International Conference of the Design Research Socirty,November 2004.
[3] 辛向陽.互動設計:從物理邏輯到行為邏輯[J].裝飾,2015(1):58-62.
[4] Fogg,B.J. .Persuasive Technology: Using Computers to Change What We Think and Do[J]. Ubiquity,December1-30,2002.
[5] Fogg, B.J. .A Behavior Model For Persuasive Design[C].Proceedings of the4th International Conference on Persuasive Technology,2009.
[6]喬納·伯傑.瘋傳－讓你的產品、思想、行為像病毒一樣入侵[M].北京:電子工業出版社,2014.
[7]彭華民.人類行為與社會環境[M].北京:高等教育出版社,2014.
[8]加瑞特. 使用者體驗的要素[M].北京:機械工業出版社, 2008.
[9]傅小貞,胡甲超,鄭元攏.移動設計[M].北京:電子工業出版社,2013.
[10] 李德維爾,霍頓,巴特勒.設計的法則[M],遼寧:遼寧科學技術出版社,2010.