Creating Lottie animations in Figma

[@alang253]

I'm speechless. I'm updating my portfolio and the thought or rebuilding designs/transition/animations in AE or even Rive is so time consuming. Most of the designs I want to feature are already built out in Figma prototypes - my head is spinning on how easy it will be with this plugin!! I can do so much on my own now, and developers are going to love that I can just hand over the JSON file instead of them having to emulate my prototype!

[@lukecresante]

Do you think most of that speed is coming from not having to redo your existing prototypes? It really is pretty crazy to complement a tool like Figma... Even non-designers like me end up is figma haha

[@leeyujeong5462]

OMG… what a life and time saver for designers haha thanks for the video! 😊

[@balajprasanna]

Amazing video Ridd! The content, the presentation - top notch. I am happy I found your channel. Thank you so much!

[@erikakaishi1431]

Life-saver content! OMG, you are incredible dude!

[@newtonoluoch8103]

Jesus Christ!. Thanks Ridd, I came accross your channel just the other day and you are super invaluable. Thank you.

[@ridd]

Love to hear it 🙇‍♂️

[@ridd]

Love to hear it 🙇‍♂️

[@ridd]

So glad to hear it!

[@eiolenimea]

I'm really impressed with LottieFiles! But is there any way to include drop shadows in my animations? For me they always break when I animate shapes with drop shadows on them in Figma

[@hfromero]

Nice video, dude! I hope one day you can do a tutorial creating one of those

[@kiandraplummer2095]

Love this, I've been animating for a bit now and agree about AE, it can be very scary when you first open it. The airplane was my fav but understand your sentiment ;)

[@zero81888]

Thanks for the video, it was very helpful. Is there a limit to how many groups you can have in an animation frame? All of my frames are identical, I’ve just made certain layers visible at different points. Even so, certain objects just don’t show up when I export the prototype flow.

[@petertschann-grimm8442]

Can't figure out how to get an animation to end as the final frame. It always loops... even when I turn loop off it will go to the first frame at the end

[@tomashudolin7197]

Thank you for your tutorial. I tried my own animation with smart animate and bounce type of animation and this kind of animation isn't possible to export to Lottie. Or am I wrong?

[@thatdavelilly]

What annotation plugin/widget you use bro?

[@mariusorani]

Can Lottie also handle opacity and gradient?

[@sasha_malinovska]

Wow that was great! Thank you!

[@thompson.studio]

How are you playing it once on click? Can it be done with hover as well? *sad frustration noises*

[@TheWebCoder]

You briefly mentioned an "annotation component" and I'm intrigued! Is that preferable to raw annotation in dev mode? Is there anywhere to learn more recommended best practices around it? Thanks!

[@nooneo2q1]

Can i do this on figma web on ipad?

[@EvelynArianiEscalante]

Hello, when I make an animation in frames in figma, it contains the pulse and a hand simulating a touch screen. But when I want to export by lottie I only see the pulse animation and not the hand, does anyone know why that could be?

[@Rita_Johanna]

love it!

[@naxun1199]

Thank you for sharing! I would like to have the Figma source file of “Try Boolean Candle” for study. Is it possible?

[@SanneWijbenga]

Life-saver thx! 🚀

[@leelameka]

Thank you!

[@ouhinenara]

What's quick preview mode at 3:47?

[@sandeshbasnet5953]

shift + space

[@motiongraphik]

Brilliant video- thank you. But placing the lottie animations into Figma as Gif only. Most look really bad/pixelated. Unless i'm missing something.

[@BryceDriesenga]

Have you played with Rive?

[@ridd]

I'm filming a Rive Deep Dive in an hour :)

[@BryceDriesenga]

@@ridd Sick!

[@nested9301]

After effect animations are god level , what you show here is nothing

[@thewaliiiii]

"Pretty powerful" yeh, no keyframes, no proper tools, you ok?