Lottie.jsの紹介

Lottie.jsとは

Lottieは民泊で有名なAirbnbが開発したアニメーションライブラリ。
Adobe After Effectsで作ったアニメーションを簡単に制御することができる。

JavasScriptの他にもKotlinやSwiftでネイティアプリ向けのライブラリを提供している。

---

例

See the Pen Untitled by Nobuo (@nobuo1106) on CodePen.

---

メリット

・ファイル形式がJSONなのでSVGに比べて軽い。アイコンであれば10kb以下。
・アニメーションが滑らか。

See the Pen Untitled by Nobuo (@nobuo1106) on CodePen.

---

・動きを制御できる。

See the Pen heart lottie by Nobuo (@nobuo1106) on CodePen.

---

実用的なフォームでのマイクロインタラクション

See the Pen lottie form by Nobuo (@nobuo1106) on CodePen.

---

ご静聴有難うございました。