動態(tài)效果意味著充滿生命和興奮，為靜態(tài)事物增添生命。然而，在軟件方面，動態(tài)效果不僅是為了獲得樂趣，也是為了解決問題。

作為人類，我們習慣于看到世界在我們周圍移動。如果任何軟件有連貫的動畫，它都會感到活潑和自然。所以，如果你想開始學習動態(tài)設計，最好從這9個步驟開始。

1.開始觀察

培養(yǎng)活力。如果你看不到東西在移動，你就不能使用它們。當你使用你最喜歡的應用程序時，開始觀察屏幕上東西的移動。再看一遍，找出你為什么喜歡它，然后嘗試找到細節(jié)。觀察所有變化-形狀、大小、位置和顏色。無論是小是大，都要努力找出運動在整個合成中的作用。

2.動效不僅僅是一層涂料

動態(tài)效果揭示了更深層次的含義。作為一個創(chuàng)造者，你必須從一開始就有意識地考慮動態(tài)效果。如果您正處于設計階段，請動畫原型以增加時間維度。如果您正處于開發(fā)階段，請將代碼分為模塊化組件，以便輕松處理UI中移動內容。

認真思考創(chuàng)作的動畫個性會給它一個角色，幫助你對嘗試構建的作品有更深的了解。

3.思考在哪里引入產品的運動？

當用戶與元素互動或用戶必須等待時，可以將運動引入產品的一些簡單位置。

4.MotionUX的類型

您可以將產品中的運動分類為“過渡”(內容更改/用戶移動到另一個屏幕)，“微交互”（例如Twitter的“贊”按鈕)、圖形動畫(例如，踏板車在Zomato的“訂購”應用程序的啟動屏幕上跳轉)。

5.通過動效提供空間信息

如果UI如果元素從屏幕右側輸入，用戶將在心理上組織元素在右側。例如，如果在屏幕左上角放置菜單按鈕，菜單必須從左側進行動畫處理。檢查您的動畫是否正確地傳達信息，請向人們展示并聽他們說什么。這是避免任何可能混淆的最簡單的方法。

6.開始理解持續(xù)時間、時序曲線、動畫路徑、初始和最終值等

從技術上講，這些參數(shù)構成了動畫片段。和他們一起玩，掌握這些控件。一旦控制了這些，就能產生出色的動態(tài)效果。

7.永遠不要讓人過程中間等待

不要放慢過程中間的節(jié)奏，讓他們等待動畫完成。如果他們真的必須等待，那就用有意義的動畫讓他們快樂。永遠記住用動態(tài)效果來解決問題，這就是動畫加載程序存在的原因。

讓動畫保持微妙，與產品的故事情節(jié)保持一致，從而創(chuàng)造愉悅的體驗。

8.使用工具

Lottie，AdobeAnimateCC，AfterEffects，Sketch2AE，F(xiàn)ramer，Origami，AnimaticApp，figma一些用于動效設計的工具。找到它們。figma相關技巧可以參考：https://js.design/special/figma/

我建議先用筆和紙開始你的想法。完成此操作后，繼續(xù)使用任何數(shù)字軟件。對于本文中的動畫，我在這里AnimaticApp手繪幀被繪制在上面。動畫有助于使事物簡單而集中。

9.捕獲并保存你發(fā)現(xiàn)的有趣的東西

保存你發(fā)現(xiàn)的有趣的東西。一遍又一遍地看著它們，放慢它們，了解元素是如何運動的。通過復制學習。Mac充滿樂趣GIF動畫。你也可以GIF保存在盤球上。