前一陣子，接到一個(gè)app切圖制作加載圓形進(jìn)度條的任務(wù)，看到那個(gè)小進(jìn)度條轉(zhuǎn)啊轉(zhuǎn)的，我若有所思…同時(shí)，一個(gè)做印象派制作間控件設(shè)計(jì)的同學(xué)最近做了 改版，那個(gè)控件登陸需要一些時(shí)間，看到他對loading加載條進(jìn)行了優(yōu)化，然后就一起交流了一下。作為一個(gè)剛畢業(yè)入行不久的新人，請?jiān)试S我分享一下關(guān)于 討論loading加載后的一些心得…

這是一個(gè)浮躁的年代，長聽到這樣的抱怨“好慢！”“等到死！”，每次看到那個(gè)轉(zhuǎn)啊轉(zhuǎn)的圈圈，或者是那個(gè)“loading…”后面那三個(gè)點(diǎn)不停滴閃動(dòng)，心里總是有莫名的焦躁，彼時(shí)的心情就好像下面這張圖片一樣，不知您是否有同感…

有人統(tǒng)計(jì)，用戶能夠忍受的最長等待時(shí)間大約在 6～8秒之間。8秒是一個(gè)臨界值，如果網(wǎng)頁加載時(shí)間在8秒以上，很有可能大部分訪問者最終都會離開該頁面。除非他一定要打開那個(gè)頁面。

以上三種是常見的loading方式，如果是我，我更希望看到第三種的進(jìn)度條，因?yàn)槲覍?shí)在不知道第一個(gè)圈圈要轉(zhuǎn)多久才能算加載成功，也不知道第二個(gè)點(diǎn)點(diǎn)點(diǎn)要點(diǎn)到猴年馬月。

但是如果這個(gè)時(shí)候，界面除了看到“加載”以外的東西，是否就能轉(zhuǎn)移用戶的注意力呢？比如我們在銀行排隊(duì)的時(shí)候，如果我們無時(shí)不刻看著自己手中的號碼 牌和叫號板，雖然知道自己大概什么時(shí)候會輪到，但是依舊會無聊和煩躁。這時(shí)候銀行里的一些宣傳單起到了很好的作用：比如各種銀行的理財(cái)產(chǎn)品，如果你不小心 還看到了適合自己投資的，肯定會激動(dòng)不已，覺得這個(gè)等待時(shí)間給自己帶來的意外的收獲，即使沒有得到自己想要的信息，也不會覺得那么無聊了。又比如視頻在緩 沖的過程中，總是會放一段廣告，我一直弱弱滴認(rèn)為這個(gè)好雞肋，舍不得放棄看那個(gè)視頻，但又要忍耐這個(gè)加載時(shí)候的廣告。但是如果廣告做得很棒，就一點(diǎn)都不煩 躁了，甚至還在評論里看到求加載廣告的地址。網(wǎng)頁的loading就承擔(dān)了宣傳單跟加載廣告的作用。

在頁面局部加載時(shí)常能看到第一個(gè)圈圈的身影，不過每次看到這個(gè)圈圈都差不多，如果換一種轉(zhuǎn)圈的形式，也許會覺得“這個(gè)圈圈跟別的好像不太一樣”，通過好奇減少等待的焦躁。

下面我找了一些變過形的圈圈，是不是多了一些新意呢？

減少用戶的焦慮，可以給個(gè)允諾，示意他們還要加載多久，告訴現(xiàn)在的進(jìn)度（有個(gè)進(jìn)程百分比），算給一個(gè)定心丸。例如以下的方式：

其中上圖最下面一種進(jìn)度條又有不同的設(shè)計(jì)：

上面兩種確定性進(jìn)度條雖然都提示了現(xiàn)在的進(jìn)程，但它們的差別是，第一種的進(jìn)度條內(nèi)容是純色，第二種進(jìn)度條內(nèi)容有動(dòng)畫效果，如果這個(gè)進(jìn)度條再某點(diǎn)上突 然停住了，這時(shí)候會給用戶造成困擾，到底是卡死了還是這段的加載比較慢呢？如果是下一種進(jìn)度條就一目了然，如果卡死，那動(dòng)畫效果就沒了，如果依然有動(dòng)畫效 果，那就說明只是這一段加載比較緩慢。

如果進(jìn)度條再進(jìn)行一些變形，不僅告訴了用戶現(xiàn)在的加載進(jìn)程，還別有一種欣賞的意味：

PS：上右是搜狗實(shí)驗(yàn)室的logo，但是這個(gè)創(chuàng)意做成loading也很棒啊，還加強(qiáng)了品牌印象。

標(biāo)簽： 交互體驗(yàn) 網(wǎng)站假貨 網(wǎng)站加載 

版權(quán)申明：本站文章部分自網(wǎng)絡(luò)，如有侵權(quán)，請聯(lián)系：west999com@outlook.com
特別注意：本站所有轉(zhuǎn)載文章言論不代表本站觀點(diǎn)！
本站所提供的圖片等素材，版權(quán)歸原作者所有，如需使用，請與原作者聯(lián)系。