基于眼動實驗的短視頻手機APP界面偏好研究

賈梧，周睿，劉揚，陳楠，史玉潔

(百度(中國)有限公司，北京 100193)

1 引言

短視頻的興起在很大程度上改變了人們接收信息的方式，同時也占據(jù)了人們越來越多的時間。截至2021年2月，我國短視頻用戶規(guī)模已達8.73億人，占網(wǎng)民總數(shù)的88.3%[1]。國內(nèi)學者將短視頻APP定義為視頻長度幾秒至幾分鐘不等，包含用戶生成內(nèi)容和專業(yè)生成內(nèi)容的應用程序，相比傳統(tǒng)的圖文社交軟件，能夠全方位滿足用戶信息獲取和社交需求[2]。目前短視頻賽道的競爭呈現(xiàn)出白熱化趨勢，帶來行業(yè)同質(zhì)化的發(fā)展。在抖音、快手一騎絕塵的市場格局下，弱差異化的產(chǎn)品往往難以突圍。如何滿足短視頻用戶的需求，激發(fā)用戶的使用，并成功地留住用戶，成為短視頻行業(yè)亟待解決的問題[3]。在此背景下，殷俊等人認為用心的細節(jié)設計會為用戶帶來驚喜，能夠增強用戶粘性和滿意度，使產(chǎn)品能夠通過差異化增強競爭力[4]。好的界面設計一方面可以創(chuàng)造美感來吸引用戶，另一方面可以引導用戶順利地完成交互過程，保證頁面的可用性[5]。在短視頻APP界面設計的相關研究中，張寶等人提出在短視頻APP界面設計時，界面的圖標、圖形位置大小都應符合用戶的使用習慣，可提高APP自身的可用性[6]。張耿認為科普類短視頻應注重信息設計的主次邏輯與畫面布局和構圖的秩序感，能有效改善用戶瀏覽體驗和知識的獲取，促進分享、轉(zhuǎn)發(fā)等互動行為[7]。田星瀚以抖音APP為例進行設計研究，發(fā)現(xiàn)短視頻APP界面設計和功能設計需極簡化，布局要符合用戶操作需求，貼緊用戶習慣[8]。

綜上所述，界面設計與布局會影響短視頻APP可用性，良好的界面設計與布局能提升用戶的瀏覽體驗，促進互動行為，提升用戶粘性。好看視頻APP是百度公司旗下的一款短視頻APP，依托百度技術，每天為1.1億用戶提供優(yōu)質(zhì)的視頻內(nèi)容。本研究將對好看視頻APP的不同界面設計進行分析，利用眼動實驗與問卷相結合的方式探索不同布局與組合方式對用戶的影響，確定用戶最偏好的設計方案，以期對短視頻APP的設計提供參考建議。

2 研究方法

2.1 實驗目的

針對好看視頻APP的界面設計與布局，了解用戶對兩種設計布局(標題位置、互動區(qū)位置)的偏好?？紤]到用戶在使用短視頻APP過程中會產(chǎn)生操作行為，同時關注界面設計與布局是否會影響到用戶對互動區(qū)的操作效率。

2.2 實驗設計

實驗采用2*2被試內(nèi)設計，自變量一為標題位置，包括標題在視頻區(qū)域上方和下方兩種情況(在后續(xù)研究中簡稱標題在上、標題在下)；自變量二為互動區(qū)位置，包括互動區(qū)在視頻區(qū)域左下方和右下方兩種情況(在后續(xù)研究中簡稱互動區(qū)在左下、互動區(qū)在右下)。其中標題在上，互動區(qū)在左下為方案A1；標題在下，互動區(qū)在左下為方案A2；標題在上，互動區(qū)在右下為方案A3；標題在下，互動區(qū)在右下為方案A4。具體方案如圖1所示。

圖1 實驗方案圖

2.3 實驗材料

由于短視頻瀏覽更偏持續(xù)性、動態(tài)化的沉浸體驗，為了保證用戶在實驗過程中還原真實體驗，確保數(shù)據(jù)的有效性。本次實驗開發(fā)了好看視頻Software Development Kit(SDK)版本進行測試(如圖2所示)，與實際發(fā)布上線的產(chǎn)品功能一致，共包括4個測試方案。在實驗過程中，主試通過點擊好看視頻APP設置界面中眼動UI類型功能欄，選擇切換不同的測試方案，便于被試完成測試。

圖2 SDK測試原型

2.4 實驗環(huán)境和設備

本次研究在實驗室環(huán)境中進行，保證每位被試的操作環(huán)境一致。實驗使用Tobii Pro Glasses 2眼動儀作為實驗儀器(如圖3)。該設備帶有無線實時觀測功能，并且具有超輕的重量，能夠獲得最自然的視覺行為數(shù)據(jù)。眼動儀采樣頻率為60 Hz，可以為絕大多數(shù)室內(nèi)環(huán)境提供最佳對比度的瞳孔圖像。該設備不僅能捕捉被試的眼動軌跡，還能分析被試的注視情況，如注視時間、注視次數(shù)的變化。同時為了避免手機屏幕和亮度帶來的額外影響，測試手機統(tǒng)一選用華為P30，分辨率為2 340×1 080，并且保證測試期間所有測試手機屏幕亮度一致。

圖3 Tobii 眼動儀

2.5 實驗流程

測試正式開始前，先讓所有被試自由體驗手機熟悉操作，減少因測試手機與日常使用不同而帶來操作不便的影響。之后由主試向被試講解實驗程序和注意事項，然后請被試進行眼動儀多點定標測試，以保證數(shù)據(jù)的準確性。校準成功后，開始實驗。實驗正式開始后，首先讓被試自由使用好看視頻APP去體驗不同的實驗方案，記錄相應的眼動數(shù)據(jù)，測試的方案順序采用拉丁方設計，以避免學習效應；其次在實驗過程中觀察被試自然行為，若被試沒有產(chǎn)生點擊互動區(qū)的行為，則引導被試在瀏覽結束后完成點擊任務，結束眼動測試。最后，在完成眼動實驗后，要求被試對每個設計方案進行相應指標評分并闡述原因(如圖4)。

圖4 實驗流程

2.6 被試

實驗邀請了30名測試者，均來自好看視頻APP的目標用戶群，符合好看視頻APP的人群結構?？紤]到眼動實驗的特殊性，被試要求無高度近視和散光，無眼病等。實驗后每名用戶都能收到一定價值的禮品卡作為酬謝見表1。

表1 被試信息表

3 測評指標

3.1 AOI興趣區(qū)劃分

AOI(Areas of Interest)為興趣區(qū)，是研究人員所關注的、被試在界面上所感興趣的注視區(qū)域(如圖5)，是分析眼動結果的基本單位。興趣區(qū)是根據(jù)智能手機上觸摸屏的可觸發(fā)區(qū)域與實驗中的目標區(qū)域劃定的[9]。本次研究中，將好看視頻的界面區(qū)域劃分為多個不同的興趣區(qū)，方便在實驗中觀察并記錄不同興趣區(qū)的數(shù)據(jù)，以及便于實驗后數(shù)據(jù)分析，其中重點關注標題區(qū)和互動區(qū)。

圖5 AOI興趣區(qū)

3.2 評估維度

本次研究重點評估顯著性、興趣度、操作便捷性、設計舒適度、設計美觀度和首選方案六個維度。顯著性的概念是在研究人的視覺感知機制時提出的，通過評估顯著性可以反映出界面上的元素吸引視覺注意的能力[10]。本研究評估顯著性是想了解標題位置和互動區(qū)位置在哪更容易讓用戶發(fā)現(xiàn)。視覺經(jīng)驗告訴我們，對于一幅圖像，眼睛對不同區(qū)域的興趣程度是不同的，通過評估興趣度，就能判斷出用戶更感興趣的區(qū)域[11]。本研究評估興趣度是想了解標題和互動區(qū)的位置放置在哪里用戶會更感興趣去注視或點擊操作。評估操作便捷性可以了解互動區(qū)等可操作區(qū)域的易用性。視覺舒適度的研究通常是對用戶進行問卷調(diào)查以及實驗后的訪談來得到數(shù)據(jù)，評估視覺舒適度可以知道用戶在使用APP過程中的自我視覺和心理感知[12]。界面的視覺美觀度會影響到產(chǎn)品的可用性、體驗等，多由設計師或者研究人員進行主觀評價，評估美觀度可以了解用戶在使用產(chǎn)品時的美學感受，幫助判斷和獲取符合用戶心理感受的美學表達[13]。評估首選方案，是想了解用戶主觀上更偏好哪個設計方案，同時了解用戶對標題位置和互動區(qū)位置的主觀偏好。

3.3 眼動指標及其意義

首視時間(First Fixation)即被試首次看到某一區(qū)域所花費的時間，時間越短，表明被試越早注意到該區(qū)域，說明該區(qū)域越顯著；可見比例(Visible Scale)，也叫注視百分比，表示看到某一區(qū)域人數(shù)的占比，百分比越高，則表明看到該區(qū)域的人越多，說明該區(qū)域越顯著[14]。注視時間(Fixation Time)是以某一個興趣區(qū)為單位，計算被試在這一區(qū)域的瀏覽時間，即為注視時間，它反映被試對該區(qū)域的興趣度[15]，時間越長說明用戶對該區(qū)域越感興趣。在測試過程中，當被試產(chǎn)生明顯提手動作到點擊任務區(qū)成功時，這段時間記錄為點擊任務完成時間，并且觀察30名被試中首次點擊任務區(qū)成功的人數(shù)比例，記錄為首次點擊成功率，用這兩個指標來反饋APP的操作便捷性見表2。

表2 指標含義及解釋

4 結果

4.1 眼動數(shù)據(jù)分析

標題位置 通過對比不同標題位置的眼動數(shù)據(jù)發(fā)現(xiàn)(見表3)，被試在瀏覽標題位置不同的設計方案時，行為存在差異。如被試在瀏覽標題在上的方案時，首視時間相較標題在下平均用時少299.0 ms，可見比例高6%，說明標題在上時更顯著，更易被用戶發(fā)現(xiàn)。且標題在上時，注視時間為239.2 ms高于標題在下，說明標題在上時用戶興趣度更高，更愿意瀏覽標題內(nèi)容。

表3 標題位置眼動數(shù)據(jù)統(tǒng)計

互動區(qū)位置 眼動數(shù)據(jù)發(fā)現(xiàn)(見表4)，互動區(qū)在右下時，首視時間相較互動區(qū)在左下用時少103.1 ms，可見比例高10%，說明互動區(qū)在右下時更顯著，更易吸引用戶注意。且互動區(qū)在右下時，用戶注視互動區(qū)的時間更長，為510.1 ms，說明互動區(qū)在右下時更易引起用戶感興趣。在操作便捷性上，互動區(qū)在右下的點擊任務完成時間略低于互動區(qū)在左下，首次點擊成功率相差不大，互動區(qū)在右下的操作便捷性略優(yōu)于互動區(qū)在左下。

表4 互動區(qū)位置眼動數(shù)據(jù)統(tǒng)計

以注視次數(shù)為基礎，將30位被試的數(shù)據(jù)疊加，得到熱力圖，反映用戶瀏覽和注視的情況，其中顏色越紅表示該區(qū)域?qū)τ脩粑υ綇姟Ｍㄟ^熱力圖可見(圖6)，標題在上，互動區(qū)在右下會更吸引用戶的注意力。

圖6 熱力圖

綜上所述，從眼動數(shù)據(jù)可知，標題在上的顯著性和興趣度優(yōu)于標題在下，互動區(qū)在右下的顯著性、興趣度和操作便捷性優(yōu)于互動區(qū)在左下，總體而言標題在上和互動區(qū)在右下的界面設計與布局優(yōu)勢較為明顯。

4.2 主觀評分結果

通過問卷了解用戶主觀上對標題位置和互動區(qū)位置的首選偏好。由表5可知，63%的用戶首選標題在上，27%用戶首選標題在下。由表6可知，73%的用戶首選互動區(qū)在右下，17%的用戶首選互動區(qū)在左下。

表5 標題位置首選占比

表6 互動區(qū)位置首選占比

用戶首選方案偏好由表7可知，方案A3首選占比最高為60%，即標題在上，互動區(qū)在右下的方案為用戶主偏好的首選設計方案。

表7 首選方案占比

由表8可知，方案A3(標題在上，互動區(qū)在右下)的設計舒適度主觀評分最高，為4.17分；美觀度主觀評分最高，為4.23分。為了檢驗用戶對不同設計方案在美觀度和舒適度的打分是否具有差異，對問卷數(shù)據(jù)進行重復測量方差分析。結果顯示，互動區(qū)位置不同的設計方案，設計美觀度的主效應差異顯著，F(xiàn)=14.77，P<0.05，標題位置的主效應不顯著，F(xiàn)=2.36，P>0.05，標題位置和互動區(qū)位置交互作用不顯著。互動區(qū)位置不同的設計方案，設計舒適度評分主效應差異顯著，F(xiàn)=33.26，P<0.05，標題位置的主效應不顯著，F(xiàn)=2.17，P>0.05，標題位置和互動區(qū)位置交互作用不顯著。通過數(shù)據(jù)分析結果發(fā)現(xiàn)，互動區(qū)在右下的設計方案的設計美觀度和設計舒適度均>互動區(qū)在左下的設計方案。

表8 不同設計方案的美觀度和舒適度評分

綜上所述，結合客觀的眼動數(shù)據(jù)和主觀的問卷調(diào)查數(shù)據(jù)，用戶均偏好標題位置在視頻區(qū)上方，互動區(qū)位置在視頻區(qū)右下方的界面設計與布局，即方案A3為最優(yōu)設計方案。

5 討論

本研究探討了用戶對好看視頻APP四種設計方案的偏好，結果發(fā)現(xiàn)：用戶更偏好方案A3(標題在上，互動區(qū)在右下)。結合定性分析發(fā)現(xiàn)，用戶偏好標題在上是因為標題在視頻區(qū)上方更突出，便于用戶根據(jù)標題內(nèi)容選擇判斷是否觀看該條推薦視頻。這也是因為好看視頻APP的視頻內(nèi)容偏中長度時長，視頻預覽封面上沒有標題展示，用戶需要獲取信息對視頻內(nèi)容做出快速判斷，針對這樣的視頻呈現(xiàn)方式，標題在上更方便用戶進行篩選。標題在下時，視覺上會感到標題區(qū)和相關推薦區(qū)為一個整體，會顯得手機屏幕下半?yún)^(qū)的設計元素過多，視覺上顯得擁擠。偏好標題在下的用戶，因為受抖音、快手這類短視頻APP的影響，在日?？匆曨l的時候就較少參考標題文字，只關注視頻內(nèi)容，通過短視頻前幾秒的內(nèi)容做快速判斷，不喜歡就切換一下一條視頻。

對于互動區(qū)位置，偏好互動區(qū)在視頻區(qū)右下的用戶是因為這樣更符合他們平時的操作習慣，體驗更佳。且調(diào)研發(fā)現(xiàn)我國右利手的比例高達99.77%[16]，互動區(qū)在右下的設計也符合大部分國人的習慣。同時，實驗過程中觀察發(fā)現(xiàn)，互動區(qū)在右下方時離拇指操作區(qū)更近，單手即可操作，用戶無需更換持握姿勢或換手操作，操作更加便捷。這些原因也造成了用戶認為互動區(qū)在右下時，設計的美觀度和舒適度會更好。相反，互動區(qū)在左下方時，右利手用戶會調(diào)整手機持握姿勢或換另外一只手點擊，這個過程會使用戶感到不適，從而增加點擊互動區(qū)的時間。但是不論互動區(qū)在左下還是右下，拇指操作區(qū)都離互動區(qū)較近，用戶點擊互動區(qū)的成功率也都較高，差別不大。

從整體上來講，用戶偏好方案A3的原因，一是A3標題在上，易于發(fā)現(xiàn)識別，符合用戶瀏覽邏輯，且相對于標題在下的視覺呈現(xiàn)更舒適，不會顯得屏幕中部擁擠、信息冗余；二是A3接近用戶使用APP的常規(guī)布局，符合認知習慣；三是A3互動區(qū)在右下，更符合用戶的操作習慣。

6 結語

本研究主要采用了眼動實驗和問卷調(diào)查兩個研究方法探索用戶對好看視頻APP不同界面設計與布局的偏好。眼動實驗可以了解用戶在真實使用好看視頻APP時的注意力分布情況，幫助研究人員捕捉和觀察用戶客觀的使用行為。同時，由于眼動設備實時記錄用戶操作過程，伴隨研究人員在旁同步觀察追問，用戶較難回憶和表達的卡頓、誤觸、點擊無反應、交互操作等問題更易被清晰記錄和有效發(fā)覺，這些內(nèi)容需要視頻直觀的展示，因此未在文中體現(xiàn)。在眼動實驗后，通過問卷調(diào)查獲取用戶對不同設計方案的主觀偏好，以及偏好的原因等。相對于單一的研究方法，本研究的分析過程統(tǒng)一了客觀標準和主觀判斷，更合理、更有效。在實際情況中，好看視頻APP的設計師基于研究結果，設計并開發(fā)上線了方案A3的設計版本，線上數(shù)據(jù)良好，也從商業(yè)指標上驗證本次研究的結果。不過本次研究只考慮標題位置和互動區(qū)位置的設計與布局，未關注好看視頻APP界面中如視頻區(qū)、相關推薦區(qū)等其他設計元素，也未考慮標題內(nèi)容、視頻類型等因素對用戶的影響，這些元素可能會對用戶使用APP時的瀏覽行為和操作行為產(chǎn)生影響，需要在后續(xù)綜合考慮進行深入研究。