crftロゴ

LottieFilesがさらに身近になった!

Wordpress用プラグインがリリース!
LottieFiles
Minoru Nitta
Minoru Nitta
グラフィックデザイナー・フォトグラファー
このエントリーをはてなブックマークに追加

LottieFilesがさらに身近になった!

LottieFilesって?

 厳密にいうとピクセル画像のハンドルも可能みたいですが、基本ベクターベースのアニメーションをウェブサイトに実装できる技術で、なぜかAirbnb が開発したみたいです。

  LottieFiles のサイトを見てみると錚々たるブランドがLottieFilesを採用しているということになっています。

 LottieFilesはマイクロアニメーションなどと呼ばれるUIやUXに使うアニメーション実装に便利とされています。

 作成する環境も柔軟性があって、AfterEffects用のプラグイン からAfterEffectsのアニメーションを条件付きではあるけど書き出すことも可能です。

Elementorを使うと簡単に実装できる

 ElementorをPro にするとLottieウィジェット を使って簡単にLottieFilesアニメーションを実装することができるようになります。

 ウィジェットをページにドロップしてLottieFilesを選択するだけ。

Gutenbergのブロックに対応したLottie

 WordPressではGutenbergがどんどん進化していて、リリースも近いとされているWordPress 6.xでは大きくビジュアルエディターとして進化するとされています。

 そのGutenbergのコンセプトのひとつブロックに対応したLottieFilesのプラグインがリリースされました。

 GutenbergのブロックパネルからLottieFilesサイトで公開されているライブラリに直接アクセスして埋め込むことが可能になります。

 もちろんWordPressのメディアライブラリから自作したLottieFilesアニメーションを指定することも可能になります。

 スクロールエフェクトなどにも対応しているようで、これは使えそうです。

新田もLottieFiles作ってます

 当サイトcrft主宰者の新田もLottiFilesのファンで、LottieFilesサイトにプロフィールページ を持っています。

 作成したアニメーションはすべて無料で公開しています。

 使えるかどうかはわかりませんが、役に立つとおもったら遠慮なく使ってください。