LottieFiles

フィグマからロッティーへ:フィグマに動きをもたらす

フィグマからロッティーへ:フィグマに動きをもたらす

Figma to Lottie機能を使用して、デザインやプロトタイプを簡単に製品向けのLottieアニメーションに変換できます。 Figma DevモードでLottieFiles for Figmaを使用して、埋め込みコードとアセットリンクを手間をかけずに取得し、手間をかけずにファイルを引き渡すことができます。

Trusted by over million users and companies worldwide.

  • Google
  • Disney
  • Duolingo
  • Uber
  • Instacart
  • Citi
  • Accenture
  • Grab
  • Gojek
  • Spotify
  • Netflix
  • TikTok
  • Microsoft
  • Airbnb
  • Amazon
  • Google
  • Disney
  • Duolingo
  • Uber
  • Instacart
  • Citi
  • Accenture
  • Grab
  • Gojek
  • Spotify
  • Netflix
  • TikTok
  • Microsoft
  • Airbnb
  • Amazon

Figma上での本番用アニメーション

AIプロンプトをベクトルに変換

AIプロンプトをベクトルに変換

Over 500,000 free and premium, ready-to-use Lottie animations to get you started
Access your team's private animations and insert them directly on Framer
Access your team's private animations and insert them directly on Framer

Access your team's private animations and insert them directly on Framer

Advanced dotLottie player for more granular control
Advanced dotLottie player for more granular control

Advanced dotLottie player for more granular control

Customize to your brand and aesthetic with personalized color palettes
Customize to your brand and aesthetic with personalized color palettes

デバイスにアニメーションを直接ダウンロードする

Add interactivity using Framer’s native features
Add interactivity using Framer’s native features

プレミアムアニメーション

Engage your users with creative interactive effects

Loop

Hover

Click

Click

3つの簡単なステップで始めましょう

LottieFiles for Figmaを始めるためのいくつかのインスピレーションをお届けします。

Get started in 3 simple steps

Step 1

Launch the plugin

Find and open the LottieFiles for Framer plugin in your project.

Step 2

Search for an animation

Search for a Lottie animation using the ‘Discover’ or ‘Workspaces’ tabs.

Step 3

Insert the animation

Insert the animation into your Framer sites. You can customize the animation’s colors or add interactivity.

Figmaでアニメーションの作成方法をすべて学び、そして認定も取得しましょう!

Design teams love LottieFiles

Airbnb

"Instead of spending dozens of hours learning Xcode or Android studio, I use LottieFiles to test and share. Now I use those hours to make my animations as dope as I can."

Salih Abdul-Karim, Lead Motion Designer at Airbnb

Salih Abdul-Karim

Lead Motion Designer at Airbnb

Webflow

"Our customers can add Lottie animations to their site in seconds, without even thinking about code. The creative control this unlocks is huge."

Barrett Johnson, Product Marketing at Webflow

Barrett Johnson

Product Marketing at Webflow

Swiggy

"LottieFiles is a one-stop destination for all your Lottie needs ever."

Saptarshi Prakash, Product Design Manager at Swiggy

Saptarshi Prakash

Product Design Manager at Swiggy

Design teams love LottieFiles

Airbnb

"Instead of spending dozens of hours learning Xcode or Android studio, I use LottieFiles to test and share. Now I use those hours to make my animations as dope as I can."

Salih Abdul-Karim, Lead Motion Designer at Airbnb

Salih Abdul-Karim

Lead Motion Designer at Airbnb

Webflow

"Our customers can add Lottie animations to their site in seconds, without even thinking about code. The creative control this unlocks is huge."

Barrett Johnson, Product Marketing at Webflow

Barrett Johnson

Product Marketing at Webflow

Swiggy

"LottieFiles is a one-stop destination for all your Lottie needs ever."

Saptarshi Prakash, Product Design Manager at Swiggy

Saptarshi Prakash

Product Design Manager at Swiggy

FAQs

ロッティとは何ですか?

ロッティ(Lottie)は、テキストベースの記述形式を使用してアニメーション要素と移動の記述を行い、ファイルサイズを小さくし、プラットフォームの独立性、解像度の独立性、アニメーション再生中の可変フレームレートを実現するJSONベースのアニメーションファイル形式です。Web、iOS、Android、Windows、その他のプラットフォームには、オープンソースで無料のLottieプレーヤーが存在します。

ロッティとは何ですか?

ロッティ(Lottie)は、テキストベースの記述形式を使用してアニメーション要素と移動の記述を行い、ファイルサイズを小さくし、プラットフォームの独立性、解像度の独立性、アニメーション再生中の可変フレームレートを実現するJSONベースのアニメーションファイル形式です。Web、iOS、Android、Windows、その他のプラットフォームには、オープンソースで無料のLottieプレーヤーが存在します。

LottieFiles for Figmaプラグインをどこからダウンロードできますか?

LottieFiles for Figmaプラグインをどこからダウンロードできますか?

プラグインはどのような形式のインポートをサポートしていますか?

プラグインはどのような形式のインポートをサポートしていますか?

プラグインはどのような形式でエクスポートをサポートしていますか?

プラグインはどのような形式でエクスポートをサポートしていますか?

プラグインを使用するためにログインする必要がありますか?

プラグインを使用するためにログインする必要がありますか?

プラグインを使用するにはインターネット接続が必要ですか?

プラグインを使用するにはインターネット接続が必要ですか?

FigmaプラグインのLottieFilesはdotLottie形式をサポートしていますか?

FigmaプラグインのLottieFilesはdotLottie形式をサポートしていますか?

FigmaプラグインのLottieFilesはGIF形式をサポートしていますか?

FigmaプラグインのLottieFilesはGIF形式をサポートしていますか?

FigmaでのLottieFilesはSVG形式をサポートしていますか?

FigmaでのLottieFilesはSVG形式をサポートしていますか?

プラグインからプライベートアニメーションにアクセスできますか?

プラグインからプライベートアニメーションにアクセスできますか?

Figma 用の LottieFiles をインストールする

プラグインを無料で利用して、そのすべての機能を活用し始めましょう