Keyframes

4m 59sPublished Oct 21, 2025

SummaryVersion Notes (Draft)

This lesson dives into the fundamentals of Keyframes, the building blocks of motion in Rive. It covers manual and automatic keyframe setting, the distinction between property values in Design vs. Animate mode, and the use of Top-level Keys for efficient management. Additionally, the tutorial introduces various workflow shortcuts for copying, navigating, and retiming keyframes.

Mode Separation: Values in Design mode represent the object's base state. Keyframes only exist and activate in Animate mode.
Property Keying: Look for the diamond icon in the inspector to identify which properties can be animated.
Pro Shortcuts: Mastering Alt with the comma/period keys to move keyframes and Alt-drag for scaling timing are essential for a fast professional workflow.

📌 Key Points

Set keys via inspector or stage, copy-paste keys, timeline shortcuts.

📝 Notes

Markdown

0 chars

Step by Step

00:15

Setting Keyframes Manually

With Animate mode active, select an object and click the "diamond" icon next to a property in the inspector. A blue diamond indicates a set keyframe.
00:56

Deleting Keyframes

Select a key in the timeline and press Backspace, or simply click the blue diamond icon in the inspector again to remove it.
01:03

Automatic Keyframing

As long as the timeline is open, modifying an object on the canvas or in the inspector will automatically generate a keyframe at the playhead's position.
02:03

Creating Motion

Set keyframes with different values at different points in time. Rive automatically interpolates between these values to create smooth movement.
03:04

Top-level Keys

When a layer is collapsed, multiple individual keys are represented by a single "Top-level Key," which allows you to move all properties at that time point simultaneously.
03:32

Copy and Paste

Use Command + C and Command + V (or Ctrl equivalents) to quickly duplicate keyframes across different points in the timeline.
03:55

Navigation Shortcuts

Use , (comma) and . (period) to move frame by frame. Hold Shift for 10-frame jumps, or Command to skip between keyframes.
04:34

Retiming Keyframes

Select multiple keys and hold Alt while dragging the ends to scale the timing of your animation or even reverse the keyframe order entirely.