Rive Tutorial for Beginners - Interactive Animation in 25 Minutes!
114.5K views · 2025-05-30
Motion Design
Rive For Motion Designers: https://jkinmo.com/4j6jix
Try out Framer FREE: https://framer.1stcollab.com/jakeinmotion_2
Use Promo Code JAKEINMOTION at checkout to save 25% off your first three months.
In this tutorial, I'm going to teach you how to get up and running in Rive. We'll be making an interactive button in Rive, complete with idle, hover, and click states. We'll learn how to transition between each state based on user input with the mouse, and how to contorl the animation between states using Rive's State Machine.
Chapters
00:00 Intro
01:35 Project Setup
03:08 Designing the Button
06:57 Setting Button States
10:25 The State Machine
12:26 Controlling Transitions with Inputs
14:41 Interpolating Between States
17:35 Controlling Inputs with Listeners
21:06 Eliminating Variables
21:56 Variable Font Weights
23:42 Automatic Overshoots
Try out Framer FREE: https://framer.1stcollab.com/jakeinmotion_2
Use Promo Code JAKEINMOTION at checkout to save 25% off your first three months.
In this tutorial, I'm going to teach you how to get up and running in Rive. We'll be making an interactive button in Rive, complete with idle, hover, and click states. We'll learn how to transition between each state based on user input with the mouse, and how to contorl the animation between states using Rive's State Machine.
Chapters
00:00 Intro
01:35 Project Setup
03:08 Designing the Button
06:57 Setting Button States
10:25 The State Machine
12:26 Controlling Transitions with Inputs
14:41 Interpolating Between States
17:35 Controlling Inputs with Listeners
21:06 Eliminating Variables
21:56 Variable Font Weights
23:42 Automatic Overshoots