無論PC端還是移動端，產品要想提供細膩順滑的體驗，很大程度依靠動效設計將不同界面或同界面的不同狀態銜接起來，讓用戶直觀地感知操作結果的可控性。這就需要交互設計師保證自己在動效方面具有足夠的專業性。

近年來，除了「萬能的」AE外，還有大量專門為UX行業打造的輕量級原型工具，讓動效工具和原型設計工具之間的界限變得模糊。那麼，哪些原型設計工具適合交互設計師使用呢?

階段1：產品級交互設計階段

輸出物：可交互的流程原型

推薦工具：Flinto

雖然Flinto和Principle同為UX行業專屬的原型/動效設計軟件，而且都比AE更輕量，更聚焦在行業高頻功能上，同時能快速輸出MOV、GIF，以及在移動端上進行實際的交互體驗。但實現邏輯上卻有比較大的不同：

Flinto：每個Artboard是一個界面，在元素上定義可以疊加的事件，在事件內定義不同State的切換。

Principle：每個Artboard只是一個界面的一個具體State，直接在畫板上定義不同State的切換中元素的變化。

Principle擅長單個頁面(或很短的流程)的交互細節表達，但在處理多界面流程時會讓工作區域變得亂七八糟，甚至幾個時候後，連自己都看不懂自己在做什麼。

與Principle相比，Flinto的優勢在於產品及複雜流程的表達，所以對於流程串聯而言，Flinto無疑是比其他原型設計工具要快。

階段2：界面級交互設計階段

輸出物：動效錄屏/GIF

推薦工具：Principle

對不涉及位置聯動的交互動效而言，Flinto和Principle的製作成本相差無幾，但是涉及位置聯動的動效，Principle就比Flinto的表現優秀很多。Principle中，時間軸和位置聯動的設置比Flinto自由度更高，可以快速進行精細的頁面設計和調整。

階段3：視覺設計階段

輸出物：動效標註或其他形式的交付文件

推薦工具：Principle/AE

大多數的常規動效其實利用Principle都可以實現，但如果有Principle做不出來的交互動效，這時候就需要AE實現。例如：涉及路徑的動畫，這是Principle的軟肋，也就需要AE出馬。

而播放類動效一般肩負著創意和情感化的需要，多數情況下都需要用AE來製作，完成後，可以產出PNG序列，或通過Lottie產出json文件，然後直接交付開發。

說了那麼多，如果對上述三種工具還是不太認識的話，下面小編將為大家再區別一下：

Flinto：能極速串起複雜流程的神器，但精細度較高的交互動效製作難度較大，可以輸出可交互Demo。

Principle：可方便地實現複雜、精細的時間軸、聯動設置，但不適合製作整個產品的流程，同樣可以輸出可交互Demo。

AE：萬能工具，在路徑型動效、包含複雜創意的播放型動效上具有不可替代性，與Lottie的協同讓設計交付和開發實現都變得輕鬆愉快。但並非行業工具，處理簡單動效上效率不高，無法同時作為可交互Demo使用。

最後，提醒各位：動效不是炫技，很多交互設計師都會使用花俏的動效，雖然初看覺得這個網站設計很驚艷，但是實際上對網站的用戶體驗一點好處都沒用。所以交互設計師在設計動效時，盡量簡單輕快，這樣既能讓設計師和開發人員輕鬆，用戶在瀏覽網頁過程也很輕鬆。