国外亚洲成av人片在线观看,热99re久久精品这里都是精品,天堂网在线最新版www,国产成人av区一区二区三,51久久成人国产精品麻豆

編輯導(dǎo)語(yǔ)：用戶在使用網(wǎng)頁(yè)或APP的過程中，大多會(huì)遇到加載場(chǎng)景。而在這些場(chǎng)景下，產(chǎn)品該如何設(shè)計(jì)，才能讓用戶減少焦慮呢？以及在不同的加載場(chǎng)景下，應(yīng)該適配什么樣的加載呈現(xiàn)方式呢？本篇文章里，作者就對(duì)加載設(shè)計(jì)做了系統(tǒng)總結(jié)，一起來看一下。

加載對(duì)用戶來說是一種反饋，是用戶觸發(fā)、系統(tǒng)反應(yīng)的過程。在一個(gè)產(chǎn)品中可能會(huì)涉及到多種形式的加載場(chǎng)景，例如進(jìn)場(chǎng)加載、頁(yè)面間的轉(zhuǎn)場(chǎng)加載以及局部功能的加載等。

面對(duì)這么多的加載場(chǎng)景，如果都用同一種加載方式顯然不太合適，所以需要針對(duì)不同加載場(chǎng)景做到“對(duì)癥下藥”，最大程度提升體驗(yàn)。

例如常見的加載組件有進(jìn)度條和數(shù)字百分比，那到底什么場(chǎng)景下適合用進(jìn)度條加載，什么場(chǎng)景下適合用數(shù)字百分比加載，你有沒有考慮過呢？

一、三種加載狀態(tài)

頁(yè)面加載進(jìn)程會(huì)受多方面的影響，例如頁(yè)面里圖片、圖標(biāo)的數(shù)量，頁(yè)面中是否有三維場(chǎng)景或模型，是列表式設(shè)計(jì)還是卡片式設(shè)計(jì)……

1. 逐一加載

對(duì)于可以同時(shí)進(jìn)行多個(gè)加載任務(wù)的產(chǎn)品，更適合應(yīng)用逐一加載的形式，這樣做能減少用戶對(duì)于等待的感知程度。任務(wù)列表逐一加載的過程會(huì)給用戶帶來一種秩序感。

2. 完全加載

進(jìn)入一個(gè)網(wǎng)站或App，很多頁(yè)面都會(huì)一下就顯示出來所有內(nèi)容，這種頁(yè)面完全加載的形式對(duì)用戶來說更熟悉。

同樣，頁(yè)面完全加載的形式會(huì)讓用戶的操作和瀏覽過程更流暢。

3. 延遲加載

延遲加載是用戶主動(dòng)觸發(fā)的操作，根據(jù)操作系統(tǒng)反饋對(duì)應(yīng)的結(jié)果。延遲加載包括三種形式。

1）無限滾動(dòng)

當(dāng)檢測(cè)到用戶快要到達(dá)列表或頁(yè)面的末尾的時(shí)候，通過無限滾動(dòng)來作為觸發(fā)器，引導(dǎo)用戶獲取更多內(nèi)容。

2）加載更多

通過點(diǎn)擊“加載更多”按鈕來獲取更多內(nèi)容，這個(gè)過程由用戶主導(dǎo)決定，是否選擇點(diǎn)擊。

3）分頁(yè)加載

分頁(yè)是在不同頁(yè)面上進(jìn)行的延遲加載。這個(gè)過程也是由用戶主動(dòng)選擇，但和“加載更多”按鈕不同的地方在于，分頁(yè)是頁(yè)面間的切換，并且用戶能清楚地看到具體的頁(yè)面數(shù)量。

二、五種加載模式

加載模式需要依托場(chǎng)景去考慮。比如一個(gè)1秒就能加載的頁(yè)面和一個(gè)需要5秒才能加載出來的頁(yè)面，我們就需要考慮使用不同的加載模式設(shè)計(jì)，這樣才能做到差異化設(shè)計(jì)。

這里我做了一個(gè)表格，將頁(yè)面加載需要的時(shí)間以及對(duì)應(yīng)的加載模式進(jìn)行了整合。

1. 0.1秒以內(nèi)

如果加載時(shí)長(zhǎng)低于0.1秒，用戶不需要等待加載過程，內(nèi)容就能即時(shí)呈現(xiàn)出來，有一種“還沒開始就已經(jīng)結(jié)束”的感覺。

0.1秒以內(nèi)的加載不需要在頁(yè)面中添加任何加載狀態(tài)，但要一個(gè)場(chǎng)景需要格外注意，如果用戶剛完成一系列復(fù)雜的操作，點(diǎn)擊提交之后，考慮為用戶提供撤消機(jī)制。

▲用谷歌郵箱發(fā)送郵件時(shí)，發(fā)送成功之后會(huì)彈出一個(gè)撤銷提示，允許用戶在5s內(nèi)撤銷剛才發(fā)送成功的郵件。

2. 0.1-1秒間

大多數(shù)產(chǎn)品的頁(yè)面加載速度都在這個(gè)區(qū)間，用戶幾乎不會(huì)注意到這種加載延遲。所以我們不需要增加額外的加載動(dòng)效來填充這段加載時(shí)間，不然可能會(huì)起到畫蛇添足的反面效果。

試想一下，如果在每個(gè)頁(yè)面加載的過程中都加上加載動(dòng)效，不僅會(huì)分散用戶的注意力，并且屏幕上總出現(xiàn)不斷跳動(dòng)的內(nèi)容，會(huì)讓人感到很焦躁。

3. 1-2秒間

如果加載時(shí)間超過1秒，用戶就會(huì)感知到這個(gè)加載過程，這個(gè)時(shí)候我們就可以考慮適當(dāng)添加加載動(dòng)畫，緩解用戶等待的焦急感。

微加載：1-2秒的加載時(shí)間對(duì)用戶來說，說長(zhǎng)不長(zhǎng)說短也不短，優(yōu)先推薦輕量級(jí)的動(dòng)畫加載形式，為用戶提供一種進(jìn)度感。

▲在下載內(nèi)容的過程中，使用這種輕量級(jí)的環(huán)形動(dòng)畫來顯示加載進(jìn)度，簡(jiǎn)潔清晰，而且還能作為組件來復(fù)用，能夠極大提升工作效率。

骨架屏：用于整頁(yè)加載，這種加載形式在產(chǎn)品中的應(yīng)用也越來越頻繁。骨架屏可以讓用戶在等待加載的過程中，先了解頁(yè)面的架構(gòu)。

在骨架屏基礎(chǔ)上，可以“選裝”一些好看的效果，增加頁(yè)面加載時(shí)的視覺體驗(yàn)觀感：

微光效果：在骨架屏基礎(chǔ)上添加微光效果，光感的加入能將用戶的注意力從等待中轉(zhuǎn)移開，有效地減少等待感知。

脈沖效果：效果和微光效果很像，差異的地方在于脈沖效果用于單個(gè)的任務(wù)或卡片列表。

4. 2-10秒

這個(gè)加載時(shí)間對(duì)于用戶來說已經(jīng)很長(zhǎng)了，對(duì)于設(shè)計(jì)師來說，需要對(duì)這段加載時(shí)間進(jìn)行合理有效地設(shè)計(jì)，來提升用戶體驗(yàn)。

時(shí)間提示：在開發(fā)中很難以分和秒為單位來精確地估計(jì)加載時(shí)間。

如果在加載的過程中，想給用戶一個(gè)期望的時(shí)間值，告訴用戶整個(gè)加載過程需要多長(zhǎng)時(shí)間，我們可以用“這可能需要幾秒鐘”這種提示方法，既能展示加載需要的時(shí)間，又能給用戶一個(gè)時(shí)間預(yù)期。

進(jìn)度條：最常使用的加載形式，加載過程中使用緩入動(dòng)畫會(huì)讓整個(gè)過程看起來更像在加速。

分步提示：如果加載過程過長(zhǎng)，可以將整個(gè)過程分為幾個(gè)不同的步驟，幫助用戶預(yù)估操作完成需要的時(shí)間。如果系統(tǒng)正在處理多個(gè)項(xiàng)目，分步提示的設(shè)計(jì)能讓用戶明確了解已完成的操作。

5. 10秒以上

百分比加載：使用百分比加載雖然不能告訴用戶加載完成需要多長(zhǎng)時(shí)間，但是能提供一種過程感，讓用戶自己來估計(jì)加載時(shí)間。圓形進(jìn)度條+百分比是最常見的加載形式。

需要注意的是，不要在加載到99%的時(shí)候讓進(jìn)度條卡住不動(dòng)，這樣會(huì)讓用戶感到焦急。

后臺(tái)加載：如果一項(xiàng)任務(wù)需要加載很長(zhǎng)時(shí)間，我們不能讓用戶看著進(jìn)度條干等，其他什么都做不了，這種情況我們可以考慮將任務(wù)放到后臺(tái)去加載。

在Google Drive中上傳較大的文件時(shí)，系統(tǒng)會(huì)立即給出反饋，將任務(wù)窗口縮放到屏幕的右下角，我們可以通過這個(gè)小窗口檢查上傳進(jìn)度和上傳情況，而且還不耽誤使用頁(yè)面上的其他功能。

三、最后

把加載細(xì)分成這五種模式，可以覆蓋很多使用場(chǎng)景，這樣的對(duì)癥下藥既能保證用戶體驗(yàn)，還能讓產(chǎn)品豐富化，起到錦上添花的作用。

在對(duì)的時(shí)間和對(duì)的場(chǎng)景下做對(duì)的事，這句話用在什么地方都不為過，設(shè)計(jì)也是一樣。

#專欄作家#

作者：Clippp，微信公眾號(hào)：Clip設(shè)計(jì)夾。每周精選設(shè)計(jì)文章，專注分享關(guān)于產(chǎn)品、交互、UI視覺上的設(shè)計(jì)思考。

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)作者許可，禁止轉(zhuǎn)載。

題圖來自Unsplash，基于CC0協(xié)議。