From the design concept, I created an animated SVG for our homepage (here at intelia). Instead of using a video or gif, I rendered the animation using Lottie Web (formerly Bodymovin) and it turned out pretty well all under 50KB. Check out the SVG animation on Codepen
One performance trick I learnt in the process of making the animated SVG is:
For shadows, try using a gradient with matching color boundaries instead of using a drop shadow. Makes the animation play smoother and works best for animations on dark backgrounds 😉
Press L if you like
Check out my Instagram & Twitter to peep my process and other stuff
L or F like
Show and tell for designers
What are you working on? Dribbble is a community of designers sharing screenshots of their work, process, and projects.
© 2019 Dribbble. All rights reserved.
Take our community survey and get an amazing giveaway and font discount.
Minimum 6 characters
Uh oh… We’re still waiting for our spam prevention code to load.