動態設計教室

一次，只講清楚一件事

動畫哪裡怪、哪裡廉價，常常只差一個參數。每一課只教一個技巧：同一個畫面做兩個版本，把差別一格一格拆給你看，最後附上可以直接用的寫法。

動態設計教室 #01

緩動曲線：同樣 0.3 秒，差別在停下來的那一下

同一個側欄、同一段距離、同樣 0.3 秒，只改緩動曲線，觀感就完全不同。用逐格位置、曲線圖和 A/B 對照，講清楚 ease-out、ease-in 與「詰め」，附 CSS 寫法。

閱讀這一課 → 約 4 分鐘

動態設計教室 #02

動畫時長：API 很快，App 卻很慢？

同一條緩動曲線，只改秒數：0.60 秒讓使用者總共等 0.94 秒，0.25 秒只要 0.59 秒。用實測案例講清楚動畫時長、距離和常用起點（按鈕、選單、面板、整頁），附 CSS 寫法。

閱讀這一課 → 約 4 分鐘