アニメーションが誰でも簡単に、しかも無料で楽しめるというツール「Rive」が先日ローンチされました。
くま五郎
リョウ
このツールが広まったら、アニメーションを作る人が増えるんじゃないかと思ってるんですよね。
ということで、アニメーションツール「Rive」についてご紹介します。
アニメーションを作れる神ツール「Rive」

「百聞は一見に如かず」ということで、Rive で作られた動画を見てみると…
こんなのが、無料で作れてしまうんです。
基本的には誰でも使えるツール
Rive は、簡単な登録さえすれば誰でも無料で使えるツールです。
ただ、アニメーションを作るにはそれなりの知識と時間が必要ではあります。
例えば、
- SVG などが扱えること
- 英語が理解できること(日本語説明なし)
- 加工ツールなどを使ったことがあること
などがあった方が、アニメーション経験がなくてもスムーズに使えるようになると思います。
かく言う私もアニメーションなんて未経験でしたが、イラレなどを普段から使っているので、割とすぐに理解して作成することができました。
有料プランもある
Rive では、アニメーションを作るための機能はすべて無料。
オンライン上で作成できるツールなので、どんな PC を使っていても関係なく、ネット環境さえあれば誰でも使うことができます。
ただ、Rive では「有料プラン」も用意されています。
どういった内容なのかと言うと、
になります。
どういうことかと言うと、無料で使える Rive ではありますが、作った作品はすべて一覧に公開される状態になります。
そのため、作った作品をクライアントに渡す場合、別のプロジェクトで使う予定があるような場合には、「有料プラン」にして自分だけしか見れないようにした方が良いでしょう。

有料プランの金額は、年契約で168ドル(月額14ドル計算)、月契約の場合は21ドルでプランを使えます。
Rive の登録手順
基本的な機能はすべて無料なので、ひとまず登録して使ってみると楽しいと思います。
Rive に登録するには、まず公式サイトにアクセスしてください。
Rive 公式サイト:https://rive.app/
そしたら、「Sign In」もしくは「CREATE ACCOUNT」のボタンを押します。

すると登録画面が表示されるので、SNS 連携で登録するか、もしくはメールアドレスと名前を入力して登録します。

登録の時に、メルアドなどと同時にアイコンを登録もできます。(後でも可能です。)

「CREATE ACCOUNT」のボタンを押したら、「登録したアドレスにメールを送ったよ!」という画面が表示されるので、メールをチェックしてください。

すると、こんなメールが届いているはずなので、「CONFIRM」を押してください。

そして、この画面が表示されたら、登録は完了となります。

アカウントの詳細を設定する
登録が完了したら、さっそく Rive にログインしてみましょう。
そして、右上にアイコンが表示されているので、カーソルを持っていって「Account Setting」から詳細設定を行うことができます。

作品などを作ったら、いろんな人にアニメーションを見てもらえるようになります。
もしかすると自分のアニメーションに興味を持つ人がいるかもしれないので、SNS のリンクを表示させたり、ちょっとしたプロフィールを表示する設定をしておくと良いでしょう。

英語が苦手という人は、SNS のリンクだけでも設定しておけば、Rive を通じて繋がる人が増えるかもしれませんね。
Rive の基本的な使い方
Rive でアニメーションを作るための、基本的な使い方をちょっと紹介しておきます。
まずは、新規ファイルを作成する
アニメーションを作るには、まず「Your Files」から「New File」を選択します。

すると、「File Properties」というポップが出ますが、これは有料プランへの誘導なので、「Public(公開:無料)」にチェックを入れたまま「Save」を押します。

すると、新規でアニメーションを作成することができるようになります。
画像を変化させたり、骨組みを入れる
左下に「import」のボタンがあるので、使いたい画像がある場合にはここからアップロードします。
そして、その画像を回転させたり、大きさを変えたりができます。

また、画像ではなく図形を挿入したり、画像に骨組みを入れてアニメーションをよりスムーズに動くように設定することができます。
動きをつける場合
使う素材を選ぶ時には「DESIGN」のタグにして作業しますが、動きをつける作業の時には「ANIMATE」にタブを切り替えて作業をします。

基本的に、時系列を動かしながら画像を動かしていくと、自動でその動きを保存してくれるようになります。
削除したい場合
ファイルでもアニメーション作成時でも同じですが、対象のものをアクティブにしてから PC の delete ボタンを押せば削除できるようになっています。
試しに作ってみたけど削除したくなった場合は、シンプルにファイルを選択して delete を押せば OK です。。
さいごに
今回は Rive のご紹介ということなので、アニメーションの作り方についてはざっくりとしか紹介していないです。
アニメーションの作り方を紹介するとかなり長くなりそうなので、また次回にでも解説しようと思います。
アニメーションが無料で作成できて、しかも使いやすさも抜群ということなので、興味がある方はさっそく使ってみましょう。