觸屏版
全國(guó)服務(wù)熱線:0571-87205688
登錄
注冊(cè)
客戶中心
關(guān)注云客
無論你的用戶界面設(shè)計(jì)得如何精美,在某些時(shí)候,用戶不得不耐心等待加載。漫長(zhǎng)的加載過程可能會(huì)損害整體的操作體驗(yàn),甚至因此而“移情別戀”。作為設(shè)計(jì)師,我們雖然不能真的縮短加載時(shí)間,但幸運(yùn)的是,我們可以采取一些措施,“欺騙”用戶的時(shí)間感受,讓他們感覺加載過程其實(shí)很快很流暢。
1.永遠(yuǎn)不要讓用戶在沒有得到反饋的情況下等待用戶的等待時(shí)間是從發(fā)起動(dòng)作時(shí)開始,如果用戶的連接速度較慢,網(wǎng)站可能需要一段時(shí)間來加載內(nèi)容。這其中最糟糕的情況是:用戶沒有收到任何指示表明“站點(diǎn)已經(jīng)收到指令了“。當(dāng)站點(diǎn)沒有通知用戶需要一些時(shí)間來完成加載時(shí),用戶通常認(rèn)為它沒有收到請(qǐng)求,并且再次嘗試。缺乏反饋,造成了大量的工作浪費(fèi)。為了避免用戶感到困惑或煩躁,我們需要用視覺化的反饋表明“有事情正在發(fā)生,請(qǐng)等待”。
2.避免靜態(tài)的進(jìn)度提示靜態(tài)進(jìn)度指示是指不會(huì)變化的圖像或文本指示,如“正在加載...”或“請(qǐng)稍等...”。雖然任何反饋都比沒有好,但靜態(tài)的提示也并不能算是好的體驗(yàn)。靜止的提示并沒有讓用戶體會(huì)到“正在進(jìn)行”,反而他們會(huì)不確定這個(gè)操作進(jìn)程是不是“卡殼”了。
3.使用加載動(dòng)畫心理學(xué)研究表明,在等待1秒鐘后沒有得到反饋,用戶的注意力就開始轉(zhuǎn)移了。為了減少用戶注意力得流失,在超過1秒鐘的加載過程中,使用加載動(dòng)畫可以延長(zhǎng)用戶注意力集中的時(shí)間。(注意:加載動(dòng)畫并不適用于不到1秒鐘的加載過程,因?yàn)橛脩艨赡軙?huì)對(duì)剛才在屏幕上一閃而過的內(nèi)容感到困惑)。
①循環(huán)齒輪,適用于合理快速的加載操作循環(huán)齒輪只提示用戶需要等待,但不能表明應(yīng)該等待多久,常規(guī)等待時(shí)間為2-10秒的較為快速的操作。循環(huán)齒輪通常與下拉刷新手勢(shì)一起使用。它可以作為界面兩個(gè)狀態(tài)之間的中介,幫助用戶了解屏幕在變更時(shí)發(fā)生了什么。
?、诎俜直葎?dòng)畫,適用于長(zhǎng)時(shí)間加載過程如果我們知道事情什么時(shí)候會(huì)發(fā)生,那么等待過程就更容易被接受。這就是為什么在需要長(zhǎng)時(shí)間加載時(shí),你需要給用戶一個(gè)具體的等待時(shí)間。一般來說,百分比動(dòng)畫用于需要10秒或更長(zhǎng)時(shí)間的加載過程。
或者,你可以提供一個(gè)估計(jì)的操作時(shí)間,甚至不需要太確切,一個(gè)簡(jiǎn)單的“這可能需要一分鐘”就足以通知到用戶并鼓勵(lì)他們耐心等待。
四,調(diào)整用戶對(duì)時(shí)間的看法
衡量加載速度有多快其實(shí)取決于用戶的內(nèi)心感覺。當(dāng)你嘗試創(chuàng)建更快更流暢的用戶體驗(yàn)時(shí),可以通過縮短感知時(shí)間,而不是實(shí)際時(shí)間。為了做到這一點(diǎn),我們可以采用用戶可操作的內(nèi)容、動(dòng)畫或動(dòng)作來“填充”等待時(shí)間。
?、龠M(jìn)度條進(jìn)度條可以讓用戶預(yù)判處理速度,并且這種預(yù)判會(huì)被進(jìn)度條移動(dòng)的方式所影響。在這里介紹以下幾點(diǎn)簡(jiǎn)單的技巧來讓用戶感覺更快:①進(jìn)度條不能停止,否則用戶會(huì)認(rèn)為操作中斷了。最糟糕的情況是進(jìn)度條接近99%的時(shí)候突然停止,這會(huì)讓大多數(shù)用戶感到抓狂。 ②通過“立即移動(dòng)”來偽裝進(jìn)度條中的小延遲。③一開始緩緩前進(jìn),逐漸加快進(jìn)度,給用戶一種“很快就會(huì)完成”的感覺。
②預(yù)加載頁面等待的過程是預(yù)加載頁面(也稱為臨時(shí)信息容器)一展身手的主場(chǎng)。預(yù)加載頁面本質(zhì)上是逐漸加載信息的頁面的空白版本。它可以替代傳統(tǒng)加載動(dòng)畫的作用。預(yù)加載頁面不是一個(gè)簡(jiǎn)單的視覺裝飾,而是創(chuàng)造了用戶對(duì)新頁面的預(yù)期,使用戶關(guān)注進(jìn)度而不是等待時(shí)間。因?yàn)轭A(yù)加載頁面是由簡(jiǎn)單形狀組成的小圖像,所以可以快速的完成加載。FacebookAPP的加載頁面,灰色的色塊代表圖片,粗線代表文字,組合起來便向用戶展示了正在加載的的頁面的組成,完成加載后,真正的圖像和文字就會(huì)出現(xiàn)在色塊代表的位置。事實(shí)上,如果拿預(yù)加載頁面和“循環(huán)齒輪”相比,加載速度并沒有加快,但是在用戶心中,預(yù)加載頁面是更快速的。
?、酆笈_(tái)操作將加載工作隱藏到后臺(tái)操作。一個(gè)很好的例子就是在Instagram上上傳圖片,一旦用戶選擇了要共享的圖片,圖片就開始在后臺(tái)上傳,這個(gè)時(shí)候,Instagram會(huì)邀請(qǐng)用戶為上傳的圖片添加標(biāo)題和標(biāo)簽。當(dāng)用戶填完后準(zhǔn)備按下“分享”按鈕時(shí),上傳已經(jīng)完成,用戶可以立即分享出他們的照片。
④漸進(jìn)式圖像加載當(dāng)越來越多的圖像被用于APP和網(wǎng)站,圖像的加載速度會(huì)直接影響到用戶體驗(yàn)。使用模糊效果,可以創(chuàng)建出漸進(jìn)式的圖像加載效果。一個(gè)很好的例子是Medium。加載圖片時(shí)會(huì)先加載一個(gè)較模糊的小縮略圖,當(dāng)圖片加載完成后,再轉(zhuǎn)換到大圖像。與模糊效果相結(jié)合的縮略圖非常小,通常只有幾kb,與純色相比不會(huì)占用太多的有效載荷,是更好的占位符。
?、莘稚⒁曈X通過有創(chuàng)意、有表現(xiàn)力的畫面來分散用戶的注意力,讓等待的過程更愉快,可以讓他們忽略長(zhǎng)時(shí)間的加載。
詳解APP設(shè)計(jì)中的微妙細(xì)節(jié)
分享那些Web設(shè)計(jì)大神們常用的響應(yīng)式框架
新網(wǎng)站運(yùn)營(yíng)須注意的事項(xiàng)有哪些?
傳統(tǒng)建網(wǎng)站已過時(shí) 自主建官網(wǎng)才是趨勢(shì)
學(xué)會(huì)向?qū)κ謱W(xué)習(xí)可取得公司網(wǎng)站建設(shè)與運(yùn)營(yíng)捷徑
網(wǎng)站推廣如何有效果 SEO和SEM那個(gè)更好呢
新網(wǎng)站的SEO基礎(chǔ)應(yīng)該怎么做
營(yíng)銷型網(wǎng)站為什么要做SEO優(yōu)化
網(wǎng)站如何做好關(guān)鍵詞布局 這些常識(shí)要懂
移動(dòng)互聯(lián)網(wǎng)時(shí)代營(yíng)銷 SEO也該與時(shí)俱進(jìn)做“智能內(nèi)容”
評(píng)論(0人參與,0條評(píng)論)
發(fā)布評(píng)論
最新評(píng)論