Design Shorts #2: Add Lottie animation to your Astro project. Intro to After Effects and Bodymovin 🚀

Published: 01 October 2023
on channel: SebikoStudio
491
11

🚀 Welcome to the next episode of Design Shorts! In this video, I'll show you how to integrate Lottie SVG animations into your Astro web project.

🎨 We'll kick things off in Figma, where we'll create assets in a sleek flat design style. From there, we'll export our vectors to After Effects, where the magic happens.

💥 But that's not all! We'll leverage the power of the Bodymovin plugin to effortlessly export our masterpiece to JSON format, ready to be seamlessly embedded into our website.

🌟 If you would like to see more Design Shorts like this one let me know in the comments section below.

🔗 For helpful links and access to my Astro demo project, check out the details below. Stay tuned for more exciting Design Shorts, and see you in the next episode.

Astro Web-framework: https://astro.build/
Astro-Lottie integration: https://socket.dev/npm/package/astro-...
AEUX plugin: https://aeux.io/
Bodymovin for After Effects: https://aescripts.com/bodymovin/

Astro Demo Project: https://digitalattack.netlify.app/

#figma #figmacomponents #AEUX #aftereffects #bodymovin #svg #webdesign #webdevelopment #astrolottie #lottiefiles #lottieanimation #designsystem #astrobuild #development #html5 #animation #designshorts


Watch video Design Shorts #2: Add Lottie animation to your Astro project. Intro to After Effects and Bodymovin 🚀 online without registration, duration hours minute second in high quality. This video was added by user SebikoStudio 01 October 2023, don't forget to share it with your friends and acquaintances, it has been viewed on our site 491 once and liked it 11 people.