AI
apple-design Skill：把 Apple 的流暢互動、動態排版與可中斷動畫變成 AI 設計規則
Emil Kowalski 的 apple-design Skill 將 Apple WWDC 的 fluid interface、spring、速度傳遞、動量投影、rubber-banding、材質層次、字體與 reduced motion 原則翻譯成 Web 實作規則；搭配 open-slide 可改善簡報圖片佈局，但它提供的是設計判斷框架，不是 Apple 官方模板。
2026年9月10日2 分鐘閱讀👁 5
Design Skill · Fluid Interface · Presentation
這個 Skill 的價值不是把畫面做成「Apple 風」，而是讓 AI 理解何時該即時回饋、如何移交速度、怎麼讓動作隨時可被打斷
Threads 作者把 Apple 秋季發表會資料交給 Claude，再以 open-slide＋apple-design skill 產生簡報，特別肯定單張大圖、多圖與滿版背景的自動排版。查核 skill 原文後，其核心其實是 Apple fluid interface 的完整工程化規則。
來源定位：
apple-design 來自 emilkowalski/skills（MIT），內容主要整理 Apple WWDC 設計演講並翻譯到 Web/CSS/Pointer Events/requestAnimationFrame/Motion。它是第三方技能，不是 Apple 官方 Skill 或 Keynote 模板。最重要的設計原則
| 原則 | 實作含義 |
|---|---|
| Response | pointer-down 就回饋，不要等 click；拖曳期間 1:1 跟手。 |
| Interruptibility | 動畫隨時可抓住、反向；從畫面目前值開始，不從目標值跳回。 |
| Velocity handoff | 手勢結束時把手指速度傳給 spring，避免拖曳與動畫之間出現斷點。 |
| Momentum projection | 以速度預測落點，再選最近 snap point，不只看放手位置。 |
| Spatial consistency | 進出走同一路徑，popover／sheet 從觸發來源長出來。 |
| Accessibility | 支援 reduced motion、reduced transparency、more contrast；不是單純關掉所有回饋。 |
Skill 內可直接用的參數與公式
- 大多數 UI：critically damped，
damping 1.0、response 0.3–0.4。 - 只有 flick／throw 等帶動量手勢才加入輕微 bounce，例如
damping ~0.8。 - 動量投影：
current + (velocity/1000) × d/(1-d)，常見d≈0.998。