如何讓UI交互動(dòng)畫更有吸引力

　　APP交互動(dòng)畫的應(yīng)用形式
 

　　交互動(dòng)畫作為APP界面設(shè)計(jì)中重要的視覺元素，使得APP頁(yè)面的展示方式更加豐富、產(chǎn)品更具活力、吸引力更足。交互動(dòng)畫在APP界面設(shè)計(jì)中應(yīng)用非常普遍，今天AAA教育郭老師通過(guò)歸納總結(jié)出以下幾種：

 

　　1.歡迎動(dòng)畫
 

　　歡迎動(dòng)畫出現(xiàn)在APP開啟時(shí)，以公司宣傳動(dòng)畫或者動(dòng)態(tài)標(biāo)志演繹為主。歡迎動(dòng)畫能強(qiáng)調(diào)品牌、傳遞情感。流暢、合理的動(dòng)畫能增加產(chǎn)品的識(shí)別性，也可以樹立品牌形象，還能給用戶到來(lái)輕松愉悅的體驗(yàn)。

 

　　當(dāng)用戶打開APP時(shí)，獨(dú)特的APP動(dòng)畫效果可成為APP的標(biāo)志，將品牌形象印在用戶腦海中。歡迎動(dòng)畫時(shí)間不宜過(guò)長(zhǎng)，長(zhǎng)時(shí)間的歡迎動(dòng)畫會(huì)讓用戶等待時(shí)間過(guò)久，從而降低用戶對(duì)APP的使用興趣。

 

　　2.跳轉(zhuǎn)動(dòng)畫
 

　　跳轉(zhuǎn)動(dòng)畫常出現(xiàn)在頁(yè)面之間。為了避免兩個(gè)頁(yè)面之間的跳轉(zhuǎn)過(guò)于生硬，利用動(dòng)畫填補(bǔ)上了頁(yè)面跳轉(zhuǎn)的中間過(guò)程，讓用戶更好地理解頁(yè)面跳轉(zhuǎn)，知道自己身在何方，從而使得體驗(yàn)更加流暢和自然。

 

　　3.加載動(dòng)畫
 

　　APP產(chǎn)品因?yàn)榫W(wǎng)絡(luò)不流暢等原因，頁(yè)面不能及時(shí)顯示，加載動(dòng)畫能減少用戶在等待過(guò)程中的焦慮感。最初的加載動(dòng)畫為形式單一的沙漏動(dòng)畫，隨著技術(shù)的提升和審美習(xí)慣的變化，加載動(dòng)畫表現(xiàn)形式更加豐富。

 

　　4.反饋動(dòng)畫
 

　　動(dòng)畫作為界面設(shè)計(jì)的肢體語(yǔ)言，能增強(qiáng)用戶的操作感。界面設(shè)計(jì)中的動(dòng)畫一般都具有一定的交互性，能與用戶產(chǎn)生互動(dòng)。當(dāng)用戶出現(xiàn)誤操作時(shí)，用動(dòng)畫反饋替代圖形文字的靜態(tài)提示更加友好、自然。軟件的反饋對(duì)于體驗(yàn)的提高來(lái)講至關(guān)重要。通過(guò)對(duì)用戶交互行為的及時(shí)反應(yīng)，來(lái)讓用戶感到安心，使體驗(yàn)過(guò)程更加輕松和愉悅。

 

　　APP交互動(dòng)畫設(shè)計(jì)原則
 

　　1.動(dòng)畫風(fēng)格統(tǒng)一
 

　　移動(dòng)設(shè)備物理形式和界面顯示區(qū)域較小，APP界面設(shè)計(jì)中動(dòng)畫設(shè)計(jì)力求簡(jiǎn)單清晰、風(fēng)格統(tǒng)一。風(fēng)格雜亂，會(huì)使界面混亂不堪，讓用戶眼花繚亂，不知所措。要做到動(dòng)畫風(fēng)格統(tǒng)一，可以從動(dòng)畫的構(gòu)成元素風(fēng)格上進(jìn)行控制以及把握好動(dòng)畫表現(xiàn)形式。切忌不同風(fēng)格構(gòu)成元素在混亂的節(jié)奏中以動(dòng)畫形式呈現(xiàn)。

 

　　2.謹(jǐn)慎增加動(dòng)畫
 

　　界面設(shè)計(jì)中動(dòng)畫效果不是越多越好。增加動(dòng)畫需謹(jǐn)慎，在對(duì)APP整體效果進(jìn)行把控下，并且以用戶體驗(yàn)為中心進(jìn)行設(shè)計(jì)。太多的動(dòng)畫會(huì)讓用戶眼花繚亂，分散用戶注意力。

 

　　界面設(shè)計(jì)時(shí)，應(yīng)該學(xué)會(huì)動(dòng)靜結(jié)合。在需要凝聚用戶注意力的地方添加動(dòng)畫效果。不要為了使界面更加絢麗，而刻意增添動(dòng)畫。像轉(zhuǎn)場(chǎng)這種界面之間轉(zhuǎn)換的效果，不要太花哨。

 

　　3.簡(jiǎn)化界面信息
 

　　目前不少APP通過(guò)絢麗視覺效果來(lái)吸引用戶，這類APP界面設(shè)計(jì)中帶有很多復(fù)雜的視覺元素，如何處理好每個(gè)視覺元素之間的關(guān)系，有效傳達(dá)信息。這就需要進(jìn)行動(dòng)畫設(shè)計(jì)。動(dòng)畫能簡(jiǎn)化界面信息和交互層級(jí)，從而降低軟件操作難度，讓操作更合理，提升用戶體驗(yàn)。

 

　　4.把握動(dòng)畫節(jié)奏
 

　　單調(diào)生硬的動(dòng)畫已經(jīng)無(wú)法滿足人們的需求，動(dòng)畫必須具有表現(xiàn)力。APP動(dòng)畫設(shè)計(jì)需要以用戶為中心，讓動(dòng)畫符合人的視覺經(jīng)驗(yàn)，把握動(dòng)畫的節(jié)奏，以運(yùn)動(dòng)規(guī)律為指導(dǎo)進(jìn)行設(shè)計(jì)。

 

　　動(dòng)畫設(shè)計(jì)多以自然界中物象運(yùn)動(dòng)為參照，接近真實(shí)的模仿自然界中物體的運(yùn)動(dòng)規(guī)律，結(jié)合物理力學(xué)，強(qiáng)調(diào)慣性、彈性、曲線運(yùn)動(dòng)，將動(dòng)作進(jìn)行適度夸張，做出視覺感受順暢的動(dòng)畫設(shè)計(jì)。因此，您現(xiàn)在已經(jīng)了解了與UI設(shè)計(jì)師的工作相關(guān)的主要技能。如果您想了解更多信息，請(qǐng)?jiān)L問(wèn)AAA教育，包含有關(guān)在該領(lǐng)域工作的更多相關(guān)文章。