1984 年，年僅 29 歲的喬布斯決定推出一款面向個(gè)人用戶(hù)的家用電腦。
發(fā)布會(huì)上，他設(shè)定程序讓第一代 Mac（Macintosh）“自我介紹”，驚艷全場(chǎng)。
此后，這款被他稱(chēng)為“一生中最美作品”的電腦一炮而紅，雖然售價(jià)高達(dá) 2495 美元，但仍被搶購(gòu)一空，進(jìn)入了千千萬(wàn)萬(wàn)的家庭之中。
但哪怕強(qiáng)如喬布斯，在這臺(tái)電腦的設(shè)計(jì)上也有瑕疵：它在加載的時(shí)候，只讓指針光標(biāo)變成一個(gè)表盤(pán)，除此之外沒(méi)有任何提示。
想象一下，你想玩?zhèn)€電腦游戲，但是點(diǎn)擊圖標(biāo)之后，電腦沒(méi)有任何回應(yīng)。你感覺(jué)有點(diǎn)猶疑不安，考慮著要不要再點(diǎn)擊一次。當(dāng)你第 3 次看向手表的時(shí)候，游戲終于打開(kāi)了。
好不容易打完一關(guān)，畫(huà)面突然靜止不動(dòng)，你不知道它究竟是出 BUG 了還是在加載下一關(guān)，你甚至不知道電腦是否在運(yùn)行，你能做的只有等下去，沒(méi)有盡頭地等下去。
128KB 存儲(chǔ)器與堪比龜爬網(wǎng)速的搭配，再加上毫無(wú)提示，帶來(lái)的就是這樣讓人抓狂的情景。
這不是 mac 特有的問(wèn)題，事實(shí)上，當(dāng)時(shí)還沒(méi)有哪個(gè)廠家知道，該如何解決用戶(hù)等待過(guò)程中產(chǎn)生的焦慮。
直到一年后的人機(jī)交互大會(huì)上，一位年輕的計(jì)算機(jī)博士布拉德?邁爾斯（Brad Myers）才提出一個(gè)很簡(jiǎn)單的解決辦法，那就是 ——
進(jìn)度條（progress indicator）。
小小進(jìn)度條，大大的功效
在 1984 年之前，其實(shí)是有進(jìn)度指示存在的，但并不是特別普及，并且設(shè)計(jì)者沒(méi)有認(rèn)識(shí)到，進(jìn)度條的作用竟有那么大。
直到邁爾斯做了個(gè)小實(shí)驗(yàn)，人們才逐漸意識(shí)到看似不起眼的進(jìn)度條所起到的巨大作用。
他找來(lái)兩組學(xué)生分別在有 / 無(wú)進(jìn)度條的情況下操作電腦，最后有 86% 的學(xué)生反饋說(shuō)他們喜歡有進(jìn)度條的設(shè)計(jì)。
甚至于他們根本不在乎進(jìn)度條準(zhǔn)不準(zhǔn)確，只要有一個(gè)指標(biāo)在那里，就可以讓他們安心坐在電腦前等待。
進(jìn)度條可以化身為用戶(hù)的“安撫奶嘴”，讓他們不至于在電腦前坐立不安。
在進(jìn)度條面前，連時(shí)間的流逝都感覺(jué)變快。
人體不存在直接感知時(shí)間的器官，身體內(nèi)部的一些節(jié)律可以給予我們時(shí)間感，比如心跳、飲食和睡眠等，這使得時(shí)間知覺(jué)的主觀色彩極強(qiáng)。
愛(ài)因斯坦就對(duì)此進(jìn)行過(guò)調(diào)侃：“跟一個(gè)漂亮女孩在公園的長(zhǎng)椅上坐一個(gè)小時(shí)就像只過(guò)了一分鐘，但是把手放在火爐上一分鐘就像過(guò)了一小時(shí)?！?/p>
相比較空白的界面，進(jìn)度條更能讓我們體驗(yàn)到時(shí)間的流逝，不同的進(jìn)度條還會(huì)產(chǎn)生不同的效果。
比如，研究者發(fā)現(xiàn)，相比較平整樣式的進(jìn)度條，螺旋紋路進(jìn)度條會(huì)讓被試覺(jué)得時(shí)間過(guò)得更快。
他還發(fā)現(xiàn)，如果把整個(gè)進(jìn)度條平均分割成很多個(gè)小切塊，進(jìn)度條按照一個(gè)個(gè)切塊向前推進(jìn)時(shí)，在相同速度下，切塊的長(zhǎng)度越小，人們就會(huì)覺(jué)得時(shí)間過(guò)得越快。
進(jìn)度條讓人更能忍耐，也更有干勁
改變時(shí)間知覺(jué)后，進(jìn)度條就能讓人“忍常人所不能忍”。
人們?cè)谑褂秒娔X時(shí)，每個(gè)操作都需要得到一個(gè)視覺(jué)反饋，這種反饋的存在可以提高用戶(hù)對(duì)等待的忍耐程度。
用戶(hù)研究領(lǐng)域的專(zhuān)家尼爾森（Jakob Nielsen）表示，只要超過(guò) 1 秒不給反饋，使用者就有退出程序的風(fēng)險(xiǎn)，而進(jìn)度條的使用能大大降低用戶(hù)退出程序的風(fēng)險(xiǎn)，延長(zhǎng)了他們的等待時(shí)間。
進(jìn)度條甚至還可以讓人們?cè)谧鋈蝿?wù)的時(shí)候表現(xiàn)得更好。比如，研究人員將被試隨機(jī)分為兩組完成實(shí)驗(yàn)任務(wù)，為其中一組提供進(jìn)度信息，另外一組則沒(méi)有。
結(jié)果發(fā)現(xiàn)，提供進(jìn)度信息不僅可以讓人們?cè)谧鋈蝿?wù)時(shí)提升準(zhǔn)確率，減少反應(yīng)時(shí)間，并且更有干勁，所需的休息時(shí)間也會(huì)更少。
進(jìn)度條能起到很大的作用，但實(shí)際上進(jìn)度條到底準(zhǔn)不準(zhǔn)呢？幾乎不準(zhǔn)，因?yàn)槌绦蚣虞d進(jìn)度很難計(jì)算，只能估計(jì)。
事先估算好進(jìn)度條時(shí)間，但最后實(shí)際加載時(shí)間比這個(gè)時(shí)間長(zhǎng)，怎么辦呢？
把進(jìn)度條卡在 99% 就行。所以你會(huì)看到很多程序卡在最后的 1% 上，即使整個(gè)任務(wù)的剩余進(jìn)程遠(yuǎn)多于 1%。
但正如上面說(shuō)的，進(jìn)度條是“真”是“假”根本不重要，有個(gè)進(jìn)度在這，人類(lèi)就會(huì)安心很多啦。
暗藏玄機(jī)的進(jìn)度條
看似設(shè)計(jì)隨意的進(jìn)度條，其實(shí)也有很多巧思。
單調(diào)的加載圖案看膩了？設(shè)計(jì)師們可以為你呈現(xiàn)充滿(mǎn)創(chuàng)意的、可愛(ài)的進(jìn)度條，甚至有的程序?qū)⑦M(jìn)度條設(shè)置成了單機(jī)小游戲，讓你在放松和娛樂(lè)中度過(guò)等待的時(shí)光。
還有一些類(lèi)型的進(jìn)度條通過(guò)操控外形變化來(lái)讓我們獲得“爽感”。比如，進(jìn)度條在剛開(kāi)始的時(shí)候可以稍微加速，中間段緩下來(lái)，到即將完成的時(shí)候再來(lái)一個(gè)滑鏟，直沖 100%！
增加切塊個(gè)數(shù)，讓進(jìn)度條“轉(zhuǎn)得更快”，或是將轉(zhuǎn)動(dòng)方向設(shè)置成與進(jìn)度條前進(jìn)相反的方向，也可以讓人們誤以為速度提升了。
還有設(shè)計(jì)者發(fā)現(xiàn)，相比較呈現(xiàn)出不確定性的進(jìn)度條（下圖左），人們更喜歡有明確起點(diǎn)和終點(diǎn)的（下圖右）。
進(jìn)度條的出現(xiàn)源于人類(lèi)對(duì)于不確定性的難以忍受，和對(duì)掌控感的追求。
但在現(xiàn)實(shí)中，有很多事情我們無(wú)法預(yù)知未來(lái)走向，比如戀愛(ài)、壽命等，沒(méi)有那么方便的實(shí)時(shí)進(jìn)度條，告訴你這些事情進(jìn)展到了百分之多少。
面對(duì)不確定性，有人選擇試著在人生里制造出自己專(zhuān)屬的進(jìn)度條：定下詳細(xì)目標(biāo)、樹(shù)立里程碑、時(shí)時(shí)注意當(dāng)下進(jìn)度。
還有人則選擇擁抱全然的未知，鼓起勇氣，忍著不適，邁入迷霧籠罩的黑暗荒野。
無(wú)論你選擇哪條路，都祝你好運(yù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/
本文來(lái)自微信公眾號(hào)：果殼 （ID：Guokr42），作者：黑將軍，編輯：Emeria、游識(shí)猷、odette
廣告聲明：文內(nèi)含有的對(duì)外跳轉(zhuǎn)鏈接（包括不限于超鏈接、二維碼、口令等形式），用于傳遞更多信息，節(jié)省甄選時(shí)間，結(jié)果僅供參考，IT之家所有文章均包含本聲明。