Kill Lottie? Bring in Rive?
summary
Examines Lottie’s rendering mechanism and its limitations by explaining how Lottie’s renderer works under the hood. Introduces Rive (created by Lottie’s author) and demonstrates how Rive addresses Lottie’s shortcomings, showing built-in interactivity by creating an interactive animated element in Rive without coding.
AI-written summary · about
chapters (25)
- 0:00Introduction
- 1:49Animation problems with Lottie
- 3:35GIF, video and manual animation issues
- 6:26How Lottie works
- 8:54Creating Lottie animations
- 11:20Lottie implementation on iOS and Android
- 13:29Lottie problems and editors
- 15:58Lottie conclusions
- 16:18Progress bar animation example
- 17:46Rive introduction
- 18:51Rive history
- 20:18Rive interface and features
- 21:04Rive state machine
- 22:08Rive interactivity and triggers
- 22:31Rive bone animation
- 23:14Converting Lottie to Rive
- 23:56Rive technical implementation
- 24:42Lottie vs Rive performance
- 27:14Performance tests
- 31:33Resource usage conclusions
- 32:15Platform support and stability
- 32:58Cost and availability
- 33:41Popularity and community
- 34:23When to use Rive over Lottie
- 35:11Q&A
related talks
14mLottie to Rive, the Evolution of Rendering Animations in React
37mrlottie: A New Approach to Motion Graphics UI
22mLottie: Animating the bridge between designers and developers
15mLottie: Establishing an Open Standard for Vector Animation
57mDigging into Animation Players Using lottie-web as an Example (Part 2)
38mRive: The Final Frontier of Graphics for Flutter Apps
39mTouch, Respond, Animate: Interactive Rive Awesomeness
28mAnimating the Web: Elevating UX with Lottie and modern technologies