楊 賢 唐超蘭
(廣東工業大學,廣東 廣州 510006)
隨著手機功能越來越強大以及3G網絡的普及,手機應用程序的開發及應用越來越流行,今年年初,蘋果公司在線應用商店App Store下載量超過100億次,其中應用數量已突破40萬個。蘋果App Store啟動于2008年,當時只有500個初始應用,數日后下載量就達上千萬,一年上10億,兩年半時間就擴張到100億的下載量。由此可見手機應用程序的發展勢頭非常迅猛,并且仍然保持上升勢頭。
手機平臺跟計算機平臺相差很大,手機的設計開發存在很多問題:首先,僅靠小小的鍵盤或者是觸控控件,手機用戶的輸入有很大限制,而輸出設備過小也限制了很多功能,如瀏覽網頁,看視頻等。再者,各個手機生產商的手機平臺相差很大,顯示屏不一致,輸入系統不一致,甚至操作系統也不一致,這就對移動設備應用的開發提出了很大的挑戰。更甚者,由于移動設備應用的開發還不成熟,也沒有統一的標準,這就造成了手機應用程序五花八門,設計上存在很多問題,導致用戶在使用這些應用程序的時候存在很多認知摩擦。這些嚴重影響了用戶體驗。
因此,手機應用程序的可用性亟待提高。而在手機應用程序的開發設計流程中,提高產品可用性的兩個非常重要的階段是用戶研究及交互設計。本文將對手機應用程序的交互設計進行研究。
交互設計是指人工制品、環境和系統的行為,以及傳達這種行為的外形元素的設計與定義。不同于傳統的設計學科主要關注形式,交互設計更多的是關注內容和內涵,它首先規劃和描述事物的行為方式,然后描述傳達這種行為的最有效形式。
Donald Norman認為,設計分為本能層,行為層,反思層3個層面[1],本能層的設計主要著重于使用者對產品的第一感覺,講究美觀;行為層的設計主要著重于在使用過程中的體驗,講究實用;反思層的設計主要著重于在使用產品之后給人的感覺,講究滿足感。交互設計傾向于行為層。交互設計借鑒了傳統設計,可用性工程等學科的理論和技術。它是一個具有獨特方法和實踐的綜合體,而不只是部分的疊加。它也是一門工程學科,具有不同于其它科學和工程學科的方法。
從用戶角度來說,交互設計是一種如何讓產品易用,有效而讓人愉悅的技術[2],它致力于了解目標用戶和他們的期望,了解用戶在同產品交互時彼此的行為,了解“人”本身的心理和行為特點,通過對產品的界面和行為進行交互設計,讓產品和它的使用者之間建立一種有機關系,從而可以有效達到使用者的目標,這就是交互設計的目的。
由于手機和計算機的硬件設備、界面、使用場景不同,人與手機和計算機的交互方式也有很大區別(如表1)。這就導致了手機應用程序的交互設計與計算機軟件的交互設計有很大的不同。計算機軟件的設計方法顯然已經不適合手機應用程序的發展,因此,對手機應用程序交互設計提出了新的要求,怎樣創建簡潔、流暢、適合于手機應用程序的交互設計是設計師需要迫切考慮和解決地問題。

表1 計算機與手機區別
交互設計是一門比較新興的學科,目前在產品開發中并沒有統一標準,筆者大膽將交互設計分為兩個層面來研究。在縱向上分為交互流程設計,在橫向上分為用戶界面設計。下面將以筆者團隊設計的一款手機應用程序“小谷圍”作為例子。“小谷圍”是一款android手機平臺基于LBS+SNS的大學生交友應用程序。
交互流程是用戶完成某個特定目標所需要的一系列步驟,它要求應用程序在信息架構上以及每個步驟和跳轉要足夠清晰[3]。沒有不必要的層級,并且清晰的指示了當前的位置,讓用戶一進入產品,就可以一目了然的知道產品是干什么的,有幾個功能模塊,模塊之間怎么切換。
由于手機應用程序的交互設計還不是特別成熟,沒有現有的標準去指導手機應用程序的設計,下面是筆者在手機應用程序開發中以及借鑒互聯網知識下摸索出來的針對手機應用開發中流程設計的一些評估標準:
3.1.1 產品結構清晰,沒有不必要層級,沒有太多分支,界面跳轉符合用戶預期,有清晰的返回與退出引導
3.1.2 明確產品有幾個主要的任務流程以及幾個主要頁面,盡量保證產品主要部分都能夠通過首頁訪問
3.1.3 清晰的指示了當前的位置,復雜的交互要有很好的引導和幫助
3.1.4 操作成功或失敗都有明確的反饋,預防出錯,如出錯要幫助用戶從錯誤中恢復過來
3.1.5 功能的排布要有邏輯,分類要清晰,命名要準確、易懂
根據以上的交互流程設計標準,筆者團隊對“小谷圍”的交互流程作出了詮釋,如圖1所示:

圖1 交互流程設計
頁面流程緊隨上一步的交互流程設計,對任務分析進行自然轉化,并指導整個軟件界面交互的信息架構和操作邏輯。基本上一個主要任務便對應一張頁面流程圖,頁面流程設計有利于確定頁面內容,頁面數量,還有各頁面間的交互關系。
用戶界面設計包括應用程序的外觀、布局、導航、控件等等。手機應用程序涉及到很多的控件[4]。標簽欄、列表、按鈕、對話框、提示框、發布框等等,這些控件使用的是否到位,對于界面設計來說至關重要。比如說兩個二級頁面都需要二級標簽欄,如果設計出兩個樣式,這樣不僅設計師要設計兩套二級控件,程序人員要重復勞動,用戶也會懷疑這兩個控件是不是同一個含義、同一種操作方式。另外,界面布局中,措辭是否準確,是否能有效傳達意思,文字長度限制、特殊情況處理是否考慮到位,列表文字的布局、內容頁的排版是否合適,都是需要斟酌使用的(如圖2所示)。以下是用戶界面設計中的一些參考評估標準[5]:

圖2 用戶界面設計
3.2.1 布局清晰,簡潔,保持一致性
3.2.2 焦點狀態,控件狀態等要準確使用,并且高效使用,可以復用的控件避免重新設計(比如兩個頁面都用到tabbar,不用設計兩個,這樣不但增加設計師與程序員的工作量,也會增加用戶的學習成本)
3.2.3 合理排版,結構化要易于理解,操作前,結果可預知,讓用戶知道身處何地,標簽和內容的從屬關系要明確(能否看出當前標簽頁,和當前標簽頁的從屬內容)
3.2.4 少即是多,對于手機應用來說,做減法很重要,避免多余的功能
3.2.5 信息表達應該清楚、明確、直接,避免術語(比如“拉取失敗”這種措辭)
交互設計是一個過程設計,其設計結果不是一個最終產品。交互設計是為視覺設計以及產品技術實現準備的,它的呈現結果是一份交互設計報告文檔以及交互設計DEMO。DEMO根據要求可以是低保真原型也可以是高保真原型。下面兩幅圖是用FLASH動畫實現的兩個截圖(如圖3、圖4),并非是一個android的APK格式的應用程序。這就是交互設計的一種高保真的呈現方式。

圖3 交互設計呈現-我的主頁

圖4 交互設計呈現-活動發布
手機應用程序的交互設計必須結合手機本身的特點和用戶使用手機應用程序的使用習慣為基礎,做好用戶研究,并在此基礎上構建應用程序的信息架構。手機的信息架構決定了手機的交互流程并且對手機界面設計起到很好的指導作用。在手機應用程序的開發中,雖然業界還沒有形成成熟的開發標準,但是仍然有一些成果可以借鑒,譬如筆者給出的那些設計評估標準,有一定的指導作用,這在一定程度上避免手機應用程序雜亂無章,降低了用戶在使用手機應用程序的學習消耗,從而減少用戶使用手機應用程序時產生的挫折感,讓用戶可以流暢、高效的使用手機軟件,并最終提高用戶體驗。
[1] Donald A.Norman.情感化設計 [M].付秋芳,程進三譯.北京:電子工業出版社,2005.
[2] 董建明.人機交互:以用戶為中的設計和評估[M].北京:清華大學出版社,2007.
[3] MORVILLEPeter,ROSENFELD Louis.Web 信息架構[M].陳建勛譯.北京:電子工業出版社,2008.
[4] 楊會利,李誕新,葛列眾.用戶體驗在通信產品開發中的應用[M].北京:人民郵電出版社,2010.
[5] 周陟.UI進化論[M].北京:清華大學出版社,2010.