Lottie についてのメモ
Lottie とは
Lottie というのは、Adobe After Effects からエクスポートしたアニメーションの JSON をレンダリングするソフトウェアのこと、もしくはその JSON のフォーマットのことを指すらしい。
Bodymovin (2015年)
2015年、Hernan Torris 氏が Bodymovin を公開した。これは、
- Adobe After Effects のアニメーションを JSON としてエクスポートするプラグイン
- その JSON をウェブ上でレンダリングするライブラリ
がセットになっている。この時点ではまだ Lottie という名前はなかった。
Lottie (2017年)
2017年2月、Airbnb が Bodymovin でエクスポートした JSON を iOS・Android・React Native でレンダリングするソフトウェア Lottie を公開した。
Bodymivin のレンダリングライブラリの方のレポジトリは、このとき lottie-web という名前に変更されて airbnb に移管されたっぽい（レポジトリの Contributors を見ると今でも Hernan Torris 氏のコミットが一番多いのがわかる）。
Lottie file format v1.0（2024年）
今年1月、Linux Foundation は Lottie Animation Community の設立を宣言する。このコミュニティは、Lottie file format を策定し、業界標準の規格として普及させていく活動をするものらしい。ツールにも言及しているが、あくまでフォーマットを主眼としている。
LAC aims to develop a formal Lottie format specification for implementation across renderers and other tools, and works towards the promotion and widespread adoption of the Lottie file format as an industry standard.
Lottie Animation Community には Hernan Torris 氏や Airbnb もメンバーに入っている。でも、Airbnb の方の Lottie のウェブサイトからリンクが貼られていなくて、どれくらい緊密に連携しているのかは謎...。
The current LAC steering committee members are Hernan Torrisi, Google, LottieFiles, Airbnb, Salih Abdul-Karim and Gabriel Peal.
そして、今年9月にはバージョン1.0が発表されている。早すぎじゃない？という気もするけど、まあもうすでに10年くらいやってるものなので、いじる余地があまりないということなのかもしれない。
現在の Lottie file format の規格については以下のウェブサイトにまとまっている。
よくわからない点
そんな感じで整いつつあるっぽい Lottie 界隈だけど、みんな同じ方向を向いてるのかいまいちわからないな、という印象がある。このあたりの風向きは全くわからないけど、思ったことをメモ。
Hernan Torris 氏はすでに Lottie をやっていない
Hernan Torris 氏は、いま何してるんだろう、と思って調べたら、2023 年に Rive に入ったらしい。
Rive は Lottie の対抗馬で、Lottie よりも軽くて速い独自のフォーマットを使おうとしている。なんかやっぱり、After Effects のシリアライズフォーマットとしてはいいけど、もっとオープンな規格としては Lottie だと不足があるのかな？と思ってしまうところがある。
Rive has evolved beyond Lottie’s capabilities to create animations that are faster, smaller, consume less memory, and fully interactive–all in one tool.
Rive のフォーマットは Rive のレンダリングライブラリに特化されたものだけど、いちおうフォーマットは公開されている。とりあえずバイナリフォーマットなのはよさそう。
Lottie File format でやっていけるのか
まあたしかに、Lottie を試しに使ってみるとやたら重くて、新しくフォーマットを作りたくなる気持ちもわかる。Lottielab でチュートリアルのローディングアニメーションを作ってみたら、45kB にもなった。これ1つではそんなに重くないけど、何十個もアニメーションを入れようと思うとちょっと無視できないサイズのような気がする。
それは Lottielab も認識しているらしく、「Optimise and publish」というボタンが用意されている。これを使うと、サイズが5分の1くらいになった埋め込み可能な URL が生成される。
この optimise というのが何をしているのかというと、よくわからないけど、Lottielab 製の Lottie レンダリングライブラリに最適化したフォーマットに変換してるっぽい。これはつまり、Lottielab 以外のレンダリングライブラリで使おうとするとうまくいかないかも知れないということで、Lottielab にゆるやかにロックインされるということになる。たぶん。
それだとオープンなフォーマットである意味なくない？、とまでは言わないにしても、なんだかなあ、という感じではある。
感想
結局 Lottie ってフォーマットのことなの？ ソフトウェアのことなの？という点に関しては、よくわからなかったというか、不可分なものなんだなと思った。ユーザーにとってはファイルフォーマットだけがあっても役に立たなくて、それをレンダリングするソフトウェアとセットに考えないといけない。でも、Lottie Animation Community はそういう実装を提供する組織ではないので、Lottielab や LottieFiles のような Lottie のアニメーションを作成するツールがレンダリングライブラリも提供しないといけない、という構図になってしまうのは仕方がない。
Lottie file format はまあ、データのやり取り用のフォーマットとして地位を確立してくれればよくて、実際のレンダリングには別のフォーマットが必要になるのかなあ。可搬性とパフォーマンスがトレードオフになるのはまあ仕方がない面はあるので、そういうものだと思って覇権レンダリングライブラリの登場を待つしかないのかも知れない。
Discussion