賈梧，周睿，劉揚(yáng)，陳楠，史玉潔

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

1 引言

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

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

2 研究方法

2.1 實(shí)驗(yàn)?zāi)康?/h3>

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

2.2 實(shí)驗(yàn)設(shè)計(jì)

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

圖1 實(shí)驗(yàn)方案圖

2.3 實(shí)驗(yàn)材料

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

圖2 SDK測試原型

2.4 實(shí)驗(yàn)環(huán)境和設(shè)備

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

圖3 Tobii 眼動(dòng)儀

2.5 實(shí)驗(yàn)流程

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

圖4 實(shí)驗(yàn)流程

2.6 被試

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

表1 被試信息表

3 測評指標(biāo)

3.1 AOI興趣區(qū)劃分

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

圖5 AOI興趣區(qū)

3.2 評估維度

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

3.3 眼動(dòng)指標(biāo)及其意義

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

表2 指標(biāo)含義及解釋

4 結(jié)果

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

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

表3 標(biāo)題位置眼動(dòng)數(shù)據(jù)統(tǒng)計(jì)

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

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

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

圖6 熱力圖

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

4.2 主觀評分結(jié)果

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

表5 標(biāo)題位置首選占比

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

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

表7 首選方案占比

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

表8 不同設(shè)計(jì)方案的美觀度和舒適度評分

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

5 討論

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

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

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

6 結(jié)語

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