淺談移動(dòng)應用快體驗設計方法總結發(fā)布者：本站     時(shí)間：2021-12-23 10:12:41

產(chǎn)品的“快體驗”是指從用戶(hù)使用產(chǎn)品某項功能過(guò)程中自然流暢的過(guò)程。在產(chǎn)品使用流程中體現在多個(gè)層面，如下載快、加載快、反饋快等。當任何一個(gè)環(huán)節出現了卡頓、停滯，讓用戶(hù)進(jìn)入漫長(cháng)的等待時(shí)，都會(huì )帶給用戶(hù)焦急、煩躁的感受，以至于終止當前的操作，或直接棄用產(chǎn)品。因此，“快”是良好的產(chǎn)品體驗核心因素之一。

淺談移動(dòng)應用快體驗<a href=/design/ target=_blank class=infotextkey>設計</a>方法總結,PS教程,

“快體驗”有多重因素組成，包括外部環(huán)境的網(wǎng)絡(luò )速度，產(chǎn)品本身的技術(shù)能力，交互策略制定，快體驗的感知設計等。我們分解用戶(hù)一個(gè)事件的操作過(guò)程(發(fā)出操作指令前、執行過(guò)程、結果呈現)，并針對每個(gè)環(huán)節總結的幾個(gè)方法。

網(wǎng)易有篇分享也是講這個(gè)的，同學(xué)們可以看看：用設計為你的APP提速的6個(gè)方法

提升APP品質(zhì)，推薦閱讀百度云UE負責人撰寫(xiě)的：豐富APP動(dòng)態(tài)效果的六點(diǎn)原則

一、發(fā)出操作指令前提前加載數據

提前加載數據是在預測用戶(hù)即將發(fā)出操作指令前，后臺預先緩存到本地數據內容，待用戶(hù)操作時(shí)，內容直接呈現。在正常的網(wǎng)絡(luò )狀態(tài)和用戶(hù)操作頻率前提下，用戶(hù)幾乎不用任何等待內容加載的時(shí)間。該策略適用于縱向瀏覽的信息流，比喻微博、朋友圈、應用市場(chǎng)的應用列表等。根據所加載內容數據量的大小，可決定是否僅在在wifi網(wǎng)絡(luò )環(huán)境下執行該策略，同時(shí)只對文本數據做提前加載。

淺談移動(dòng)應用快體驗設計方法總結,PS教程,

新版的百度手機助手在應用列表的瀏覽操作時(shí)，就運用了該策略。當用戶(hù)前天瀏覽內容不足10條時(shí)，后臺自動(dòng)加載更多。該策略極大的提高了用戶(hù)的瀏覽效率。

二、執行過(guò)程中，根據操作類(lèi)型的不同有多種方法

1、預載默認框架

預載默認框架是用戶(hù)發(fā)出操作指令后，在數據尚未返回之前，頁(yè)面反饋一個(gè)默認數據的頁(yè)面布局。等到內容返回后，填充到已顯示的默認框架內。該設計能在用戶(hù)操作指令發(fā)出后，給與很快速的頁(yè)面反饋，同時(shí)為用制造一個(gè)“快速”的假象。

一起來(lái)分析百度手機助手詳情頁(yè)的加載設計。當用戶(hù)點(diǎn)擊某個(gè)應用進(jìn)入詳情頁(yè)后，直接展現該頁(yè)面的首屏的全部默認布局，當數據加載完畢時(shí)填充到默認框架，給用戶(hù)感受到只是內容顯示的轉場(chǎng)動(dòng)畫(huà)，避免了視覺(jué)轉場(chǎng)，提高了“快”的感知。

淺談移動(dòng)應用快體驗設計方法總結,PS教程,

2、保持積極響應

移動(dòng)應用操作場(chǎng)景中，不可避免的會(huì )出現網(wǎng)絡(luò )狀態(tài)不佳的情況，此時(shí)就需要用戶(hù)耐心的等待。在等待過(guò)程中，首先需要呈現活動(dòng)的載入狀態(tài)，以告訴用戶(hù)依然在努力加載，同時(shí)，積極活躍的動(dòng)畫(huà)也會(huì )加強用戶(hù)對快速的感知，掩蓋總體緩慢的現實(shí)。

在應用市場(chǎng)的下載管理中，就運用了該設計，當下載某個(gè)應用遇到網(wǎng)絡(luò )很慢時(shí)，總進(jìn)度進(jìn)展緩慢甚至停止，但循環(huán)游動(dòng)的光標依然保持積極的響應，給用戶(hù)感知后臺依然在進(jìn)行高速的下載工作。

淺談移動(dòng)應用快體驗設計方法總結,PS教程,

3、結果提前呈現

用戶(hù)發(fā)出指令后，用戶(hù)界面上迅速反饋操作結果，而實(shí)際數據由后臺處理。如瀏覽器產(chǎn)品常用的頁(yè)面載入進(jìn)度反饋。通常用戶(hù)打開(kāi)新頁(yè)面后，頁(yè)面加載進(jìn)度條先是迅速的游走到某個(gè)預定的位置，給與用戶(hù)頁(yè)面加載迅速的感受。而實(shí)際進(jìn)度卻在追趕頁(yè)面進(jìn)度條。

再比如，微信的朋友圈中，當用戶(hù)上傳一張新的圖片，點(diǎn)擊發(fā)布后，該圖片通過(guò)動(dòng)畫(huà)從發(fā)布器跳轉到瀏覽的信息流中。在用戶(hù)看來(lái)，已經(jīng)發(fā)布成功，而后臺依然在上傳過(guò)程中。

淺談移動(dòng)應用快體驗設計方法總結,PS教程,

4、轉移焦慮情緒

相信大家在使用應用中最反感的就是漫長(cháng)的等待，他會(huì )讓你心情變壞，會(huì )影響你的情緒。此時(shí)需要讓用戶(hù)關(guān)注的焦點(diǎn)從等待轉移到一個(gè)趣味的畫(huà)面或一句簡(jiǎn)短的文案中，從而縮短用戶(hù)的心理等待時(shí)間，使等待沒(méi)有那么漫長(cháng)。

百度云和百度手機助手在頁(yè)面加載時(shí)，都引入該設計方法。一只可愛(ài)的“小黃鳥(niǎo)”，一個(gè)正在跑步的“百變袋”都會(huì )讓用戶(hù)在等待的情緒中剝離出來(lái)，轉移注意啦，為用戶(hù)等待的的耐性爭取了時(shí)間?！跋肴ァ笨蛻?hù)端在加載更多的等待設計,“被鯨魚(yú)追趕的小魚(yú)”更是出彩，讓我不得不希望網(wǎng)速慢下來(lái)，多欣賞一會(huì )這個(gè)設計。

淺談移動(dòng)應用快體驗設計方法總結,PS教程,

三、結果呈現給予正向鼓勵

以上都是針對操作執行過(guò)程狀態(tài)的設計方法，我們不能把所有的設計都傾注在過(guò)程中，還要懂得在操作結果呈現時(shí)進(jìn)一步與用戶(hù)做情感交流，把快的體驗感知貫穿于始末。一個(gè)鼓勵的文案，一個(gè)趣味的動(dòng)效，都會(huì )給用戶(hù)帶來(lái)驚喜，都會(huì )提高用戶(hù)對“快”的體驗感知，加強產(chǎn)品“快”的記憶點(diǎn)。

百度手機助手當用戶(hù)通過(guò)高速下載渠道下載應用時(shí)，下載完成后會(huì )告知用戶(hù)節約了多少時(shí)間，增強了用戶(hù)對高速下載的感知。當用戶(hù)下載速度達到一定的數值時(shí)，下載完成后，界面會(huì )飛出飛機來(lái)肯定用戶(hù)剛才的下載速度，增強用戶(hù)對“快”的記憶點(diǎn)。

淺談移動(dòng)應用快體驗設計方法總結,PS教程,

結語(yǔ)：移動(dòng)產(chǎn)品的快體驗，從用戶(hù)發(fā)出操作指令，到執行過(guò)程，最后到操作結果的呈現，每個(gè)環(huán)節都是提高快體驗的機會(huì )，抓住每個(gè)機會(huì )，把快速的體驗設計帶到你的產(chǎn)品中，讓用戶(hù)與你一起爽一把。