范愷祐 / Kyo Fan
Open NCCU 非營利組織創辦人、 GDSC NCCU '22-'23 Lead (社群領袖)
Sessions
08-04
14:30
30min
在 React.js 中打造原生級 Sheets 體驗，by Google IDX, Framer-motion & Redux
范愷祐 / Kyo Fan, 張淮竣 Huai-Chun Chang
為了在自家的 PWA 追求與原生 App 類似的體驗，我們拆解 FramerMotion 的運作原理，實現連 Framer Motion 都做不到的響應式 & 多向拖曳 Bottom Sheet (Apple HIG 稱為 non-modal sheet)，讓 PWA 的 Sheet 也能有類原生App 體驗。
本次分享中將學到：
- 為什麼一定要用 sheet？有什麼必要性？
- Framer Motion 的運作原理
- 開發小技巧！ DevMode 展示
- 視覺和介面設計上的理解
- 逐步拆解：到底怎麼做到？
- Google Project IDX 實例展示
- 解釋參數和他們的意義
- 上手體驗！
透過工程師的邏輯+ UI 設計師的經驗，終於攻克這個不可能的任務！
Student Education Track (SED)
TR214