動(dòng)效相關(guān)問(wèn)題
一、動(dòng)效的作用?
總結(jié)下來(lái)就是：友好、有趣、反饋、過(guò)渡、引導(dǎo)
在可用性良好的前提下，通過(guò)細(xì)節(jié)設(shè)計(jì)和交互方式創(chuàng)新為產(chǎn)品增加亮點(diǎn)，可以帶來(lái)更驚喜的體驗(yàn)和表達(dá)產(chǎn)品的氣質(zhì)與態(tài)度。
較少用戶(hù)在操作等待過(guò)程中的焦慮。
通過(guò)動(dòng)效的方式來(lái)進(jìn)行現(xiàn)實(shí)世界的模擬并且不需要任何提示，迎合用戶(hù)的意識(shí)認(rèn)知。使產(chǎn)品的交互方式更接近真實(shí)世界。增強(qiáng)了用戶(hù)對(duì)應(yīng)用的操縱感和帶入感。
引導(dǎo)作用就是通過(guò)動(dòng)效能夠幫助用戶(hù)使用功能，對(duì)功能的方向、位置、喚出操作、路徑等進(jìn)行暗示和指導(dǎo)，方便用戶(hù)在最短的時(shí)間內(nèi)來(lái)學(xué)會(huì)操作APP里的一些功能。
我們可以通過(guò)動(dòng)效的設(shè)計(jì)，來(lái)告訴用戶(hù)當(dāng)前APP正在處在那種狀態(tài)，可以通過(guò)平移、放大、縮小刪除等等動(dòng)效的方式來(lái)給用戶(hù)做及時(shí)的反饋。
讓過(guò)度盡量的流暢，使得界面與界面之間、界面上元素的出現(xiàn)和消失都盡量的流暢，通過(guò)大小、位置和透明度的變化，使用戶(hù)和產(chǎn)品的交互過(guò)程更流暢。
二、動(dòng)效的實(shí)現(xiàn)工具?
常見(jiàn)的動(dòng)效制作工具：PS 、AE、 principle
其他一些動(dòng)效制作工具： Flinto、 keynote、Hype 3、Origami
三、動(dòng)效做完后怎么和前端配合實(shí)現(xiàn)?
配合模式取決于動(dòng)效形式的不同，配合的方式也有所區(qū)別。
1. 啥也不提供，溝通就行，提供動(dòng)效展示效果
例如一個(gè)圓球的縮放動(dòng)畫(huà)，或者一個(gè)正方形的旋轉(zhuǎn)動(dòng)畫(huà)，設(shè)計(jì)師只需要把自己的思路告訴前端即可，如果他實(shí)在不明白也可以提供一個(gè)用于預(yù)覽的動(dòng)效展示。
2. 只需提供一張png素材圖，溝通，并提供動(dòng)效展示效果
類(lèi)似下圖的“加載中”效果
3. 提供GIF格式
做好的動(dòng)效導(dǎo)出gif格式提供給前端直接使用。
4. 提供PNG序列
做好的動(dòng)效導(dǎo)出png序列圖片(一幀一張圖)，給前端，讓其安裝一定的速度進(jìn)行依次播放。
5. 提供SVGA格式
常見(jiàn)于直播類(lèi)產(chǎn)品刷禮物動(dòng)效效果制作。制作工具SVGA-AEConverter-master
6. 提供JSON文件格式
Lottie 是Airbnb開(kāi)源的一個(gè)面向 iOS、Android、React Native 的動(dòng)畫(huà)庫(kù)，能分析 Adobe After Effects 導(dǎo)出的動(dòng)畫(huà)。 制作工具Bodymovin。
使用教程https://www.zcool.com.cn/article/ZOTE3ODM2.html
更多關(guān)于“UI培訓(xùn)”的問(wèn)題，歡迎咨詢(xún)千鋒教育在線名師。千鋒教育多年辦學(xué)，課程大綱緊跟企業(yè)需求，更科學(xué)更嚴(yán)謹(jǐn)，每年培養(yǎng)泛IT人才近2萬(wàn)人。不論你是零基礎(chǔ)還是想提升，都可以找到適合的班型，千鋒教育隨時(shí)歡迎你來(lái)試聽(tīng)。
京公網(wǎng)安備 11010802030320號(hào)