アニメーションを使ったアプリ作成が可能になり、デザインの幅が大きく広がります。

サンプルアプリはこちら

https://sharev3.click.dev/fbf3d4d5-de29-43d2-ab7b-0f2885b46ee3?locale=en

6b737f37e8bfb033b697dfa34a66f802.gif

Lottieアニメーションを使ったアプリ例

Lottieアニメーションとは

Lottieは、JSONベースのアニメーションファイル形式です。ファイルサイズが小さく、アプリの読み込み時間に影響を与えません。

軽量なファイルサイズは、特にモバイルアプリにとって重要な要素です。Lottieはベクター形式のアニメーションを使用するため、高解像度で滑らかなアニメーションを提供できます。ベクター形式は、画像を拡大縮小しても品質が低下しません。

6a781edc214119b5521d9dfee2fd0bef.gif

(引用元)https://app.lottiefiles.com/

※無料からご利用いただけます。ご利用の仕方によりましては、Lottie Filesの有料プランへご自身で登録いただく必要がある場合がございます。

詳細は公式サイトを確認ください。

Lottieを埋め込む方法

目次

  1. LottieFilesにアカウント登録し、ワークスペースを作成する。
  2. Lottieアニメーションの Asset Link を取得する
  3. ClickエレメントにLottieを埋め込む