Animate logos, icons and simple shapes
For geometric work, your assistant draws the shapes itself and animates them: loaders, logo reveals, icon motion, text effects, falling and bouncing things. For characters or anything painted, start from real art instead: shapes an AI draws look like programmer art.
- You bring
- A description, and optionally an SVG logo or icon.
- You get
- A
.rivfor apps and websites, or a.revthat opens in the Rive editor. - Needs
- Nothing beyond the install.
Ask your assistant
- Animate
logo.svg: fade it in, then pop it with a little bounce. Save it aslogo.riv. - Make a loading spinner of three dots bouncing in turn, in #6C5CE7, on a 400×400 canvas.
- Draw a heart that beats twice a second and glows softly.
- Make the word "Launch" wave letter by letter.
- Rain falling over a dark sky with mountains, with a bit of wind.
How it works
Draw
- A project with an artboard, the canvas:
create_project,create_artboard. - Shapes:
add_rectangle,add_ellipse,add_polygon,add_star,add_path, grouped withcreate_group. An SVG comes in withimport_svg, each of its paths a named shape. - Colour:
set_fill,set_gradient_fill,set_stroke.set_feathersoftens an edge for a glow, a blur or, offset, a drop shadow.boolean_shapescuts one shape out of another. - Text:
add_text. Inter comes built in; give your own font file for another.
Animate
- Keyframes:
create_animationandadd_keyframe, a whole track with its easing (ease out, bounce, elastic and more) in one call.edit_keyframeschanges the easing afterwards, andmake_loop_seamlesscloses a loop. - Lines that draw themselves on:
animate_trim_path. Motion along a path:animate_along_path. One shape turning into another:morph_path. - Letter by letter:
add_text_modifier_groupandadd_text_modifier_range. - Something that bends, like a tail or a rope:
auto_rig_pathadds bones to the outline and a wag.
Physics
bake_motion drops, bounces and blows a shape with gravity, ground and wind. bake_shake shakes the camera, emit_particles makes rain, dust or sparks, and spawn_prefab places ready-made skies, mountains, ground and rocks. compose_scene builds a whole scene from one description. The physics is worked out when the file is made and stored as ordinary keyframes, so it plays the same in every Rive runtime.
Look and save
Your assistant renders a frame with render_riv or the motion with preview_riv_gif, then writes the file with export_riv.
Good to know
- Name the things you care about ("the circle called Ball"), so later requests can refer to them.
- Give timing in seconds. Keyframes are counted in frames at the animation's frame rate, and your assistant does the conversion.
- A
.rivplays in every Rive runtime (web, iOS, Android, Flutter and the others) but can't be opened in the Rive editor. Ask for a.revwhen you want to keep editing it there. - Buttons and toggles come ready-made with their interactions: see Buttons and interactive files.
Related
- Buttons and interactive files: make it respond to hover, taps and your app.
- Paint a blocked-out scene: the same layout and motion, painted by your image model.
- Preview, check and share: GIFs, videos and a web page that plays it.