移動(dòng)應(yīng)用里的轉(zhuǎn)場(chǎng)動(dòng)畫如何操作？

2018-08-07 7218

分享至：

動(dòng)畫是用戶體驗(yàn)的重要組成部分。當(dāng)涉及到移動(dòng)應(yīng)用的轉(zhuǎn)場(chǎng)時(shí)，你可以通過細(xì)致的動(dòng)畫傳遞豐富的信息。發(fā)送信息、打開設(shè)置、點(diǎn)擊復(fù)選框、導(dǎo)航去其他頁面-這些都是變化的時(shí)刻，對(duì)轉(zhuǎn)場(chǎng)進(jìn)行動(dòng)畫設(shè)計(jì)是一種強(qiáng)化用戶行為的絕佳方式。

一、在任務(wù)流程中連接不同的步驟

有時(shí)用戶需要一系列的步驟來完成操作，而這些步驟需要清晰的標(biāo)明他們是緊密相連的，動(dòng)畫能夠幫助你連接不同的步驟創(chuàng)造一個(gè)完整的體驗(yàn)。

下面是一個(gè)如何利用動(dòng)畫來創(chuàng)造連續(xù)線性事件的優(yōu)秀案例：

Image: Jakub Antalík

動(dòng)畫可以幫助設(shè)計(jì)師創(chuàng)造漸進(jìn)式展現(xiàn)，漸進(jìn)式展現(xiàn)通過減少同一時(shí)間內(nèi)信息量的展現(xiàn)，使界面更加簡(jiǎn)單易學(xué)。

這里有兩個(gè)很好的例子，說明使用漸進(jìn)式展現(xiàn)提供有意義的信息塊。

Image: Anton Skvortsov

在這篇文章中，我們將講述當(dāng)功能性的動(dòng)畫補(bǔ)充視覺設(shè)計(jì)和支持交互時(shí)的常見情況。

二、提供系統(tǒng)的狀態(tài)

當(dāng)用戶觸發(fā)了某些操作時(shí)，他們期望得到一個(gè)視覺反饋，系統(tǒng)需要清晰地表明它已經(jīng)接收到這個(gè)操作請(qǐng)求同時(shí)正在運(yùn)行中。

這里有一些有益于用戶體驗(yàn)的動(dòng)畫反饋案例：

1. 確認(rèn)用戶操作

用戶得到系統(tǒng)對(duì)于該操作的確認(rèn)，當(dāng)用戶可以得到有效的視覺反饋，這就可以防止用戶重新點(diǎn)擊操作元素。

Notify users of the results of their actions. Image: Colin Garven

2. 使用下拉刷新對(duì)于頁面的內(nèi)容進(jìn)行更新

加載提示的視覺反饋幫助用戶理解系統(tǒng)正在對(duì)于用戶的請(qǐng)求做處理。

Subtle animation helps users understand what is going on. Image: Ramotion

3. 等待內(nèi)容加載

加載并不一定很枯燥，幾乎所有的移動(dòng)應(yīng)用都可以在頁面加載時(shí)，利用微妙的動(dòng)畫來防止用戶離開。加載動(dòng)畫可以持續(xù)占據(jù)用戶的視覺反饋，結(jié)果就是用戶感覺等待的時(shí)間更短。

Animation can keep the user engaged even before the app fully loads. Image: UI8

信息來源尚品中國(guó):http://m.5e3.com.cn/,專業(yè)網(wǎng)站制作,專業(yè)網(wǎng)站設(shè)計(jì),專業(yè)網(wǎng)站建設(shè)公司

來源聲明：

本文章系尚品中國(guó)編輯原創(chuàng)或采編整理，如需轉(zhuǎn)載請(qǐng)注明來自尚品中國(guó)。以上內(nèi)容部分(包含圖片、文字)來源于網(wǎng)絡(luò)，如有侵權(quán)，請(qǐng)及時(shí)與本站聯(lián)系（010-60259772）。