1984 年,年僅 29 歲的喬布斯決定推出一款面向個人用戶的家用電腦。
發(fā)布會上,他設(shè)定程序讓第一代 Mac(Macintosh)“自我介紹”,驚艷全場。
此后,這款被他稱為“一生中最美作品”的電腦一炮而紅,雖然售價高達(dá) 2495 美元,但仍被搶購一空,進(jìn)入了千千萬萬的家庭之中。
但哪怕強如喬布斯,在這臺電腦的設(shè)計上也有瑕疵:它在加載的時候,只讓指針光標(biāo)變成一個表盤,除此之外沒有任何提示。
想象一下,你想玩?zhèn)€電腦游戲,但是點擊圖標(biāo)之后,電腦沒有任何回應(yīng)。你感覺有點猶疑不安,考慮著要不要再點擊一次。當(dāng)你第 3 次看向手表的時候,游戲終于打開了。
好不容易打完一關(guān),畫面突然靜止不動,你不知道它究竟是出 BUG 了還是在加載下一關(guān),你甚至不知道電腦是否在運行,你能做的只有等下去,沒有盡頭地等下去。
128KB 存儲器與堪比龜爬網(wǎng)速的搭配,再加上毫無提示,帶來的就是這樣讓人抓狂的情景。
這不是 mac 特有的問題,事實上,當(dāng)時還沒有哪個廠家知道,該如何解決用戶等待過程中產(chǎn)生的焦慮。
直到一年后的人機交互大會上,一位年輕的計算機博士布拉德?邁爾斯(Brad Myers)才提出一個很簡單的解決辦法,那就是 ——
進(jìn)度條(progress indicator)。
小小進(jìn)度條,大大的功效
在 1984 年之前,其實是有進(jìn)度指示存在的,但并不是特別普及,并且設(shè)計者沒有認(rèn)識到,進(jìn)度條的作用竟有那么大。
直到邁爾斯做了個小實驗,人們才逐漸意識到看似不起眼的進(jìn)度條所起到的巨大作用。
他找來兩組學(xué)生分別在有 / 無進(jìn)度條的情況下操作電腦,最后有 86% 的學(xué)生反饋說他們喜歡有進(jìn)度條的設(shè)計。
甚至于他們根本不在乎進(jìn)度條準(zhǔn)不準(zhǔn)確,只要有一個指標(biāo)在那里,就可以讓他們安心坐在電腦前等待。
進(jìn)度條可以化身為用戶的“安撫奶嘴”,讓他們不至于在電腦前坐立不安。
在進(jìn)度條面前,連時間的流逝都感覺變快。
人體不存在直接感知時間的器官,身體內(nèi)部的一些節(jié)律可以給予我們時間感,比如心跳、飲食和睡眠等,這使得時間知覺的主觀色彩極強。
愛因斯坦就對此進(jìn)行過調(diào)侃:“跟一個漂亮女孩在公園的長椅上坐一個小時就像只過了一分鐘,但是把手放在火爐上一分鐘就像過了一小時?!?/p>
相比較空白的界面,進(jìn)度條更能讓我們體驗到時間的流逝,不同的進(jìn)度條還會產(chǎn)生不同的效果。
比如,研究者發(fā)現(xiàn),相比較平整樣式的進(jìn)度條,螺旋紋路進(jìn)度條會讓被試覺得時間過得更快。
他還發(fā)現(xiàn),如果把整個進(jìn)度條平均分割成很多個小切塊,進(jìn)度條按照一個個切塊向前推進(jìn)時,在相同速度下,切塊的長度越小,人們就會覺得時間過得越快。
進(jìn)度條讓人更能忍耐,也更有干勁
改變時間知覺后,進(jìn)度條就能讓人“忍常人所不能忍”。
人們在使用電腦時,每個操作都需要得到一個視覺反饋,這種反饋的存在可以提高用戶對等待的忍耐程度。
用戶研究領(lǐng)域的專家尼爾森(Jakob Nielsen)表示,只要超過 1 秒不給反饋,使用者就有退出程序的風(fēng)險,而進(jìn)度條的使用能大大降低用戶退出程序的風(fēng)險,延長了他們的等待時間。
進(jìn)度條甚至還可以讓人們在做任務(wù)的時候表現(xiàn)得更好。比如,研究人員將被試隨機分為兩組完成實驗任務(wù),為其中一組提供進(jìn)度信息,另外一組則沒有。
結(jié)果發(fā)現(xiàn),提供進(jìn)度信息不僅可以讓人們在做任務(wù)時提升準(zhǔn)確率,減少反應(yīng)時間,并且更有干勁,所需的休息時間也會更少。
進(jìn)度條能起到很大的作用,但實際上進(jìn)度條到底準(zhǔn)不準(zhǔn)呢?幾乎不準(zhǔn),因為程序加載進(jìn)度很難計算,只能估計。
事先估算好進(jìn)度條時間,但最后實際加載時間比這個時間長,怎么辦呢?
把進(jìn)度條卡在 99% 就行。所以你會看到很多程序卡在最后的 1% 上,即使整個任務(wù)的剩余進(jìn)程遠(yuǎn)多于 1%。
但正如上面說的,進(jìn)度條是“真”是“假”根本不重要,有個進(jìn)度在這,人類就會安心很多啦。
暗藏玄機的進(jìn)度條
看似設(shè)計隨意的進(jìn)度條,其實也有很多巧思。
單調(diào)的加載圖案看膩了?設(shè)計師們可以為你呈現(xiàn)充滿創(chuàng)意的、可愛的進(jìn)度條,甚至有的程序?qū)⑦M(jìn)度條設(shè)置成了單機小游戲,讓你在放松和娛樂中度過等待的時光。
還有一些類型的進(jìn)度條通過操控外形變化來讓我們獲得“爽感”。比如,進(jìn)度條在剛開始的時候可以稍微加速,中間段緩下來,到即將完成的時候再來一個滑鏟,直沖 100%!
增加切塊個數(shù),讓進(jìn)度條“轉(zhuǎn)得更快”,或是將轉(zhuǎn)動方向設(shè)置成與進(jìn)度條前進(jìn)相反的方向,也可以讓人們誤以為速度提升了。
還有設(shè)計者發(fā)現(xiàn),相比較呈現(xiàn)出不確定性的進(jìn)度條(下圖左),人們更喜歡有明確起點和終點的(下圖右)。
進(jìn)度條的出現(xiàn)源于人類對于不確定性的難以忍受,和對掌控感的追求。
但在現(xiàn)實中,有很多事情我們無法預(yù)知未來走向,比如戀愛、壽命等,沒有那么方便的實時進(jìn)度條,告訴你這些事情進(jìn)展到了百分之多少。
面對不確定性,有人選擇試著在人生里制造出自己專屬的進(jìn)度條:定下詳細(xì)目標(biāo)、樹立里程碑、時時注意當(dāng)下進(jìn)度。
還有人則選擇擁抱全然的未知,鼓起勇氣,忍著不適,邁入迷霧籠罩的黑暗荒野。
無論你選擇哪條路,都祝你好運!
參考文獻(xiàn)
1. Raczkowski, F., & Shnayien, M. (2019). History and Aesthetics of Progress Indicators. Tekniikan Waiheita, 37(3), 57–67. https://doi.org/10.33355/tw.86775
2. https://www.youtube.com/watch?v=VJI88QIW7H4&t=1406s
3. Myers, B. A. (1985). The importance of percent-done progress indicators for computer-human interfaces. ACM SIGCHI Bulletin, 16(4), 11–17. https://doi.org/10.1145/1165385.317459
4. Harrison, C., Yeo, Z., & Hudson, S. E. (2010). Faster progress bars. Proceedings of the 28th International Conference on Human Factors in Computing Systems - CHI ’10. https://doi.org/10.1145/1753326.1753556
5. Ziat, M., Saoud, W., Prychitko, S., Servos, P., & Grondin, S. (2022). Malleability of time through progress bars and throbbers. Scientific Reports, 12(1). https://doi.org/10.1038/s41598-022-14649-1
6. Li, W., Wang, M., Li, W., Cai, B., & Shi, Y. (2020). An Improvement on the Progress Bar: Make It a Story, Make It a Game. Advances in Usability, User Experience, Wearable and Assistive Technology, 394–401. https://doi.org/10.1007/978-3-030-51828-8_51
7. Nah, F. F.-H. (2004). A study on tolerable waiting time: how long are Web users willing to wait? Behaviour & Information Technology, 23(3), 153–163. https://doi.org/10.1080/01449290410001669914
8. https://www.nngroup.com/articles/response-times-3-important-limits/
9. https://isux.tencent.com/articles/106.html
10. Devine, S., & Otto, A. R. (2022). Information about task progress modulates cognitive demand avoidance. Cognition, 225, 105107. https://doi.org/10.1016/j.cognition.2022.105107
11. https://www.smashingmagazine.com/2016/12/best-practices-for-animated-progress-indicators/
12. Katzir, M., Emanuel, A., & Liberman, N. (2020). Cognitive performance is enhanced if one knows when the task will end. Cognition, 197, 104189. https://doi.org/10.1016/j.cognition.2020.104189
13. Harrison, C., Amento, B., Kuznetsov, S., & Bell, R. (2007). Rethinking the progress bar. Proceedings of the 20th Annual ACM Symposium on User Interface Software and Technology - UIST ’07. https://doi.org/10.1145/1294211.1294231
14. https://developer.apple.com/design/human-interface-guidelines/components/status/progress-indicators/
本文來自微信公眾號:果殼 (ID:Guokr42),作者:黑將軍,編輯:Emeria、游識猷、odette
廣告聲明:文內(nèi)含有的對外跳轉(zhuǎn)鏈接(包括不限于超鏈接、二維碼、口令等形式),用于傳遞更多信息,節(jié)省甄選時間,結(jié)果僅供參考,IT之家所有文章均包含本聲明。