進度條，竟然是假的，那要它有啥用？

1984年，年僅29歲的賈伯斯決定推出一款面向個人使用者的家用電腦。

發佈會上，他設定程序讓第一代Mac（Macintosh）“自我介紹”，驚豔全場。

第一代Mac首次實現了將圖形使用者介面廣泛應用到個人電腦上，

它甚至會“唱、跳、rap”

此後，這款被他稱為“一生中最美作品”的電腦一炮而紅，雖然售價高達2495美元，但仍被搶購一空，進入了千千萬萬的家庭之中。

但哪怕強如賈伯斯，在這台電腦的設計上也有瑕疵：它在載入的時候，只讓指針游標變成一個表盤，除此之外沒有任何提示。

想像一下，你想玩個電腦遊戲，但是點選圖示之後，電腦沒有任何回應。你感覺有點猶疑不安，考慮著要不要再點選一次。當你第3次看向手錶的時候，遊戲終於打開了。

好不容易打完一關，畫面突然靜止不動，你不知道它究竟是出BUG了還是在載入下一關，你甚至不知道電腦是否在運行，你能做的只有等下去，沒有盡頭地等下去。

128KB儲存器與堪比龜爬網速的搭配，再加上毫無提示，帶來的就是這樣讓人抓狂的情景。

賈伯斯和Macintosh電腦

這不是mac特有的問題，事實上，當時還沒有哪個廠家知道，該如何解決使用者等待過程中產生的焦慮。

直到一年後的人機互動大會上，一位年輕的電腦博士布拉德·邁爾斯（Brad Myers）才提出一個很簡單的解決辦法，那就是——

進度條（progress indicator）。

小小進度條，大大的功效

在1984年之前，其實是有進度指示存在的，但並不是特別普及，並且設計者沒有認識到，進度條的作用竟有那麼大。

直到邁爾斯做了個小實驗，人們才逐漸意識到看似不起眼的進度條所起到的巨大作用。

他找來兩組學生分別在有/無進度條的情況下操作電腦，最後有86%的學生反饋說他們喜歡有進度條的設計。

我不太理解這個結果 —— 剩下的14%呢？是沒用過電腦嗎？

甚至於他們根本不在乎進度條準不準確，只要有一個指標在那裡，就可以讓他們安心坐在電腦前等待。

進度條可以化身為使用者的“安撫奶嘴”，讓他們不至於在電腦前坐立不安。

在進度條面前，連時間的流逝都感覺變快。

人體不存在直接感知時間的器官，身體內部的一些節律可以給予我們時間感，比如心跳、飲食和睡眠等，這使得時間知覺的主觀色彩極強。

愛因斯坦就對此進行過調侃：“跟一個漂亮女孩在公園的長椅上坐一個小時就像只過了一分鐘，但是把手放在火爐上一分鐘就像過了一小時。”

這話真的是愛因斯坦說的 | 圖源@ azquotes

相比較空白的介面，進度條更能讓我們體驗到時間的流逝，不同的進度條還會產生不同的效果。

比如，研究者發現，相比較平整樣式的進度條，螺旋紋路進度條會讓被試覺得時間過得更快。

他還發現，如果把整個進度條平均分割成很多個小切塊，進度條按照一個個切塊向前推進時，在相同速度下，切塊的長度越小，人們就會覺得時間過得越快。

左右運動速度相同情況下，我們會認為有更多圓點的進度條運轉更快

進度條讓人更能忍耐，也更有幹勁

改變時間知覺後，進度條就能讓人“忍常人所不能忍”。

人們在使用電腦時，每個操作都需要得到一個視覺反饋，這種反饋的存在可以提高使用者對等待的忍耐程度。

使用者研究領域的專家尼爾森（Jakob Nielsen）表示，只要超過1秒不給反饋，使用者就有退出程序的風險，而進度條的使用能大大降低使用者退出程序的風險，延長了他們的等待時間。

進度條甚至還可以讓人們在做任務的時候表現得更好。比如，研究人員將被試隨機分為兩組完成實驗任務，為其中一組提供進度資訊，另外一組則沒有。

結果發現，提供進度資訊不僅可以讓人們在做任務時提升精準率，減少反應時間，並且更有幹勁，所需的休息時間也會更少。

有進度資訊組（實線）明顯比無進度資訊組（虛線）表現更好

進度條能起到很大的作用，但實際上進度條到底准不准呢？幾乎不准，因為程序載入進度很難計算，只能估計。

事先估算好進度條時間，但最後實際載入時間比這個時間長，怎麼辦呢？

把進度條卡在99%就行。所以你會看到很多程序卡在最後的1%上，即使整個任務的剩餘處理程序遠多於1%。

但正如上面說的，進度條是“真”是“假”根本不重要，有個進度在這，人類就會安心很多啦。

暗藏玄機的進度條

看似設計隨意的進度條，其實也有很多巧思。

單調的載入圖案看膩了？設計師們可以為你呈現充滿創意的、可愛的進度條，甚至有的程序將進度條設定成了單機小遊戲，讓你在放鬆和娛樂中度過等待的時光。

還有一些類型的進度條通過操控外形變化來讓我們獲得“爽感”。比如，進度條在剛開始的時候可以稍微加速，中間段緩下來，到即將完成的時候再來一個滑鏟，直衝100%！

增加切塊個數，讓進度條“轉得更快”，或是將轉動方向設定成與進度條前進相反的方向，也可以讓人們誤以為速度提升了。

還有設計者發現，相比較呈現出不確定性的進度條（下圖左），人們更喜歡有明確起點和終點的（下圖右）。

哪怕進度條一直卡在95%……

進度條的出現源於人類對於不確定性的難以忍受，和對掌控感的追求。

但在現實中，有很多事情我們無法預知未來走向，比如戀愛、壽命等，沒有那麼方便的即時進度條，告訴你這些事情進展到了百分之多少。

面對不確定性，有人選擇試著在人生裡製造出自己專屬的進度條：定下詳細目標、樹立里程碑、時時注意當下進度。

還有人則選擇擁抱全然的未知，鼓起勇氣，忍著不適，邁入迷霧籠罩的黑暗荒野。

無論你選擇哪條路，都祝你好運！

參考文獻

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，36氪經授權發佈。

本文經授權發布，不代表36氪立場。

如若轉載請註明出處。來源出處：36氪