LoginSignup
40
29

More than 5 years have passed since last update.

Lottieによるリッチアニメーション実装におけるAfterEffectsハマりどころ

Posted at

 はじめに

iOSにAfter Effectsで作ったリッチアニメーションを導入できるLottieライブラリすごい!とおもったのですが,AfterEffectsのすべての機能を使えるわけではありませんでした
アニメーションをデザイナーさんにお願いする前に,エンジニア側も何ができて何ができないのか知っておくと作ってもらったのに動かないという事故が発生しづらいのではないかと考え知見を共有いたします

この文章全体で言いたいこと

Lottieのドキュメントは要確認,意図通りの動きができてるか逐次チェック
webだったら動くけどAndroidやiOSだとうごかないものもあります
AfterEffects対応機能一覧表
http://airbnb.io/lottie/supported-features.html

LotteiとAfterEffectsの紹介

リッチアニメーションのコピー.001.jpeg
リッチアニメーションのコピー.002.jpeg
リッチアニメーションのコピー.003.jpeg
リッチアニメーションのコピー.004.jpeg
リッチアニメーションのコピー.005.jpeg

After Effectsの目玉機能エフェクトが使えない

リッチアニメーションのコピー.007.jpeg
リッチアニメーションのコピー.008.jpeg
リッチアニメーションのコピー.009.jpeg

エフェクト以外の機能でできないこと

リッチアニメーションのコピー.010.jpeg
リッチアニメーションのコピー.011.jpeg

リッチアニメーションのコピー.012.jpeg
リッチアニメーションのコピー.013.jpeg
リッチアニメーションのコピー.014.jpeg
リッチアニメーションのコピー.015.jpeg
リッチアニメーションのコピー.016.jpeg
リッチアニメーションのコピー.017.jpeg
リッチアニメーションのコピー.018.jpeg

確認の仕方

リッチアニメーションのコピー.019.jpeg
リッチアニメーションのコピー.020.jpeg
リッチアニメーションのコピー.021.jpeg
リッチアニメーションのコピー.022.jpeg

40
29
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
40
29