見出し画像

アニメーションでオブジェクトを自由に動かしてみよう

こんにちは。メタバース好きの西出琉人です。記事も残すところ後2回となりました。まだまだ多くのギミックがCluster Creator Kitに内蔵されていますが、全て紹介できないのが残念です。
前回は特定のオブジェクトに対してプレイヤーが座ることのできるギミックを紹介しました。ワールドの雰囲気を上げるためにもおすすめな機能なので、是非とも使用してほしいと思います。
では、今回はオブジェクトにアニメーションを加えて動かしていきたいと思います。オブジェクトを動かすことが出来れば、より楽しいアスレチックとかも作れそうですよね。
今回は動く乗り物的なものを作ってみたいと思います。では早速やっていきましょう。

まずは、管理しやすくするために、アニメーションデータを格納しておくフォルダを作成します。Projectウィンドウから右クリック→Create→Folderを選択し、名前を「Animations」としておきましょう。

フォルダが作成出来たら、動かすオブジェクトをシーン上に追加しましょう。最近キューブ続きでつまらないので、たまには別のを用意します(笑)。
あと、色(テクスチャ)も最近デフォルトの白が続いていたので、変えていきたいと思います。別に変えなくてもいいやって人は読み飛ばしてください。
 
テクスチャを変更するためには、まず新規のマテリアルを追加しないといけません。マテリアルもアニメーション同様に管理しやすくするために、フォルダでまとめておきましょう。後々後悔しないためにも、何事にもフォルダでまとめておく癖を付けておくと良いです。私事ではありますが、私は作業が多くなるにつれて焦りがちな性格なので、ついついこの作業を忘れがちでよく後悔しています。
大規模なワールドになればなるほど多くのデータを管理することになります。「あのファイルどこいったっけ」ということにならないように、常にこの意識を持って頑張りましょう(私も頑張るぞ)。

話が脱線しました。
Projectウィンドウからフォルダを追加したら、名前を「Materials」としておきましょう。
Materialsフォルダの中で右クリック、Create、Materialと選択します。するとマテリアルが追加されるので、分かりやすい名前にしておきましょう。作成したマテリアルファイルを対象のオブジェクトにドラッグアンドドロップします。マテリアルを選択し、「Albedo」という項目から色を変更します。お好みで調節しましょう。すぐ下にある「Metalic」は金属の質感を加える設定であり、1に近ければ近いほど金属の材質になります。

では次に、アニメーションを追加していきます。先程作成したAnimationフォルダの中にアニメーションファイルを追加します。同様に右クリックからCreate、Animationとして追加しましょう。するとアニメーションファイルが追加されるので、分かりやすい名前にしておきましょう。
出来上がったら、マテリアル同様に、アニメーションファイルを対象となるオブジェクトにドラッグアンドドロップします。すると、アニメーションコントローラーというものが自動で追加されると思います。これはアニメーションを起動する流れやタイミングなどを決められる機能を持ちますが、今回は常に動かしていたいので特にいじりません。しかし、これが無いとアニメーションが再生されなくなってしまうので、消さないようにしてください。

アニメーションファイルをダブルクリックしてエディター画面を開きます。基本的にこの画面でアニメーションを作成していくという感じです。エディター画面を開いたら、先程ドラッグアンドドロップしたオブジェクトを選択すると編集できるようになるので、「Add Property」を選択します。すると様々な項目が出てくると思いますが、今回は位置だけを動かしたいので、TransformのPositionを追加します。

まずは編集する前に、キーフレームについて説明します。
キーフレームとは、アニメーションの開始と終了のマーカーのことであり、開始から終了地点に向かって徐々にトランジションが行われていきます。例えば、開始のX座標は「-3」で、アニメーション開始1秒後にはX座標を「10」にしたいとします。開始の0フレームのX軸の値を「-3」にし、60フレーム(1秒後)にX軸のキーフレームを追加し、そのキーフレームのX座標の値を10にします。アニメーションを再生すると、60フレームにはX座標が10になるようにオブジェクトが動いてくれます。座標は同じでいいけど、オブジェクトの進む速度を遅くしたい時は、キーフレームを更に先に移動させればOKです。ちょっと複雑で慣れるまで時間がかかるかもしれませんが、アニメーションはこのように作成していきます。
 
では、これを駆使して1周するアニメーションを作ります。

キーフレームはこのような感じで打ち込み、値を変化させました。

忘れていましたが、ProjectウィンドウからAnimationsフォルダ、アニメーションファイルを選択し、InspectorウィンドウにあるLoop Timeにチェックを入れましょう。入っていないと、一回だけの再生で終了してしまいます。

アニメーションが完成したので、今度は動くオブジェクトに座れる仕組みを入れていきたいと思います。前回の振り返りです。アニメーションを加えたオブジェクトを選択し、Add ComponentからRidable Itemを追加します。前回同様、Sit Positionを作成してRidable Itemに割り当てましょう。
 
これでアニメーションと座る設定が出来たはずなので、Clusterにアップロードして確認しましょう。今回は1フレームずつアニメーションを読み込んでいるので、あまりにもフレーム数が多い場合は、アップロードに時間がかかる可能性があります。

ちょっとアニメーションミスって乗り物に乗るのに苦戦しました(笑)。
ですが、画像では伝わらないですが、無事にアニメーションもCluster側に反映できています。
 
 
いかがでしたでしょうか。キーフレームという概念は、動画制作や3DCGに触れたことのある方なら分かるかもしれませんが、アニメーション初心者の方にはハードであったかもしれません。次回で最終回ですが、次回はこれまでの10回に渡ってやってきたことを振り返り、活用しながらワールドを作りたいと思います。