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

 はじめに

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


『 Swift 』Article List