Rive: a tool to create interactive graphics.

Rive is a tool to create interactive graphics which then can be used on multiple platforms like Web, Mobile, Unity, Unreal Engine, etc etc.

Example of an interactive graphic:

Rive provides multiple features which can be used for creating interactive graphics.

Features include:

  1. State Machine
  2. Constraints
  3. Events
  4. Animation and Design tab
  5. and many more

In Rive using StateMachine, we can play different animations based on the conditions provided for the animation.

How to learn Rive?

Step 1: Watch the Rive101 Playlist provided by Rive

Playlist Link: https://www.youtube.com/playlist?list=PLujDTZWVDSsFGonP9kzAnvryowW098-p3

This playlist contains knowledge about all the features provided by Rive. After completing the playlist you will have enough confidence to start experimenting on your own.

Step 2: Replicate community files

Community link: https://rive.app/community/

One of the best ways to learn is to replicate already present examples on your own. Find a community file which looks easy to you and replicate it.

It's okay if the final result doesn't look exactly like the original one, we just have to replicate the feature, not the exact UI.

While replicating you will get lots of doubts about how a particular thing is done, in that case, you can look at how other creators have done the same thing.

Try replicating this file: link: https://rive.app/community/6413-12421-lil-guy/

You will require listeners and Inputs for this.

Step 3: Create and Share

Create a design of your own and share it on Social Media. And for inspiration do follow other creators who are using Rive.

Suggestions for the animation:

  1. Cursor tracking design
  2. Use of Slots feature
  3. Cool Buttons
  4. Body rig using bones
  5. Events use

Thanks for reading the article 🎉