iT邦幫忙

0

JS Conf Animation with concept 心得

JS Conf Youtube錄影

Animation purpose

  • making context clear (突顯內容)
  • displaying hierarchies (顯現重點為誰)
  • making usage intuitive (讓使用更直觀)
  • artificial shortening of waiting time (製造等待時間較短的假象)

Movement Should Be

  • Natural (自然)
  • Predictable (可預測)
  • Comprehensive (廣泛??)

Animation

  • Has to be restraint(不濫用)
  • Tell a Story (必須有目的性)
  • Single Movement (單一動畫執行,多個物件同時動畫,焦點被分散)
  • Pick a Hero & Who's the sidekick(主角為誰)

Principle Benefit 規範的優點

  • more structure (更結構化、目的性強烈)
  • usability test (同樣的動畫有統一的規範)
  • user centered (以使用者角度作為出發點)
  • more interdisciplinary exchange (跨學科?)

Developer's Pitfall 開發陷阱

  • Performance (效能問題)
  • Critical Rendering Path 瀏覽器渲染流程(重繪重排問題)
  • GSAP 進階 Animation 框架 (使用框架優化)

參考資料

Summer桑莫 Critical Rendering Path


尚未有邦友留言

立即登入留言