基于眼動儀實驗的手機交互界面可用性研究

房凱　段齊駿

摘 要：為了研究手機交互界面的可用性的差異，對手機交互界面的風(fēng)格色彩、元素形狀、信息布局進(jìn)行考量，并完成相關(guān)眼動實驗，給予提升手機交互界面用戶體驗一定的參考。

關(guān)鍵詞：手機交互界面；可用性；差異；眼動實驗；用戶體驗

1 手機交互界面可用性

對于手機交互界面的可用性概念，國標(biāo)定義是指以有效性、效率和滿意度為指標(biāo)，產(chǎn)品在特定使用背景下為了特定目標(biāo)可為特定用戶使用的程度[1]；國外學(xué)者Hartson（1998）認(rèn)為可用性是指產(chǎn)品交互界面的“ease of use”和“usefulness”，即易用和有用。[2]綜上，交互界面可用性第一層面是能用性，即能夠完成指定目標(biāo)；第二層面是易用性，即完成指定目標(biāo)的效率；第三層面是用戶黏性，用戶完成指定目標(biāo)的使用欲。本研究將利用眼動實驗圍繞可用性中的易用性層面對典型的手機交互界面進(jìn)行考量。

2 研究對象

目前市場上智能手機品牌持多樣化發(fā)展的態(tài)勢，交互界面差異性都很大。手機系統(tǒng)分別為IOS、安卓、Windows Phone、BlackBerry、Linux、Ubuntu、MeeGo等，加上海量的安卓開源定制版系統(tǒng)，手機操作系統(tǒng)平臺的數(shù)量有很多。系統(tǒng)平臺下的每種應(yīng)用交互界面都不盡相同。由于智能手機交互界面手機界面風(fēng)格色彩、元素形狀、信息布局等都受手機系統(tǒng)平臺設(shè)計規(guī)范的影響，所以手機系統(tǒng)平臺交互界面在其系統(tǒng)平臺下的應(yīng)用交互界面中具有典型性。本研究將針對三大手機系統(tǒng)平臺（安卓、IOS、Windows Phone）交互界面的風(fēng)格色彩、元素形狀、信息布局等對可用性影響進(jìn)行眼動實驗，分析三大系統(tǒng)手機交互界面的可用性差異。

手機系統(tǒng)中用戶的觸摸層面主要對象為鎖屏、快捷頁面應(yīng)用、所有應(yīng)用、設(shè)置四個，根據(jù)用戶界面基本切換規(guī)律可以整理安卓（以谷歌提供原生系統(tǒng)為準(zhǔn)）、IOS、Windows Phone三大系統(tǒng)平臺的層級系統(tǒng)邏輯關(guān)系如圖1，本實驗中的任務(wù)圍繞層級變量的控制展開。

圖1 三大系統(tǒng)平臺的層級系統(tǒng)邏輯關(guān)系

3 研究方法

3.1 實驗準(zhǔn)備

實驗器材采用Tobii眼動儀，可以采集的指標(biāo)有注視點軌跡、注視點的持續(xù)時間、注視點個數(shù)統(tǒng)計等參數(shù)。實驗材料為安卓系統(tǒng)聯(lián)想手機一部，IOS系統(tǒng)iPhone 4S一部，Windows Phone系統(tǒng)Lumia 1020一部，固定用筆記本電腦一臺（將智能手機用膠帶固定在筆記本電腦的豎直屏幕上）。被試10名，在校學(xué)生，23～25歲之間，無精神病等影響主觀判斷的病癥。為了便于采集數(shù)據(jù)，每次操作中屏幕發(fā)生跳轉(zhuǎn)時重新設(shè)定眼動儀記錄數(shù)據(jù)，以減少頁面切換交互效果帶來的數(shù)據(jù)影響。

本次眼動儀實驗任務(wù)分為兩個部分：一是針對風(fēng)格色彩多樣程度、元素形狀統(tǒng)一程度、信息布局利用SD差異法進(jìn)行相關(guān)問卷調(diào)研以確定各手機系統(tǒng)平臺的風(fēng)格差異。二是眼動實驗，具體任務(wù)為進(jìn)入壁紙設(shè)置模塊，步驟分別是進(jìn)入主屏幕、進(jìn)入所有應(yīng)用查找設(shè)置、打開設(shè)置、打開壁紙設(shè)置模塊。由于三大系統(tǒng)平臺系統(tǒng)層級系統(tǒng)邏輯有所差異，本實驗為了盡量減少層級系統(tǒng)邏輯對眼動實驗中可用性的影響，根據(jù)圖1層級系統(tǒng)邏輯，采用控制層級的方法來保證實驗的可控性，即將任務(wù)安排在同一層級。

3.2 實驗過程

實驗人員讓每位被試試用三款手機10分鐘以消除被試對部分系統(tǒng)手機的學(xué)習(xí)效應(yīng)，然后填寫針對風(fēng)格色彩多樣程度、元素形狀統(tǒng)一程度、信息布局利用SD差異法將感性形容詞分為5個級別（-2～2）進(jìn)行相關(guān)問卷調(diào)研，結(jié)束后完成眼動儀調(diào)試和校準(zhǔn)，接著向被試闡述實驗任務(wù)明細(xì)。將三種系統(tǒng)的智能手機固定在筆記本電腦豎直屏幕上，讓被試完成相關(guān)任務(wù)。

3.3 實驗結(jié)果與分析

通過整理被試SD差異法問卷調(diào)研數(shù)據(jù)，可得到三種手機系統(tǒng)平臺在風(fēng)格色彩多樣程度、元素形狀統(tǒng)一程度、信息布局方式三方面的風(fēng)格特征對比圖（如圖2）。結(jié)合圖2，三大手機系統(tǒng)平臺在風(fēng)格特征上有一定的差異性，都各自有自身的優(yōu)勢和劣勢，安卓和IOS相較于Windows Phone風(fēng)格色彩較艷麗多彩；IOS和Windows Phone的元素形狀相對來說是比較統(tǒng)一的；Windows Phone的信息布局在三個系統(tǒng)中是最為簡潔、信息呈現(xiàn)最直接的。

圖2 三大系統(tǒng)平臺的風(fēng)格特征對比圖

完成眼動實驗后，可得到三個手機系統(tǒng)平臺界面的眼動注視點圖（如圖3）。通過眼動注視點圖可分析得到注視點軌跡、注視點的持續(xù)時間、注視點個數(shù)統(tǒng)計等參數(shù)。圓形標(biāo)記代表注視點，線條代表注視點軌跡。圓形越大代表注視點時間越長，圓形中的數(shù)字代表注視點的查看順序。根據(jù)三大手機系統(tǒng)平臺的風(fēng)格特征對比圖和眼動注視點圖可以從風(fēng)格色彩、元素形狀、信息布局等方面對手機交互界面的差異性進(jìn)行探討，以此得出各界面細(xì)節(jié)對交互體驗的影響。

圖3 三大系統(tǒng)平臺的眼動注視點圖

（1）均衡的色彩配置利于集中界面焦點。據(jù)圖2，三種手機系統(tǒng)平臺中IOS平臺色彩更為多樣，無論是色彩種類、數(shù)量都較其他兩個手機系統(tǒng)平臺多。IOS主界面包含超過10種以上的顏色，而且都無任何規(guī)律可循，繁多的圖標(biāo)色彩促使界面焦點不集中，直接導(dǎo)致注視點的離散，不利于信息的讀取。相對而言，Windows Phone系統(tǒng)手機主界面色彩較少，減少了信息讀取的色彩干擾，注視點相對集中。

（2）適當(dāng)?shù)纳逝渲糜兄谝龑?dǎo)用戶獲取信息的順序。以安卓系統(tǒng)為例（如圖3第一組注視點圖），注視點軌跡分布在界面中較為突出的綠色圖標(biāo)附近；以IOS為例（如圖3第二組注視點圖），第一屏中注視點軌跡分布在界面中較為突出的白、紅附近，第二屏中注視點軌跡分布在較為顯眼的紅色圖標(biāo)附近。由此可見，色彩有一定的視覺引導(dǎo)作用，可以通過色彩完成界面關(guān)鍵信息的引導(dǎo)，讓用戶潛意識中遵循特定的獲取信息的順序。

（3）保持元素形狀的統(tǒng)一可提升用戶感知的流暢性。安卓系統(tǒng)相對于其他系統(tǒng)而言，圖標(biāo)元素形狀是最不統(tǒng)一的。元素大小、形態(tài)、圖案都存在一定的差異性。這會讓界面信息存在一定的識別困惑，各種不統(tǒng)一感讓界面顯得凌亂。因此，眼動注視點也顯得較為無序。Windows Phone系統(tǒng)的元素形狀是最統(tǒng)一的，整體操作的眼動注視點都很集中流暢，用戶體驗也相對好些。

（4）信息布局的優(yōu)化提升信息傳達(dá)效率。Windows Phone系統(tǒng)在信息布局上較其他兩個手機系統(tǒng)的創(chuàng)新之處在于，它極力將信息架構(gòu)扁平化、內(nèi)容簡潔化，典型的Metro UI設(shè)計風(fēng)格以信息設(shè)計為中心，注視點數(shù)目要比安卓系統(tǒng)和IOS系統(tǒng)的注視點要少得多，極大地提升了信息傳達(dá)的效率。相對的，Windows Phone系統(tǒng)第三屏的設(shè)置界面的內(nèi)容呈現(xiàn)沒有經(jīng)過任何分類優(yōu)化，只是信息的簡單羅列，相對其他兩個系統(tǒng)在功能查找上比較麻煩，這進(jìn)一步證明了信息布局優(yōu)化對于信息傳達(dá)的重要性。

（5）風(fēng)格色彩、元素形狀、信息布局統(tǒng)一與易用性不成正比。Windows Phone系統(tǒng)的手機界面是風(fēng)格色彩、元素形狀、信息布局最統(tǒng)一的，但是元素極度的相似只會給用戶的信息識別過程帶來麻煩。無論是風(fēng)格色彩、元素形狀，還是信息布局都需要掌握統(tǒng)一性與差異性之間的度量，才能在信息傳達(dá)效率、用戶操作流程性上有所改善。

4 結(jié)論

三大手機系統(tǒng)平臺交互界面是所有手機交互界面的典型代表，其眼動實驗在一定程度上也反映了針對風(fēng)格色彩、元素形狀、信息布局所帶來的可用性差異。在人與手機界面交互過程中，手機交互界面的風(fēng)格色彩、元素形狀、信息布局在不同程度上對手機交互界面可用性產(chǎn)生影響。這對手機交互產(chǎn)品的設(shè)計和研發(fā)來說有一定的參考性意義，為提升手機的用戶體驗提供可能。

參考文獻(xiàn)：

[1] GB/T 18978.11-2005/ISO 9241-11：1998，使用視覺顯示終端（VDTs）辦公的人類工效學(xué)要求第11部分：可用性指南[S].

[2] Hartson HR . Human-computer interaction：interdisciplinary roots andtrends[J] . The Journal of System and Software，1998（43）：103-118.

作者簡介：房凱（1990—），江蘇揚州人，2013屆南京理工大學(xué)設(shè)計學(xué)專業(yè)在讀研究生，目前從事交互設(shè)計產(chǎn)品的研究工作，獲得設(shè)計類獎項若干，其中包括紅點概念設(shè)計獎、全國大學(xué)生工業(yè)設(shè)計獎、全國太湖獎工業(yè)設(shè)計大賽、全國研究生智慧城市大賽等國際國內(nèi)知名設(shè)計獎項。