Lottieとは?
Lottieは、JSONベースのアニメーションファイル形式です。これを使うと、静止画アセットを配信するのと同じくらい簡単に、アニメーションをあらゆるプラットフォームに配信できます。Lottieはどんなデバイスでも動作するサイズの小さなファイルで、ピクセル化を起こさずに拡大縮小できます。LottieFilesはLottieの作成、編集、テスト、共同制作、配信を、これ以上なく簡単に行えるようにします。
Lottieのメリット
一般に使われているほかのアニメーションファイル形式と比べて、Lottieには次のような長所があります。
小さいファイルサイズ
Lottieアニメーションなら、GIFやMP4のようなほかの形式と比べて、同じ品質を保ちながらファイルサイズをはるかに小さくできます。
無限に拡大縮小可能
Lottieアニメーションはベクターベースです。そのため、解像度を気にすることなく拡大縮小できます。
マルチプラットフォームのサポートとライブラリ
どんな開発者にとっても、Lottieのハンドオフはとても簡単です。Lottieアニメーションは、修正することなくiOS、Android、Web、React Nativeで使用できます。
インタラクティブ
Lottieアニメーションは、アニメーションの各要素にアクセスして操作できるようになっています。スクロール、クリック、ホバーといったインタラクションに反応するインタラクティブなアニメーションを作成することができます。詳しくは「インタラクティビティガイド」をご覧ください。
Lottieは、世界中で使われています
Lottieは、世界の万社以上、日々使っているツールの多くで使われています。
Lottieを使うには?
Lottieを使い始めるのに役立つツールとリソース。
ステップ1
Lottieを見つける、または作成する
Lottieアニメーションを見つける
無料のアニメーションを集めた、すぐに使えるライブラリから検索しましょう。
それからカラーパレットツールやLottieエディターを使って、あなたのブランドや好みの色に合わせてLottieをカスタマイズしましょう。
または、Lottieを最初から作成する
アニメーション作成のスキルを持っている方は、LottieFilesのAdobeプラグインを使ってLottieを作成してみましょう。そうでない方は、SVGファイルを用意して、LottieFilesのSVG to Lottieコンバータのプリセットを適用してみましょう。
ステップ2
Lottieを使用する
デザインツール、コーディングツール、生産性ツールでLottieを使用しましょう。
開発者向けのLottieライブラリ
Lottieは、その他の多くのツールでもネイティブにサポートされています
さあ、LottieFilesを始めましょう。
2010
Lottieが登場する前、アニメーションはモーションデザイナーが作成し、それを渡されたソフトウェア開発者が実装するものでした。実装の選択肢には限りがありました。開発者は、アニメーションを低画質の形式でエクスポートしたり、アニメーションをコードで一から再構築しようと試みたりしていました。このやり方は効率が悪く、モーションデザイナーの意図からほど遠い、最善とは言えないモーションになってしまうこともよくありました。
Adobe After Effects内のアニメーション表現をエクスポートして、そのアニメーションを実行時にレンダリングするというアイデアを、Hernan Torrisi氏が思いつきました。彼は、アニメーションプロジェクトを列挙するためにAfter Effectsのスクリプト機能を利用し、アニメーションのJSON形式の記述をエクスポートするAfter Effects用プラグインであるBodymovinをリリースしました。そしてさらに、その形式用のレンダラーと、ブラウザ向けのJavaScriptベースのプレーヤーを初めてリリースしました。
2017
AirbnbのエンジニアであるBrandon Withrow氏、Gabriel Peal氏、Leland Richardson氏が、JSONベースのアニメーションがもたらす可能性に目を向け、それが様々な問題を解決してくれることに気がつきました。3人はAirbnbのリードアニメーターSalih Adbul-Karim氏と協力して、JSONアニメーションファイルをレンダリングできるiOS用およびAndroid用ライブラリの構築に取り組みました。そのアニメーションファイルは彼らに「Lottie」と名付けられました。
LottieFilesがローンチ!
LottieFilesが登場し、アニメーターや開発者がWeb上でアニメーションを即座にテスト、共有、発表できる場を提供し始めました。
Microsoftと.Net Foundationが、LottieをWindows上でレンダリングするためのライブラリをリリースしました。
2019
QtにLottieのレンダリング用のQML APIが追加され、Lottieがサポートされるようになりました。Samsungが、プラットフォームに依存しないC++ベースのLottie用レンダラーであるrLottieをリリースし、TizenでLottieをサポートするようになりました。
dotLottieが誕生。dotLottieは、1つまたは複数のLottieアニメーションと関連リソースを単一のファイルにまとめたオープンソースのファイル形式です。これはアニメーションの未来を支える、次世代のLottieになるでしょう。