​
Design Mode

Use Design Mode to prepare your graphics for animation. This is where you can design your own graphics with Rive’s tools, import graphics from other software, or rig your graphics with bones, transform spaces, layouts, joysticks, and constraints. Image Design Mode is the default mode for any file that doesn’t have any animations created. The mode exists because Rive allows you to attach multiple animations to a single artboard, so you need a place to set up and create those graphics.

​
Animate Mode

Use Animate Mode to create all of the States and State Machine for your artboard. Animate Mode Image When you switch to Animate Mode, the UI updates to display a list of Timelines and State Machine associated with the active artboard. The Inspector also updates to show key buttons next to any property that can be animated. Selecting any Animation from the Animations list will bring up a timeline view, while selecting a state machine will replace the timeline with the graph view.

​
Creating Assets in Animate Mode

While there are separate modes, graphics can be created and changed in both modes, but it’s important to keep a few things in mind.
  1. If a Timeline is selected, graphics, both procedural and custom paths, can be created. While graphics can be created, any changes to the path, shape, or its properties will automatically be keyed on the timeline. Because of this, we recommend not making any assets when a timeline is selected.
  2. Animate Mode works like Design Mode if a State Machine is selected. Asset creation, rigging, and other design changes will not be automatically keyed. This lets you make any design changes you want without switching between the different modes, though you do lose some screen real estate due to the graph. We recommend making vast changes in Design mode while using Animate mode only to add quick adjustments like hitboxes or layouts.