I’m thrilled to announce that I started working at
@rive_app
at the beginning of October and I’ll be able to work full time in a field I love combining animation, interactivity and design.
I'm really exited to announce that bodymovin is officially joining the Lottie family! Say hello to lottie-web!
Lottie wouldn't exist without the amazing work by
@airnanan
,
@theWithra
, and
@TheRealSalih
and now we're
#oneteamonedream
!
Lottie-web version 5.1.1 is up. Huge performance improvements! What will you do with all those extra milliseconds? Also some bug fixes, refactored code and a couple of new features. 🛍️
I did an interactive svg animation of a chameleon hungry for unwary cursors flying around. Testing the new lottie api for editing animation properties dynamically. via
@Codepen
.
Thanks Adobe Flash Player for introducing me to code, animations, interactivity and all the magic happening on the web from a corner in Buenos Aires. Bodymovin and Lottie are in debt to you and will try to keep your flame alive.
goToAndPlay(0)
Lottie-web version 5.1.11 is out.
Lots of performance improvements for svg and canvas renderers.
More milliseconds per frame freed from their routine.
And more to come!
#freeYourInnerLoop
Super pleased to announce that I’ve joined the incredible team at
@rive_app
as Creative Director.
If anyone ever has any thoughts or questions about Rive please don’t hesitate to reach out!
Finally things aligned, and they were kind enough to extend the offer once more. I immediately said yes and this week starts my journey with an amazing project and team!
All animations on Lottiefiles can now be used in
@framer
Lottie components. Copy the JSON link from the animation detail page. Shoutout to
@_gavinowens
,
@Airbnbdesign
. 🙌
Looking for any Lottie or Bodymovin user / studio / company that can help me with a letter of recommendation, please DM me. A RT also helps!
Can pay with feature requests and bug fixes. :)
Interactive morning yoga via
@CodePen
Illustration and rigging done by the great Matthew Jedrzejewski.
Warning, some poses are only recommended for advanced users.
Some coooool thread level updates to Bodymovin and lottie-web!
1- Report
2- Expressions to keyframes
3- Skottie preview
4- Pucker and Bloat support
5- Improved expression support
Rive for
@unity
is now available as a tech preview! 🚀
Some features are still rolling out (details in thread), but you can start using it to build your game today. We’d love to have you try it out.
The Rive 2 closed beta is here! We've been hard at work on a new version of Rive that introduces team collaboration, new web and desktop editors, and numerous UX improvements. Sign up at and read our blog post at .
#MadeWithRive
Space and Lottie animations together. Great day.
If you like a tweet with hashtag
#CountdownToMars
you'll get a special animation rendered with Lottie!
To NaN and beyond!
When they invited me to join their team, I was thrilled to have such an opportunity, but for personal reasons I couldn’t accept back then. Time went by, Rive became an even more amazing tool, with everyone talking about it and using it more and more.
2/ Export to Rive!
@rive_app
. If you want to integrate AE and Lottie animations with Flutter, or use Rive’s runtimes on any platform, or add the extra awesome features they provide, export your animations directly to an .flr2d
thank you for the questions. It was fun remembering those first years of bodymovin and lottie.
Apologies for the hour. And the fire alarm. And the lighting!
I had the chance to talk with the man who started it all,
@airnanan
.
If you're interested in the history of Lottie, why he created Bodymovin, the challenges he faced and having an open-source project adopted by Airbnb check out the full conversation 👇
1/ Import Lottie Animation. 🔄
Now you can import a lottie animation back to After Effects. After so long the most requested featured has a first version. If you import someone else's animation ask for permission!
Interactivity, the editor, state machines, bones, constraints, and so much more. It felt unreal. I became an instant fan and have been following their progress since then.
Anyone going to the
@AWWWARDS
conference in May in SF interested in talking about Lottie / Bodymovin? 1 coffee for an improvement suggestion and 1 beer for a story 🍿
When I first found Rive a few years ago, I was navigating through their site in awe of the set of tools they had developed. Then I met Guido and Luigi, who shared their plans for the future, and it was a jaw-dropping moment.
Even under those circumstances, and thanks to the involvement of many people, Lottie became one of the tools that helped bring new experiences to the web that were previously difficult to achieve because the tools and the technology were not there.
me and
@LauKitton
did a 3D html + svg interactive form to find your Spirit Animal via
@CodePen
using Lottie and Bodymovin
Unfortunately works best in Chrome, other browsers have some performance issues.
The lack of an editor and its dependency on After Effects, the missing built-in interactivity, the limited possibilities with javascript, svg and canvas were some of the challenges to overcome that needed a long term strategy, focus, and of course resources.
Really, really pumped to have been able to talk to
@guidorosso
about what the
@rive_app
team are up to. I really think Rive is going to be a major player for motion design in 2024 and beyond.
🚀 Perf tip: if your web app ships large JSON-like configuration as JavaScript object literals, consider using JSON.parse instead. It’s much faster, especially for cold loads!
I invented a helper panel for
#bodymovin
in
#AfterEffects
to make color selection, renaming, and management much faster and easier for CSS selection. Free and open source at .
(thanks
@airnanan
! I've been learning to code specifically to use Bodymovin')
3/ Improved image compression! 🗜️
Are you using your animations on Webflow? Are you exporting multiple rasterized images as part of your Lottie? Are you frustrated by the size of those files? Ok, fixed
4/ Banner export. 📵
Export AE animations directly as a banner. Zipped? Check. clicktag? Check. cdnjs? Check. Sizes? Check. Got your ad blockers up to date? Should go check.
I made a PaintWorklet renderer for Lottie animations! In an upcoming Chrome version this animation will run entirely isolated from the main thread much like a video or accelerated CSS animation. Check it out!
@MotionMarkus
Hey! I just became one of your patreon friends :)
I've downloaded your smashdown animation and exported it to svg for web.
Mind if I share it around?
2- Expressions to keyframes. Useful when using players that don't support expressions or your expressions are using not supported features.
It won't affect the original animation and will convert them on the fly.
or add this to a single expression to bake it
// lottie:bake