Breakdown
Lottie Animations
tl;dr Lottie animations are vector based web animations that are incredibly lightweight. They can be created in Adobe After Effects, and all of the possibilities that allows.
They can be used in website interfaces and mobile apps and in the following cases for web-based games and contests:
Rock Paper Prizes:
⚡️The Lightning Move⚡️
This digital contest played on cross-platform mobile web, utilized live-action player videos. For a special International Rock-Paper-Scissors Day, there was a promotion for a special lightning move that would guarantee a win.
The Lottie animation was overlaid on top as an intersitial between the chosen move and the oppenents losing reaction:
Animation Pre-viz
Animated Button
Lightning Move Animation
Drink Snack Score:
In-Game Messaging & Instructions
This gamification contest used a 3D three.js environment with Lottie animations overlaid for in-game messaging and instructions.
In-Game Messaging Pre-viz
Winning Shot
Goalie Saves
Gameplay Instructions
Finger Swipe Up to Shoot
Fuel Runner:
In-Game Messaging & Instructions
Another gamification contest using a 3D three.js environment with Lottie animations overlaid for in-game messaging and instructions.
Fuel Runner: Mobile Gameplay
Gameplay Controls
Fuel Gauge
Game Over
Instant Prize Alert