この記事の目標「After Effects」と「Lottie」というアニメーションライブラリを利用してWebアニメーションを制作してみたいと思います。 試しに作ってみたものがこちらです。 このように「After Effects」で制作したアニメーションをWeb上に表示させるまでを今回の記事の目標にします。 流れとしては以下のようになります。 「After Effects」でアニメーションを制作。「Bodymovin」を使いJSON形式で書き出す。「Lottie」を使って実装する。 BodymovinをインストールまずはAfter Effectsのプラグインである「Bodymovin」をインストールします。 Adobeからダウンロードできます。 のはずが上手くいかなかったので以下の方法でダウンロードしました。 LottieのGitHubからダウンロードします。 赤枠のボタンをクリックするとツ
![【svgアニメーション】After Effectsで制作したアニメーションをWebで使う方法(Lottie) | PRAWN COCKTAIL(プロウンカクテル)](https://cdn-ak-scissors.b.st-hatena.com/image/square/4e7fbd079ab22e6156b059ffce279c8462c7a023/height=288;version=1;width=512/https%3A%2F%2Fprawn-cocktail.com%2Fwp-content%2Fuploads%2F2019%2F02%2Flottie_eyecatch.jpg)