關(guān)于“等待”的交互設(shè)計(jì)

6 評(píng)論 22787 瀏覽 101 收藏 9 分鐘

編輯導(dǎo)語(yǔ):大家在使用各種APP和軟件等互聯(lián)網(wǎng)產(chǎn)品時(shí),“等待”過(guò)程會(huì)頻繁的出現(xiàn)在使用過(guò)程中。在現(xiàn)有技術(shù)條件下,等待是人們和這些互聯(lián)網(wǎng)產(chǎn)品交互過(guò)程中不可避免的,尤其是在網(wǎng)絡(luò)不好的條件下。當(dāng)?shù)却裏o(wú)法避免的時(shí)候,我們應(yīng)該如何優(yōu)化等待體驗(yàn)?zāi)兀?/p>

01 背景

等待是人一生不可避免的事情:購(gòu)票排隊(duì)時(shí)的等待,飛機(jī)延誤時(shí)的等待,就餐時(shí)的等待…等待往往和無(wú)聊、厭煩的情緒聯(lián)系在一起,因?yàn)槿藗冊(cè)诘却胁粌H浪費(fèi)了大量時(shí)間,同時(shí)還要承受心理上的煎熬,時(shí)間越長(zhǎng)心情越糟糕。

在人機(jī)交互中,“等待”的狀態(tài)也常常出現(xiàn)。這篇文章將講述如何處理人機(jī)交互中的“等待”。

等待的時(shí)間可以分為兩個(gè)方面。一個(gè)是“物理的等待時(shí)間”,指客觀上時(shí)長(zhǎng):13秒的100米跑,2個(gè)小時(shí)的迪士尼排隊(duì)。另外一個(gè)是“心理的等待時(shí)間”,比如古語(yǔ)中的一日不見(jiàn)如隔三秋,一年一次回家過(guò)年的急切心情。

02 物理的等待時(shí)間

正常的使用流程如下圖所示。等待是加載資源是需要時(shí)間,一段文字、一張圖片、一段視頻都會(huì)耗費(fèi)時(shí)間。用戶(hù)的通用行為模型是時(shí)間流程特別明顯。那么我們就可以從“時(shí)間”上嘗試控制系統(tǒng)的加載行為。

流程示意圖:

用戶(hù)的行為認(rèn)知點(diǎn)有兩個(gè),一是“觸發(fā)等待”,二是“收到反饋”。由此將時(shí)間段分為3個(gè),“觸發(fā)行為前“、”收到反饋后“、”觸發(fā)行為后收到反饋前“。

加載在觸發(fā)前(時(shí)間段一)

方式一表示的是所有內(nèi)容在當(dāng)前頁(yè)面加載,點(diǎn)擊之后內(nèi)容無(wú)需等待即可出現(xiàn)。大概是因?yàn)橘Y源加載的原因,所以這種方式極少出現(xiàn)。更多的情況是方式二——加載部分內(nèi)容,例如小紅書(shū)在沒(méi)有進(jìn)入內(nèi)容詳情的情況下,自動(dòng)加載了里面的文字內(nèi)容。

流程示意圖:

加載在收到反饋后(時(shí)間段三)

這是個(gè)很“調(diào)皮”的做法,系統(tǒng)告訴你已經(jīng)完成了事情,但是它沒(méi)有完成,后來(lái)在那邊撲哧撲哧地干活。頗有種有種玩游戲時(shí),爸媽問(wèn)孩子有沒(méi)有把作業(yè)完成,雖然壓根沒(méi)做,但是頭點(diǎn)得像搗蒜一樣。最后在晚上偷偷做。

知乎“發(fā)布視頻”界面,從相冊(cè)中選中視頻,直接在編輯界面中展現(xiàn)出來(lái)。若此時(shí)快速退出,則會(huì)提醒“還有文件在上傳中,離開(kāi)會(huì)放棄上傳”。界面上沒(méi)有任何東西表達(dá)“上傳”的意思,把“上傳”隱藏了起來(lái)。

流程示意圖:

加載在觸發(fā)后反饋前(時(shí)間段二)

這個(gè)看起來(lái)和普通沒(méi)有區(qū)別,但仍然有優(yōu)秀的設(shè)計(jì)方法優(yōu)化“等待”的問(wèn)題。這里需要對(duì)“提供反饋”深入理解,一般理解的“提供反饋”是一個(gè)點(diǎn),比如在teambition上傳文件中“上傳完成”是一個(gè)點(diǎn)。但是反饋可以理解成一條“線”,比如上傳過(guò)程中的進(jìn)度百分比,系統(tǒng)在加載的過(guò)程中,時(shí)時(shí)刻刻提供反饋。

也許有人會(huì)講“知道進(jìn)度,對(duì)節(jié)省物理的時(shí)間沒(méi)有作用”。在這里確實(shí)是這樣,但是在其他的軟件中有優(yōu)秀的案例。

迅雷的邊下載邊播功能。用戶(hù)不需要等待視頻完全下載完成再去看,軟件下載的過(guò)程中,視頻可看的進(jìn)度條一直延長(zhǎng),可看的部分一直增加。這樣就可以省去了用戶(hù)的等待時(shí)間。

另外一個(gè)案例是圖片加載,從模糊到清晰。這個(gè)功能在各大網(wǎng)站上均有使用,目的是為了好的用戶(hù)體驗(yàn),否則大塊的空白,讓人感到焦慮。如果在網(wǎng)速較慢的環(huán)境下,檢索圖片的過(guò)程中,只要憑借模糊的樣子就可以判斷該圖片是否是自己所需要的。這同樣增加了效率。

流程示意圖如下:

03 心理的等待時(shí)間

心理的等待時(shí)間是用戶(hù)主觀上對(duì)時(shí)間長(zhǎng)度的判斷,這與客觀的物理的時(shí)間有很大不同。例如我們到醫(yī)院看病,身體不適,前面又是如長(zhǎng)龍一般的隊(duì)伍,可能實(shí)際時(shí)間只花了半個(gè)小時(shí),但是好像感覺(jué)等了幾個(gè)小時(shí)一般。下面是減少心理等待時(shí)間的一點(diǎn)總結(jié)

1. 提供愉悅的環(huán)境

使用輕松、娛樂(lè)的圖文、視頻內(nèi)容,這方面游戲《原神》的處理得非常優(yōu)秀。在悠揚(yáng)的人聲下,道路不斷向前蔓延,周遭是獨(dú)特奇特的建筑物,不自覺(jué)得就被吸引住了。等待變成了一種享受。

2. 不打斷其他行為

大衛(wèi)·邁斯特爾與M.戴維斯,J.海尼克通過(guò)對(duì)現(xiàn)實(shí)生活中處于等待狀態(tài)的用戶(hù)進(jìn)行了實(shí)驗(yàn)研究,并在實(shí)驗(yàn)中發(fā)現(xiàn)無(wú)所事事的等待比有事可干的等待感覺(jué)要長(zhǎng)。

如果你在軟件上加載,用戶(hù)應(yīng)當(dāng)可以在該設(shè)備上干其他事情,并且不會(huì)影響加載過(guò)程。從體驗(yàn)的角度來(lái)講,iOS中愛(ài)奇藝視頻開(kāi)頭的廣告,比起電腦上差了很多。在電腦上,用戶(hù)完全可以邊等廣告,邊其他軟件上操作;而在iOS中無(wú)法做到這一點(diǎn)。

3. 提供準(zhǔn)確的進(jìn)度

提升用戶(hù)交互等待體驗(yàn)的基本要求是讓用戶(hù)了解等待需要的時(shí)間,當(dāng)前進(jìn)度,以及預(yù)期剩余時(shí)間。人們對(duì)未知的東西會(huì)抱有焦慮的情緒,提供明確的能很好得緩解這種情緒。百度云盤(pán)作為一個(gè)下載軟件采用了時(shí)間提示和進(jìn)度條的形式顯示時(shí)間,很好得寫(xiě)出了用戶(hù)所需要的信息。

 

本文由 @biubiu 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載

題圖來(lái)自Unsplash,基于CC0協(xié)議

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 總結(jié)一下:1.系統(tǒng)后臺(tái)信息傳輸,不顯示過(guò)程。2.邊信息傳輸邊開(kāi)放部分功能供用戶(hù)使用。3.改變等待心理感受。歡迎補(bǔ)充

    來(lái)自北京 回復(fù)
  2. 亂七八糟

    來(lái)自上海 回復(fù)
  3. 都是說(shuō)的一些廢話(huà)

    來(lái)自廣東 回復(fù)
    1. 你好,這篇文章著重講述使用“時(shí)間線”的方式去思考解決問(wèn)題。如有更好的想法,歡迎探討

      回復(fù)
    2. 系統(tǒng)測(cè)試,請(qǐng)勿回復(fù)

      來(lái)自北京 回復(fù)
  4. 先碼后看

    回復(fù)