Lottie is an amazing tool built by the engineers and animators over at Airbnb. With a simple plugin, it allows for animations to be easily exported from Adobe After Effects and dropped into your website or app. These files are vector based which allow for infinite rasterized scaling, smoother playback, and significantly smaller file size (death to clunky gifs!). Lottie is quickly becoming a standard in web design for micro-animations and used for richer storytelling. It has completely changed how I approach interactive web design and I love using it to enhance all the projects that I end up developing. Take a look below at some examples and how they can be used to enhance your digital experiences.
COMMON UI ELEMENTS
Consistently looping
elements like loaders
Hover triggers for revealing
(hover over element to test)
Clickable interactive triggers
(click or tap to change state)
FULLY ANIMATED SCENES
Easy breezy animations triggered by scrolling!
Isn’t this cool stuff!?! Feel free to reach out to me if you have any particular questions or want to learn more about what Lottie can do. I love this tool and am thrilled at the idea of using it to help clients create bespoke animations for any fun web based projects they can dream up.