mixamoを使ってアニメーションを追加する
次に、mixamoを使用して自分の好きなアニメーションを追加します。
mixamoとはAdobeが公開しているサイトで、3Dモデルに対して、様々なアニメーションを適用しダウンロードまでできるサービスです。
現在は、商用利用も可能であり、このサービスを使用してサンディーちゃんにアニメーションを追加します。
mixamoを使用するためにAdobeアカウントを作成します。
PlayCanvasからサンディちゃんの3Dモデルのデータをダウンロード
PlayCanvasのデータから3Dモデルのデータをダウンロードします。
Asset欄のmodel → sandy-chan → sandy-chan.fbxを選択します。
右のINSPECTORのSOURCE SCENE
にダウンロードボタン表示されますので、FBX形式の3Dモデルのデータをダウンロードします。
CONTENTSの中には、TextureとMaterialsのデータが表示されますがこちらがPlayCanvasへインポートした際に自動的に展開されるデータになります。
mixamoのアニメーションを使用
mixamoのアニメーションを使用して、3Dモデルにアニメーションを適用していきます。
mixiamoにアクセスをします。このとき、まだログインをしておらず、ログインが必要な場合には、ログイン画面が出ますので、作成したアカウントにてログインをしてください。
ログインが出来たら3Dモデルをインポートします。自作の3Dモデルをインポートする際にはUPLOAD CHARACTER
をクリックして3Dモデルをインポートしてください。
UPLOAD A CHARACTER
というモーダルが表示されますので、ここに先程ダウンロードしたサンディーちゃんのモデルをアップロードします。
アップロードをするとプログレスバーが出てきますので1~2分程待ちます。
このモデルは3Dモデルの構造をmixamoが解析をしてくれるため設定をしないで使用できますが、他のモデルを使用する場合には、モデルによっては、使用ができない場合や、ボーンの設定が必要になる場合があります。
モデルを正常にアップロードすることができると画面になります。
※ 何らかの理由でモデルのインポートが出来なかった場合には、PlayCanvasのプロジェクト内に予備
のフォルダがありますのでそちらのアニメーションを使用してください。
NEXTを押してアップロードを確認することが出来たら、mixamoへのモデルのインポートは完了です。
次にアニメーションをダウンロードしていきます。
まず手を降るアニメーションをダウンロードします。
左上の検索バーから「Waving
」と検索をします。
検索をすると様々なアニメーションが出てきますのでその中で、好きなアニメーションを選択して、右側のDOWNLOADボタンをクリックします。
ダウンロードボタンをクリックすると、DOWNLOAD SETTINGS
というモーダルが表示されますので、そこの設定として、Without Skin
を選択します。
今回はアニメーションを使用することが目的のため、Without Skin
としてFBX形式のアニメーションをダウンロードします。
今回作成するハンズオンでは、下記のアニメーションを再生するものを作ります。
なので事前に、3つのアニメーションもダウンロードしましょう。
入力装置 | アニメーション | リンク | |
---|---|---|---|
キーボード | 数字の1 | 手を降る | Waving |
キーボード | 数字の2 | バク転 | Backflip |
マウス | 画面上のボタンをクリック | ジャンプ | Joyful Jump |
手を降るアニメーションをダウンロードした方法でバク転
、ジャンプ
のアニメーションをダウンロードします。
PlayCanvasでアニメーションを再生する
アニメーションをダウンロードすることが出来たら、PlayCanvasでアニメーションを適用する方法を紹介します。
PlayCanvasにアニメーションをインポートする
PlayCanvasを開き、「Asset」 → 「model」 → 「sandy-chan」 → 「animation」を開きます。
ダウンロードしたアニメーション(手をふる、バク転、ジャンプ)それぞれドラックアンドドロップし、PlayCanvasにインポートします。
インポートをするとそれぞれPlayCanvas上に3つのファイルが生成されます。
今回3つFBXをアップロードした場合には9個のファイルが新規差作成されています。
アニメーションのためにインポートをしたFBXに関しては、生成された3つのファイルのうち、Type
がanimation
となっている.json
以外は削除をしても問題がありません
生成された9つのファイルのうち、animation
以外の不要なファイルを削除します。
更に扱いやすくするために、インポートをしたときに、アニメーションの名前を変更します。
ASSETSから、Backflip.jsonを選択し、INSPECTORのNameから、名前を変更します。
手をふる、バク転、ジャンプ3つのファイルのそれぞれの名前を変更します。
アニメーションをサンディちゃんに追加をする
アニメーションの名前を変更することが出来たら次に、サンディーちゃんにアニメーションを追加していきます。
現在サンディちゃんはidle
というアニメーションを持っていますが、これに加えて3つのアニメーションを追加します。
ヒエラルキーから、sandy-chan
を選択します。
サンディーちゃんを選択したら、ADD Assetsを選択してモデルにアニメーションを追加していきます。
ASSETSから、先程追加した3つのアニメーションを選択します。
3つアニメーションを選択したら、右側のINSPECTOR
のADD SECTION
をクリックします。
ADD SECTION
をクリックし、全てのアニメーションを追加できたらDONE
をクリックし、アニメーションをモデルに追加します。
アニメーションを再生する
アニメーションを再生するには、モデルに適用されている、Animation
コンポーネントの中にある。アニメーションの名前にマウスをホバーすると出てくる再生ボタンをクリックすることでアニメーションを確認することが出来ます。
ここで正しく4つのアニメーションを作成することができればアニメーションのインポートは完了です。
前
次
リンク
コメント
0件のコメント
サインインしてコメントを残してください。