隨著技術(shù)的快速發(fā)展，動效不再是視覺上的華美，更多的用戶所要求的期望功能。動效解決了很多功能問題和接口，可以真正與用戶互動。下面與創(chuàng)新互聯(lián)編者《APP界面設(shè)計中使用動效的注意事項(xiàng)》，提高界面接口的功能增加情感的力量。

1.系統(tǒng)狀態(tài)在你的程序在后臺總發(fā)生一些過程，如正在從服務(wù)器下載數(shù)據(jù)，進(jìn)行計算。這總是需要一些時間的。你需要讓用戶知道這個程序沒有凍結(jié)，顯示正在處理的狀態(tài)。視覺交互給用戶一種控制程序的感覺。 加載完成度加載時間對大多數(shù)產(chǎn)品是不可避免的。而動效雖然不能解決這個問題，但會減少一點(diǎn)問題。當(dāng)我們不能縮短時，當(dāng)然可以使等待變得更愉快。有創(chuàng)意的過程動效可以減少用戶感知的時間。動效影響用戶感知你的產(chǎn)品，使它看起來比實(shí)際上更好。

如果一個應(yīng)用在加載時為用戶提供了一些有趣的事情，這會使得用戶更少關(guān)注等待本身。圖片來源：Ramotion

下拉刷新

這組很流行的動效是“下拉刷新”，它發(fā)起一個移動設(shè)備上的內(nèi)容更新的過程。

圖片來源：Zee Young提示：刷新動效應(yīng)該與設(shè)計整體匹配——如果應(yīng)用很小，動效也應(yīng)該是。

通知因?yàn)檫\(yùn)動會吸引注意力，動效是一個令人愉快的方式可以與沒有太多經(jīng)驗(yàn)的用戶進(jìn)行交互。移動的對象立即抓住了用戶的注意力。

2.導(dǎo)航和轉(zhuǎn)換

最基本的動效是轉(zhuǎn)換。這種類型的動效背后的邏輯是幫助用戶理解發(fā)生在頁面上的布局的變化，改變了什么以及以后如何再次改變。一個典型的例子是一個漢堡包按鈕，進(jìn)行切換隱藏內(nèi)容。

動效設(shè)計可以有效地引導(dǎo)用戶愉快的接受通知。圖片來源：Gal Shir盡管漢堡包動效可能在這里是最推薦的，還是有很多其他方式的動畫導(dǎo)航。

導(dǎo)航之間的轉(zhuǎn)換設(shè)計師使用動效在導(dǎo)航之間切換用戶上下文，解釋屏幕上的元素的變化。

不同狀態(tài)之間的轉(zhuǎn)換應(yīng)該充當(dāng)中介的UI,幫助用戶理解屏幕上的變化是發(fā)生了什么。圖片來源：Ehsan Rahimi

視覺元素之間的層次結(jié)構(gòu)和聯(lián)系動效可以好的描述對象，并說明它們?nèi)绾芜M(jìn)行交互的。

動效說明了元素是如何交互的。圖片來源：Vitaly Rubtsov

功能變化在某些情況下，設(shè)計師們不得不設(shè)計一個在一定條件下變化但操作按鈕。我們經(jīng)常在空間受限的手機(jī)設(shè)計中看到。

“開始”和“停止”按鈕可能是最常見的多態(tài)按鈕的例子。圖片來源：KREATIVA Studio這種類型的動畫顯示了當(dāng)用戶進(jìn)行交互時元素是怎樣改變的。在下面的示例中，當(dāng)用戶按浮動操作按鈕，加號變成了一支鉛筆。這表示鉛筆是主要的功能。這個小的細(xì)節(jié)意味著接下來發(fā)生不同的情況，知道圖標(biāo)意味著這兩種狀態(tài)。按鈕改變從一個“+”到“鉛筆”表明按鈕的功能發(fā)生了變化。

3.視覺反饋

任何用戶界面的視覺反饋都是至關(guān)重要的。它可以讓用戶有控制感，讓用戶感覺理解在給定的時間的當(dāng)前上下文的系統(tǒng)。 反饋確認(rèn)APP界面設(shè)計的元素如按鈕和控件應(yīng)該有的，即使他們是在另一個圖層后面。在物質(zhì)世界中，按鈕、控件和其他與我們進(jìn)行交互的對象。人們都會在交互中期望類似水平的用戶界面控件的響應(yīng)能力。為了彌合這一差距，視覺和運(yùn)動軌跡需要即時輸入，動畫的外觀和方式直接進(jìn)行操作。

可視化的行為的結(jié)果動效可以提高每一個交互并且是加強(qiáng)用戶預(yù)成型的操作。在下面的例子中，當(dāng)用戶點(diǎn)擊“支付”，一個轉(zhuǎn)輪短暫出現(xiàn)在應(yīng)用中表示成功的狀態(tài)。動效讓用戶覺得他們可以很容易支付而且用戶會很喜歡這樣的細(xì)節(jié)。

視覺反應(yīng)可以增加用戶的參與度并取悅用戶。圖片來源：Michal Villar

工具和教程下面的教程可以幫助您把動效融入你的Android或者iOS項(xiàng)目中：用Adobe After Effects制作動效。用圖形和動效指南幫助你為應(yīng)用程序添加一個動效到你的Android程序，使用iOS自定義的動畫項(xiàng)目

總結(jié)

動效在使用時是一種強(qiáng)大的復(fù)雜的方式。它為設(shè)計增加了生命，即使在最簡單的交互吸引用戶，讓你的作品脫穎而出。精心設(shè)計的動效增強(qiáng)用戶體驗(yàn)。

文章標(biāo)題：APP界面設(shè)計中使用動效的注意事項(xiàng)
網(wǎng)頁URL：http://jinyejixie.com/news29/167179.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供微信小程序、企業(yè)建站、網(wǎng)站內(nèi)鏈、全網(wǎng)營銷推廣、關(guān)鍵詞優(yōu)化、建站公司

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)