概述

本單元介紹的是 Smart Animate 功能，可以配置出各類有趣的動態視覺效果 (Motion UI Design )，類似動畫軟體的移動補間概念，且可切換多種觸發規則，或調整轉場速度等，來幫助我們做出許多種類的動態變化。本單元共規劃了五個實作場景，透過實作過程練習，習得未來可組合的相關技巧，並製作出各類動態配置介面。

重點學習技巧

• 技巧一：認識 Smart Animate

• 技巧二：了解 Smart Animate 的種類

• 技巧三：認識 Smart Animate 的觸發情境

• 技巧四：認識 Smart Animate 頁面變化情境

• 技巧五：設定 Smart Animate 動態移動方向

實作一：動態轉場物件（基礎元件轉場練習）

實作二：動態按鈕（點擊後產生動態）

實作三：動態導覽選單（點選後產生微動態）

實作四：動態進度條（點選後模擬 Loading 動畫）