抄訳:プロダクトデザインにおける動きのデザイン

bryanmanio.com

内容がかなり具体的 & 実践的で自分の普段のアプローチと近かったので紹介。細かいニュアンスはリンク先を確認して欲しい(簡潔なので英語不得意でも読みやすい)

  1. まず ease out を使ってみる
  2. 素早い動き( 300ms くらい)
  3. 対象のサイズで速度を調整
  4. 消える時はより早く
  5. 自作アニメーションカーブを作ろう
  6. クイック、デフォルト、ロングの 3パターンでほとんどは対応可能
  7. spring アニメーションは物理っぽくなるので活用しよう
  8. モーションライブラリを使ってみる
  9. 動きは Figma ではなく ProtopieOrigami, Play などを使おう
  10. やりすぎない
  11. opacity と transform が重要