效果拆解：兩個獨立動畫系統同步運行
- 系統 A：文字「LOADING」漸現 — 遮罩層路徑動畫 + 陀螺旋抖動。
- 系統 B：杯中墨水傾倒 — 多邊形墨水 + 遮罩組合 + 陀螺旋旋轉 + 虛擬旋轉中心修正。
系統 A：文字漸現 (非線性、非水平、有機感)
圖層結構 (底→頂)
- 紅色無框「LOADING」文字 (底層，完整顯示)。
- 白色無填滿「LOADING」文字 (中層，輪廓同紅字，內部透明)。
- 黑色圓角矩形遮罩 (頂層，顏色=背景色，傾斜角度匹配杯口)。
原理：遮罩上移露出紅字，白字輪廓始終可見形成邊框感，傾斜遮罩模擬液面傾斜。
動畫序列 (遮罩層)
- 路徑 1：短距離上移，速度快，平滑開始/結束 = 0。
- 路徑 2：較短距離，速度慢 (時間較長)，產生變速感。
- 路徑 3：續接上移至完全露出。
- 陀螺旋：角度 6° 逆時針，勾選「自動翻轉」，重複直到文字完全顯現。
關鍵：三路徑用「延遲」串聯 (非「在上一個動畫之後」)，因陀螺旋需橫跨三路徑總時長。
系統 B：杯子傾倒 + 墨水液面恆水平
結構組合
- 杯子本體 (群組)。
- 墨水：自由多邊形繪製四邊形，頂邊水平 (按 Shift 鍵繪製)，角度與杯底平行，稍大於杯口確保旋轉時覆蓋。
- 三面遮罩：黑色四邊形 (色=背景) 蓋住杯子左/右/底三側，與杯子群組 (`Ctrl+G`)。
- 圖層序：遮罩群組 (最上) > 墨水 (中) > 杯子本體 (底) — 關鍵！
原理：杯子旋轉時，三面遮罩隨之轉動，墨水因被遮罩裁切，視覺上液面始終水平、體積遞減。
旋轉中心修正 — 核心難點
PPT 陀螺旋旋轉中心固定為物件幾何中心，但傾倒旋轉中心應在杯口下方。解法：
- 繪製一無填滿/無輪廓矩形，與杯子群組組合 (`Ctrl+G`)。
- 調整矩形大小/位置，使組合後整體幾何中心 落在目標旋轉中心 (杯口下方)。
- 對此組合物件施加「陀螺旋」動畫 (30° 逆時針)。
輔助線條動畫
- 傾倒開始瞬間：細線「抹除」進入 (0.1 秒) 模擬流出軌跡。
- 墨水倒盡瞬間：同線條「淡出」消失。
學習資源
文末提供素材包與成品下載，建議下載拆解圖層結構、動畫窗格時序、頂點編輯細節，舉一反三製作「進度條填充」「儀表盤轉動」「沙漏流沙」等物理模擬動畫。