給人以界面鮮活的感覺，使體驗更加流暢
彌補靜態(tài)頁面表達力的不足
在內(nèi)容優(yōu)先設(shè)計的趨勢下，用戶界面變得更加簡潔。這會給用戶帶來操作上的盲目感；動態(tài)效果可以在不破壞界面美觀的情況下彌補認知上的損失
原則上
設(shè)計是為了解決問題。作為設(shè)計手段之一，動態(tài)設(shè)計可以解決一些靜態(tài)界面設(shè)計無法解決的問題。然而，它不是靈丹妙藥。必須限制運動效果。太多、太慢或不合適的運動效果只會讓界面失去焦點，讓團隊和用戶抱怨。
對于實際項目中應(yīng)用的動效，只有對需求進行精準對齊，動效才能帶來真正應(yīng)有的價值。那么，你如何評估一部動畫是否有價值呢？
1. 需要運動嗎？
2. 運動效果是否提升了體驗？
3. 動效開發(fā)的成本是不是太高了？
如果一切順利，給工程師一個飛吻。
運動工具
Adobe 之后
視頻效果軟件，常用的動效和MG制作軟件，功能強大，與其他Adobe軟件無縫對接，可做的效果無限。
+
蘋果的可視化編程軟件可以很好的模擬機器效果。可用于單頁動畫，也可直接導(dǎo)出可執(zhí)行代碼。
炒作 3
Demo，雖然是HTML5的制作工具，但也算是動畫效果的【好貓】。
其他包括原型制作工具、、Form等，也可以用于動畫。您可以根據(jù)具體工作選擇合適的，目前還沒有一站式解決方案軟件。
數(shù)字動畫
只講制作動效，不講實現(xiàn)是流氓，動效設(shè)計師也需要對動效進行注解。
常見值包括：
屬性：移動距離旋轉(zhuǎn)角度
時間：運動持續(xù)時間延遲出現(xiàn)時間重復(fù)時間
曲線：插值曲線
iOS：運動曲線
自定義曲線
△ 動態(tài)標(biāo)注模板，包括常用動作、曲線、表格。格式，速度快，向量性質(zhì)也很適合動態(tài)標(biāo)注
動態(tài)標(biāo)注技巧
有些動作需要分解成多個值標(biāo)簽。比如里面的“重力運動”
設(shè)計者的思路是圓弧運動，但實現(xiàn)時沒有運動軌跡的發(fā)展方法。
那么如何表達這個軌跡呢？
兩種方法
時間錯位
△ 延遲單個值的時間（真實運動曲線被綠色虛線略微夸大）
不同的曲線
△ 兩個值的持續(xù)時間相同，但應(yīng)用的曲線不同
曲線/插值器
剛才提到的曲線是什么？
在系統(tǒng)中，調(diào)用系統(tǒng)內(nèi)置的曲線插值器來改變動畫的播放速率，可以實現(xiàn)大部分的動態(tài)速率效果。
△ 圖為插值器
自定義曲線
當(dāng)插值器的默認率不能完全滿足要求時，需要進行數(shù)值調(diào)整。
通過調(diào)整該值，您可以快速更改速率：
當(dāng)然，你也可以嘗試使用自定義的 de-curve 將曲線轉(zhuǎn)換成二次貝塞爾曲線，直接用于開發(fā)。
如下圖，是三次方- (.82, .25, .29, .78)
△ 和 iOS 都支持二次和三次貝塞爾曲線。
交互和運動
運動和交互密切相關(guān)，這也需要在視覺之前考慮運動。
如上圖所示，內(nèi)容優(yōu)先設(shè)計中常用的共享元素樣式，需要從交互層面對動態(tài)效果進行一定的規(guī)劃，否則動態(tài)效果會過于牽強，或者會遇到視覺返工。
動畫和運動
運動與動畫不同，動畫通常發(fā)生在過場動畫或動作之后，并且往往執(zhí)行得更快。動畫中看似恰到好處的運動時間，直接應(yīng)用到動態(tài)效果上會顯得拖沓，效率低下。顯然，將動畫中的時間簡單粗暴地套用在動畫上是不合適的。
中，對動畫時間有更詳細的定義，推薦各種設(shè)備的動畫時間。在實際應(yīng)用中，需要考慮元素變化的范圍并給出合適的時間。
雖然運動效果已經(jīng)支持 60fps 的速度，但在實際應(yīng)用中，有時運動不夠流暢*確實存在，甚至為了達到想要的效果，打標(biāo)時間也必須與之前有很大的不同。這時候可能需要修改部分標(biāo)注的時間，但我一般遵循一個原則：盡量保持時間的比例adobe 動效設(shè)計軟件，在模擬中傾向于相信時間。機器個體差異引起的問題很難量化。當(dāng)然，解決這類問題需要工程師和設(shè)計師的通力合作。
項目中的運動
正如工業(yè)設(shè)計師需要了解材料，平面設(shè)計師需要了解印刷知識一樣，動態(tài)設(shè)計也需要設(shè)計師具有“跨專業(yè)”的視野。
在iOS及以上系統(tǒng)上adobe 動效設(shè)計軟件，系統(tǒng)其實已經(jīng)為你做了很多工作。許多常見和經(jīng)常使用的運動效果可能已經(jīng)具有制作精良的“輪子”。這些“輪子”往往經(jīng)過多次驗證。效果和性能 過去有人說，一些小的改動就可以滿足項目的要求。
實現(xiàn)此類動畫時：
除非您確信實現(xiàn)比現(xiàn)有的更好，否則最好直接使用它。
利用現(xiàn)有的“輪子”來控制常見的基本運動效果，減少整個團隊的重復(fù)工作，提高效率，設(shè)計師和工程師也可以將精力投入到讓項目更加精彩的領(lǐng)域。
相關(guān)熱詞：