【ZEPETO】ZEPETOのワールドで、iOS・Android環境でテストをする方法【Unity】
本記事はZEPETOでワールドをアップロードし、テストまで行った方向き及びAndroidユーザーのテスター向けの記事となります。
ワールドクリエイターのたぬ(ZEPETOID:tanuh)です。
ZEPETOでUnityワールドを作成する際に、審査する前にテストワールドをアップして実機でチェックしなければなりません。
また、ZEPETOでのモバイル実機でのワールドテスト環境に困っているという方が何名もいらっしゃったこと、Androidの方にテスターをしてもらう際に困っていたので記事にしました。
ZEPETO Studio
「テスト接続リンクをコピーする」をクリックするとクリップボードに、
[zepeto://gamesystem/pretest/~~~~~~~~~~]のURIがコピーされます。
ZEPETO内のDMで送るとURIが有効になり、下線が引かれておりテストワールドに入ることができます。
しかし、Android環境では現状有効になりません(2022/12/06現在)。また、iOS端末でもDMをわざわざ送るのは面倒です。
まとめますと、
という問題があります。
ではどのように対応すればよいでしょうか。
1.URIを扱えるアプリで起動させる。
iOS「DeepLink Executor DeepLink Executor」を使用。
アプリストアからインストールして下記のように、
Testの□内に、先程の「zepeto:」のURIをコピーして、貼り付けます。
「done」を押すとZEPETOが起動して、テストワールドに入室できます。
なお、ZEPETOで作業中である場合はワールドに強制的に入室するので注意が必要です。
ほかの方を入室したい場合はテスター登録をしてください。
公式ガイドページ「ワールドをテストする」を参照してください。
Androidアプリ「Deep Link TesterDeep Link Tester」を使用。
インストールして、起動します。
「test:~」の部分をコピーした「zepeto:」に書き換えます。
「GO TO URI」をタップするとZEPETOアプリが起動して、ワールドに入室します。
なお、ZEPETOで作業中である場合はワールドに強制的に入室するので注意が必要です。
ほかの方を入室したい場合はテスター登録をしてください。
公式ガイドページ「ワールドをテストする」を参照してください。
2.iOS端末の人に招待してもらう
非常に面倒ですが、iOSでDMでどなたかが入室し、ワールド内から招待することで、Android端末の方でも入室することができます。
ただし、テスター登録がないと入室ができませんので、事前にテスター登録をするようにしておきましょう。
おわりに
以上、テスト環境を快適する方法、iOS端末でもAndroid端末でもテストする方法になります。
ワールドで公開する際に複数デバイスでの確認は必要になってきますので、必ずするようにしましょう。
ほか、Unity初心者向けでUdemyでワールド制作講座を発売してますので、ぜひご覧いただければと思います。
Twitterでいろいろ呟いてます。
では。
【Unity】ClusterでVroidモデル等のスカートが飛び出る方法を防ぐ方法
はじめに
はじめまして、Unityでアニメとか色々作ったりしてるたぬです。
ClusterはQuest2に対応したり、アバター制限解除したりとすごい発展してますね。
アバターの「座る」という動作も導入されており、VroidStudioからすぐに出力したものでは、きちんと設定してなければ下図のようにスカートが盛り上がってしまい、恥ずかしかったり、はしたない思いをすることになってしまいますね。
今回は特にアセットを追加せずにUnityのみで、修正する方法をご紹介したいと思います。
- はじめに
- 解決方法
- 前提
- Unityで編集したいモデルをドラッグアンドドロップする
- SpringBoneの設定を開く
- 再生中の値をそのまま維持する方法
- 「Collider」の「ColliderGroups」を見てみる
- 「Collider」の追加の仕方
- VRMでエクスポートする
- 追加編 足までコライダーをいれる
- コライダーリストに追加する
- 追記 参考値など
- おわりに
- 使わせていただいた衣装
解決方法
スカートをコライダーで挟む方法です。
ほかにも色々手段がありますが、今回はこの方法を紹介いたします。
前提
本画面はUnity2020.3.23です。
UnityですでにVRMモデルなどを導入されたことがある方向けに書かせていただきます。
VRMモデルの導入の仕方は、
に記載してありますので、ご覧ください。
なお、今回はUniVRM v0.61.1 をUnityに導入しておきます。
上記の記事で導入しているUniVRM v0.66でも動作はしておりますが、Cluster公式の見解は次の通りです。
Unityで編集したいモデルをドラッグアンドドロップする
SpringBoneの設定を開く
VroidモデルのSpringBoneの設定はモデルのPrefabsの「secondary」にありますので、それを開きます。
パラメータについて、VirtualCast様より引用
Stiffness Force
剛性です。もとに戻る強さを設定します。
Gravity Power
重力の強さです。
Gravity Dir
重力の力の向きを設定します。
Drag Force
抵抗です。強くすれば動きが鈍くなり、弱くすれば軽くなります。
※簡単な修正な仕方として、Gravity Powerをあげるだけである程度修正もできます。
どんな状態か確認してみましょう。
「DrawGizmo」にチェックをいれておきます。
再生ボタンを押します。
「Collider」のHitRadiusのスライダー動かしてみましょう。下図のように大きさがかわります。このサイズも適宜変更しましょう。
ほかのパラメータも弄ることで、動作を確認できますので、適宜確認してきましょう。
※黄色の球が出現しない方は、「DrawGizmo」にチェックをいれておきましょう。
一度再生をやめましょう。
再生中の値をそのまま維持する方法
通常、再生中にコンポーネント等の値を変更し、停止すると再生前の値にもどります。
毎回メモ等するのは面倒ですので、一つのコンポーネントだけの値をコピーする方法をメモしておきます。
なお、アセットやスクリプトを導入し、エディター拡張をすることで、再生中の値を維持したりすることができます。
また、Unityのバージョンごとで操作や出てくるウィンドウなどに差異がありますので、ご注意ください。
本画面はUnity2020.3.23です。
再生中に維持したい値が設定できたら、「VRM SpringBone」の赤点のあたりを右クリックし、「Copy Component」をクリックします。
動画
次に停止し、
値が元に戻ってることを確認します。
「Paste Component Values」をクリックします。コンポーネントの値だけをペーストします。
以上で、再生中の値をペーストすることができます。
「Collider」の「ColliderGroups」を見てみる
「Collider」の「ColliderGroups」のElement0を選択し、「J_Bip_L_UpperLeg」をクリックして、開いてみましょう。
「J_Bip_L_UpperLeg」の「VRM SpringBoneColliderGroup」には、左腿のに3つのピンク球が設置してあります。
これが「Collider」で、スカートと接触の判定を行っており、めり込みを防止しています。この「Collider」がスカートを突き抜けるとスカートから足が飛び出たり、パンツが見えたり色々まずいことが起きてしまいます。
逆にこのコライダーを綺麗に設置できれば貫通を防止できるわけです。
今回は座った際にスカートが飛び出る、浮かぶのを防止したいので、スカートを「Collider」で挟みます。
「Collider」の追加の仕方
「Element2」をクリックして、下の「+」マークをクリックします。そうすると「Element2」が複製されます。複製されたものが。「Element3」となります。
一つでも一応効果がありますが、しっかりと止めておきたいので、
3つ追加しておきます。
同様に右腿も追加します。
VRMでエクスポートする
ヒエラルキー上でモデルを選択し、上のメニューからエクスポートします。
問題なければ次のように表示されます。エクスポートをクリックしてください。
今回のコライダーの入れ方では、スカートの後ろ部分にコライダーを追加していないため、上図のように椅子につきぬけてしまいます。
コライダーをいれ過ぎるとスカートのひらひら感がなくなってしまうのでほどよく、好みで入れるとよいと思います。
スカートの後ろ側をコライダーで挟んだり…と解決法は色々あると思いますので、ぜひ色々試行錯誤してください。
追加編 足までコライダーをいれる
ヒエラルキー上からモデルの「J_Bip_L_LowerLeg」を選択します。
「AddComponent」をクリックして、「VRM SpringBoneColliderGroup」を追加します。
コライダーが追加されます。前回と同じように、「+」をクリックしていきます。
アバターのサイズに準じて、コライダーを追加してください。
ちなみに、私のアバターの「柳橋さん」は身長が140cmちょっとです。
右膝にも追加します。
面倒なので、コピーしてやります。
「VRM SpringBoneColliderGroup」の右端にある「三」をクリックして、「CopyComponent」をクリックします。
次に、ヒエラルキー上から「J_Bip_R_LowerLeg」をクリックし、赤点のある部分で右クリックをし、「PasteComponentAs New」をクリックします。
動画
コライダーリストに追加する
これで終了ではありません。作成したコライダーをSkirtのコライダーリストに追加しないと、判定をしてくれません。
初期設定では、上記のとおり、Upper_legの二つしかありません。「+」を2回押して、
先ほど作成した「J_Bip_L_LowerLeg」「J_Bip_R_LowerLeg」をリストに追加しましょう。
追記 参考値など
アバターの体型、スカートの形状で大きくことなりますが、参考までに私の設定した値などを記載しておきます。
通常座り
足組
寝ている状態
コライダーの入れた状態 厳密にいれてません。
おわりに
お読みいただきありがとうございました。
SpringBoneを色々工夫することで様々な表現ができるようになります。
スカートの動きだけではなく、髪の貫通防止などもありますので、ぜひチャレンジしていただきたいと思います。
皆様の快適で素敵なClusterライフをお送りいただけるように願っております。
私はUnity等を作って、自主制作アニメ「おかえりの柳橋さん」や色々な作品をTwitterやYoutubeで発信しておりますので、こちらも見て頂ければ幸いです。
使わせていただいた衣装
クレイスSHOP様
【Unity】ノーコードでTimelineとCinemachineでVroidモデルを動かしてアニメーション作ろう!
本記事を読んで作れる作例です
「Unity アセット真夏のアドベントカレンダー 2021 Summer!」 20日目の記事です。
※2022年1月24日修正
19日目はゆーじさんの「DOTweenProで文字テキストのアニメーション【TextMeshPro】」です。
21日目はxrdnk さんの「Feel を使ってみよう【Unityアセット真夏のアドカレ】 - デニッキ!」です。
はじめに
はじめまして、Unity等を使って自主制作アニメーションをしている、たぬと申します。
本記事はノーコードでVroidモデル等を動かし、カメラを設置してアニメーションを作成する方法を紹介します。
なお、プロジェクト作成、武器、エフェクトまでは、
前回までをご覧ください。
- はじめに
- アセット導入等の下準備
- Timelineを使って動かしてみよう
- Cinemachineでカメラを設置してみよう
- 録画前の仕上げ
- 背景の変更
- PostProcessとAnti-aliasing
- Recoderで撮影する
- おわりに
本記事では次のとおりの環境下で行います。
※Unity初級者向けを想定しております。
- Unity 2019.4.16
- Mesh Effects 1.4.1(必須ではないが、エフェクトを導入したい方は導入してください。また武器に関してもMeshEffectsに入っているものを今回は使用します。詳しくは前回の記事をご覧ください。)
- UniVRM-0.66.0_39d5(Vroidモデルを使用する場合)
- Post Processing Stack 3.0.3
- Recorder 3.0.1
- Cinemacine 2.6.9
- Timeline 1.2.17
- Default Playables 1.8
- Melee Warrior Animations(※あるいはお好きなモーションパック)
- All Sky (※Skybox、背景を変更したい方)
「笑門来福メガバンドル」のご紹介
2022年1月24日より「笑門来福メガバンドル」が開催されております。
本記事では「Roaringバンドル」に入っている「Melee Warrior Animations」を使用してます。
単品で約25ドルしますが、メガバンドルで購入すると、「Melee Warrior Animations」も含まれて、43.99ドルで色々なアセットが入ってるのでとてもお得です。
アセット一覧
本記事で使うアセットを紹介してまいりたいと思います。
リッチなエフェクトが簡単に実装できる「MeshEffects」
前回の記事でも紹介させていただきましたが、リッチなエフェクトが簡単に実装できてしまう、素晴らしいアセットです。
片手剣から両手剣、そして二刀流のモーションが入ってる「Melee Warrior Animations」
試してみたい方は無料版を導入してみてください。本記事では、有料版を使い説明させていただきます。なお、冒頭でもご説明しておりますが、「笑門来福メガバンドル」を購入した方がお安いです。
一発で背景(Skybox)が変えれる「Allsky」
かっこいい夜空の下で炎の剣を振り回したい!そんな方におすすなのが、
Skyboxを多種多様に変えられるすごい便利なアセットが「Allsky」です。
よくわからないという方はこれもFree版がありますので試してみてください。
アセット導入等の下準備
というわけで、下準備をしてまいりましょう。「Timeline」はすでに導入されているので、「Cinemachine」を導入します。
他のUnityのバージョンをお使いの方はPackageManagerの方から導入してください。
1.「Window」→「PackageManager」を選択します。
2.左上の部分がUnityRegistryになっていることを確認し、検索タブに.「Cine」と入力し、「Cinemachine」を「Import」します。
3.Importが完了したら、PackageManagerを閉じて、次にアセットを導入します。
「AssetStore」を開いて、検索してください。導入するものは、
「Default Playables」
Timelineを拡張するアセットです。
「Melee Warrior Animations」
モーションパックです。
※手持ちのモーションパックまたは自作したい方などは省略してください。
なお、無料でお試ししたい方は、
を導入をおすすめします。
「Import」します。
「Prefabs>Vroid」というフォルダを作成します。
ヒエラルキーにある「YB_Gospan」を作ったフォルダーにドラッグアンドドロップします。
OrigunalPrefabかPrefabVariantを作りますか?と聞かれてますので、今回は「PrefabVariant」を選択します。
※Prefabについては下記をご参考ください。
「YB_Gospan Variant」が生成されます。
シーンを作る
「File→NewScene」でシーンを作ります。
「YB_Gospan Variant」をヒエラルキーにドラッグアンドドロップします。
(Vroidの導入、武器の導入の仕方は前回の記事をごらんください。)
そして、再生します。シーンビューで寄っていくとこのようなかたちで表示されます。
一旦、この状態でシーンをセーブをしましょう(Ctrl+S)。
3.「Timeline」を表示させます。
「Window」→「Sequencing」→「Timeline」
このように表示されます。ちょっとやりづらいので移動させます。
「Timeline」のタブをUnity全体の下のあたりにドラッグアンドドロップします。
このようなレイアウトにします。
5.次に「Melee Warrior Animations」のデモシーンを確認します。
「Assets>Kevin Iglesias>Melee Warrior Animations」の「Melee Warrior - Demo Scene」を開きます。
※FREE版では異なる部分があります。
かっこいいモーションがいっぱいありますね。デモシーンの一覧を見て、どんなアニメーションを作りたいかぜひ考えておいてください。
とりあえず一つを確認して、どこになにが格納されているか確認しておきましょう。
一番左奥の連続で切っている奴が使い勝手が良さそうです。
上記の画像のようにヒエラルキー上の「Attacks」を選択し、インスペクター上の「Animator」の「Controller」の「2H@Attacks」をダブルクリックしてみましょう。
そうすると、上記のようにAnimatorWindowが開かれ、「Attack01」~「Attack04」まで遷移していることがわかりました。
このように気になるモーションはチェックし、メモでもしておきましょう。
6.次にTimelineの保存用のフォルダーを作っておきます。
7.ヒエラルキー上で右クリック→「CreateEmpty」を選択します。
「GameObject」が作成されるので、「SwordAttacksTimeline」と名前を変更しておきます。
変更後、ヒエラルキー上の「SwordAttacksTimeline」を選択した状態で、画面下部のTimelineWindowにて、「Create」をクリックします。
保存先を尋ねられますので、先ほど作った「Timeline」のフォルダに任意の名前をつけて保存をしておきましょう。
このように、シーケンサーが表示されます。
以上が下準備となります。
Timelineを使って動かしてみよう
さっそくTimelineでモデルを動かしていきたいと思います。「SwordAttacksTimeline」を選択し、Timeline上のいらないものを削除します。下記のように選択して、右クリックをして、「Delete」を選択してください。
ヒエラルキー上の「SwordAttacksTimeline」選択しながら、「YB_Gospan Variant」をTimeline上にドラッグアンドドロップして、「AddAnimationTrack」を選択します。
次にAnimationClipを追加します。
プロジェクトの中から、
「Assets\Kevin Iglesias\Melee Warrior Animations\Animations\TwoHandedLong」の中の「2HLong@Attack01」の「2HLong@Attack01」AnimationClipを選択します。
※AnimationClipは「三▲」のような水色アイコンがついているものです。
インスペクターに右部に次のように表示されているのを確認してください。
FPSが30であることを確認してください。
違った場合でも動作しないこともないですが、Timeline上でずれや支障を来たす場合があります。
※なお、Mixamo等のモーションサイトやBlenderから経由してBVH等をFBX形式でモーションを導入する場合も、Blender上でFPS30にして導入することをお勧めします。
確認ができましたら、
「2HLong@Attack01」のAnimationClipを「YB_Gospan Variant」トラックの上にドラッグアンドドロップして、クリップを左につめます。
そして、再生キーを押します(あるいはスペースキー)で動くことをシーン上で確認してください。
続いて何個かのアニメーションクリップを追加していきます。
お好きなもの足していってください。TwoHand以外でもOneHandでもかっこいいものがいっぱいあります。
ひとまず、私は以下の構成したいと思います。
以下の画像をご覧ください。
前回の記事では、ワンハンドを想定していたものだったため、ツーハンドの武器のモーションでは、ズレが生じます。
こういった問題は早めに解決します。
様々な修正方法がありますが、Timeline上で解決していきたいと思います。
ヒエラルキー上で「Dragon」と入力し、「Dragonblade」を見つけ出します。そしてTimeline上にドラッグアンドドロップして、「AddAnimationTrack」を選択します。
シークバーが一番左端にあり、0になっていることをしっかり確認しておいてください。
ここの数字の「0」は現在のフレーム数を表しています。シークバーと連動しており、この位置がGameWindowとシーンビューを表示します。
次にTimeline上の「Dragonblade」トラックを選択し、
①赤い●録画ボタンをクリックします。上記のように、シークバーが左端にあり、0が表示されていることを確認してください。
②その後にトラック上の「Dragonblade」をクリックすると、
③ヒエラルキー上の「Dragonblade」が反応しますので、クリックして、インスペクター上の「Dragonblade」録画状態がなります。この位置を変えたりすると反映されるようになります。
動画ではこのようになります。
ここから微調整をしていきます。
Timeline上での剣(オブジェクト)の微調整
剣のサイズが小さいので大きくし(ScaleのXYZを1.1に変更)、
剣の下の丸い部分に右手が来るようにします。左手も持てるようにします。
再度、Timeline上の「Dragonblade」トラックを選択し、①赤い●録画ボタンをクリックし録画を終了します。録画が終わると、トラックの赤色が消えます。
シークバーを動かしてみましょう。
問題なさそうですが、重大な設定を忘れておりますので、設定をします。
TimelineのFrameRateの設定
プロジェクト上から保存したTimelineをインスペクター上に表示させます。
そうするとFrameRateが「60」になっています。AnimationClipのが
「30」で、TimelineのFrameRateが「60」だと不一致を起こし、問題が起こりますので、「30」に変更します。
60と30では、このように総フレーム数が半分になります。
FPS、FrameRateってなんなの?って具体的な説明は割愛させていただきますが、ひとまず一致させてください。
修正しておかないとErrorが出る可能性があります。
FPSなどにご興味のある方は、下記をご覧ください。
なお、録画時に「Recoder」で、録画のFPSを変更することもできます。
AnimationClipとTimeline上での編集の仕方
さて、その場にいても面白くないので、せっかくなので疾走してから切る動作、同じ切るモーションも少し変えてみたいですね。
邪魔なトラックは右に寄せておきまして、
「Assets\Kevin Iglesias\Melee Warrior Animations\Animations\TwoHandedLong\Movement」から「2HLong@Sprint01 - Forward」 と「2HLong@Sprint01 - Forward [RM]」をトラック上にドラッグアンドドロップしてみて再生してみましょう。
※多くのモーションアセットに歩く走る等のモーションにはRootMotionありなしのものが同封されていますので、その都度、演出したいものを選んでください。
このRMとはRootMotionを意味します。
詳しいことは下記にあります。
最初がRMなし、次RMありです。
RMなしは、その場で走っており、移動する距離を自分で設定しなければならない。
RMありは、その場から走って一定量を移動している。
つまり、RootMotionがあるものはAnimationClipに移動の距離が記録されており、それが再生されます。
よりわかりやすくするために並べてみましょう。
Timeline上の「YB_Gospan Variant」を選び、Dupulicateを選択します(Ctrl+D)。
次に、
①ヒエラルキー上の「YB_Gospan Variant」を選び、Ctrl+Dを押して、複製します。
②「YB_Gospan Variant (1)」が作成されます。
③Timeline上の3段目のところに「YB_Gospan Variant (1)」をドラッグアンドドロップします。次に、「2HLong@Sprint01 - Forward」のAnimationClipをクリックして、インスペクター上に表示させます。
最後に「✙」をクリックしてみてください。シーンビュー上に下記のように表示されます。そして、PositionをX軸に移動させて、再生させてみます。
そうすると、最初のモーションだけ、X軸に「0.9」移動していたのに、戻ってしまいました。
これは、次のAnimationClipで、再び「ClipTransformOffsets」の値がゼロになっているからです。
AnimationClip上で右クリックをして、「Match Offsets To Previous Clip」を選択すると、前の座標を引き継いで動作をしてくれます。
上記のTimeline上では、
「Match Offsets To Next Clip」を選択すると、選択しているClipの次のAnimationClipのPosition「0,0,0」を引き継いでしまうので、XYZの値は「0」になります。
詳しくは下記にマニュアルがあります。
面倒なので、一括して「Match Offsets To Previous Clip」を選択します。
再生すると次のとおり最初のアニメーションクリップのX「0.9...」を引き継いだモーションになっていきます。
「Match Offsets To Previous Clip」をしていない1トラック目は、3クリップ目(Attack01)で原点に戻ってしまいますが、
「Match Offsets To Previous Clip」をした2トラック目は、Positionを引き継いでいます。
これで、一個一個の前のクリップの位置を微調整しなくても済む場合が多くなります。
さて、「Attack01」をもう少し素早い動きにしたいですね。
しかも二回ぐらい突いてみたいと思います。
トラック上の「2HLong@Attack01」を選択し、インスペクター上でSpeedMultiplierを「2」にすると、AnimationClipの再生速度が2倍になります。そして、そのClipを右クリックでDuplicateをして、Clipを並べてみましょう。
このように、2段突きが可能となりました。
個々のSpeedMultiplierを変更していくことで、メリハリのある攻撃が作ることができます。また、同じAnimationClipを違うものに見せていくこともできます。
SpeedMultiplierの値を「0.5」などにするとスローになりますので、ぜひ試してみてください。
では、この時点で一度再生してみましょう。
AnimatorのController
Effectもあって良い感じですが、すべてのClipが再生し終わったあとになんだか見覚えのあるモーションをしています。
※前回の記事の設定をしてない方はすっ飛ばしていただいて、インスペクター上のモデルのAnimatorのControllerを「None」にしてください。
犯人は、AnimatorのControllerの「Anim3」です。
そこに、AnimationClipファイルである「SwordRotating 1」がTimelineの再生が終わった後に再生されてますので、クリックして、Deleteキーで消して「None」にしておきましょう。
シーンビュー上ではよいですが、肝心なGameWindowではすごく遠いですし、
映したいものを写せてないです。
そのために、Cinemachineの設定して、かっこよく撮っていきたいと思います。
※なお、RootMotionの詳しい内容は下記をご覧ください。
Cinemachineでカメラを設置してみよう
Cinemachineとは?
簡単に言うと、すっごい便利で多機能なカメラです。
では、さっそく設置してまいりましょう。
シーンビューの位置をモデルが正面からきっちり入る感じにしておきます。
なぜなら、その”位置、方向”にカメラが設置されるからです。
上のメニューから、「Cinemachine>CreateVirtualCamera」を選択します。
と上記のように、「CM vcam1」が追加されます。インスペクターをみると、「CinemachineVirtualCamera」というコンポーネントが追加されています。
また、シーンビューでも赤い枠が表示されています。
GameWindowにも変化がでています。遠目にはわかりづらいですが、背中を写していたものが、「CM vcam1」に写しているものを写すようになり、モデルが正面を向いています。
次に、ヒエラルキー上の「MainCamera」を確認にしましょう。
「Cinemachine」から「CM vcam1」のようなカメラを追加していくと自動的に「MainCamera」に「CinemachineBrain」が追加されます。
※Brain、脳という名前のとおり、関連づいた「Cinemachine」オブジェクトを制御するコンポーネントです。大きな設定はここで行います。しっかりと把握されたい方は下記をご覧ください。
ヒエラルキー上で「SwordAttacksTimeline」を選択して、Timelineを表示させ、Timeline上の空いてるところで右クリックをし、「Cinemachine Track」を選択します。
赤色のChinemachineTrackが追加されますので、そこにヒエラルキー上から「CM vcam1」をドラッグアンドドロップして、左に詰めておきます。
次にヒエラルキー上のMainCameraを、Timeline上のCinemachineTrackの「None」のところにドラッグアンドドロップします。
ここの部分が「None」だと反映されません。
なお、複数のカメラを管理する時はよくここが「None」になってる場合がありますので、チェックしてください。
では、一度再生してみましょう。
正面の位置で再生されていますね。
ずれていてもあとで調整できますので気にせず進みましょう。
再生中でも保存する機能「SaveDuringPlay」
インスペクター上にある「CM vcam1」の上の「SaveDuringPlay」にチェックが入っていることを確認してください。
これにチェックがあることで、再生中のカメラの変更が保存されます。
では実際に試してみましょう。
再生したら、Timeline上の「CMvcam1」クリップをクリックしましょう。
そして、細かな項目を調整していきましょう。
Field Of View(視野角)
インスペクター上にある「Lens」のField Of View(視野角)、以下FOVを「60」から「19」にします。そうすると、一気に近づいたように見えます。
カメラ自体は近づいてはいないのですが、FOVの数値を下げると近づいたように見え、上げると遠くに見えます。
具体的には下記をご覧ください。
一度再生を止めてみましょう。
変更されたFOVの値が「19」で保存されています。
また、再生をしてみましょう。次にカメラの位置を変えてみましょう。
PositionとRotation
PositionのXYZをそれぞれ移動させてみましょう。
カメラのPositionとRotationを再生中に好きに変えることができます。
次にRotationです。
基本的にPosition、Rotation、FOVを抑えておけば、カメラの設置には困らないと思います。
最初にカメラの位置がずれてしまった方はだいたいの位置をあわせておくとよいでしょう。
では次にカメラを増やしたいと思います。
カメラの複数設置とBlendについて
せっかくなので疾走している姿を撮影したいと思います。
正面からではわかりづらいですね。
一度再生は止めておきます。
Timeline上のシークバーを、走っているAnimationClipのところに移動させておきます。
その状態で、シーンビューで横から見えるようにしておきましょう。設置してある「CM vcam1」が横から見えるはずです。
上のメニューから、「Cinemachine>CreateVirtualCamera」を選択します。新たに「CMvcam2」が設置されます。シーンビューに上記のようにカメラの四角形の枠が表示されれば成功になります。
ヒエラルキー上のTimelineを選択してみると以前と変わっていません。
なぜならCinemachineトラックに「CMvcam2」をクリップとして追加してないからです。
そのため、次の操作をします。
CinemachineTrackの「CMvcam1」を選択して、クリップを左に寄せて縮めます。そして、ヒエラルキー上の「CMvcam2」をCinemachineTrackトラックにドラッグして走っている分だけ縮めます。
走っている様子がよくわかるようになりました。
では、次に切るモーションの時に、左のモデルの顔が切れているのが残念ですので、もう一つカメラを追加していきます。
ちょうど、「CMvcam1」が近くにあるので利用しましょう。
ヒエラルキー上の「CMvcam1」を選択して、Ctrl+Dで複製します。「CMvcam1(1)」が生成されます。
次に、Timelineを選択して、「CMvcam1(1)」をCinemachineTrackにドラッグアンドドロップします。
一度再生してみましょう。
このようになっており、同じカメラを複製しているのでクリップを追加しても切れたままです(※静止画です)。
カメラの微調整を行っていきます。
ひとまずPositionこのように修正しておきます。
Timeline上で再生してみましょう。
いいかんじになってきましたね。
ちょっとキャラクターの表情が最後見えないのが残念です。
そういうときに役に立つのがBlendです。
Blend
ではTimelineおよびCinemachineの魅力的な機能、Blendについて説明してまいりたいとおもいます。
公式の説明は以下をご覧ください。
次のようにします。
ヒエラルキー上の「CMvcam1(1)」を選択して、Ctrl+Dで複製します。「CMvcam1(2)」が生成されます。
次に、Timelineを選択して、新しくできた「CMvcam1(2)」をCinemachineTrackにドラッグアンドドロップします。
では、再生して調整してまいりましょう。
「CMvcam1(2)」をコピーしただけなので、特に変化はありません。
下記のようにPositionを変更して、近づいてみます。
Timeline上でよくするミス
私がTimelineの編集中よくするミスですが、
シークバーの位置と選択されているクリップが一致しておらず、ほかのクリップの数値を変更して、大変な目にあいます。
おそらく、これから作業に入る方にはなにを言っているのかわからないかと思いますが、
シークバーの位置がそのままGameWindowおよびシーンビューに反映されますが、Timeline上の選択しているクリップのインスペクター上で見ているものは必ずしも一致しません。
具体的には下記のとおりに、シークバーは16にあり、GameWindow、シーンビュー共に16のカメラとモーションを出力しています。しかし、Timeline上のClipは「2H~」を選択しており、編集できてしましますので、ご注意ください。
Blendの比較
では、Blend前のものを見ましょう。
Blendします。
Blendの仕方は下記のとおりに、BlendしたいClipを選択し左か右に伸ばしてどこまでBlendするか編集していきます。
では、再生してみましょう。
シーンビューも共に見ながら見てください。
二つのカメラの情報がBlendされています。
具体的には、
TransformのPositionが上記のようにXYZが移動し、カメラが切り替わるようになっています。このBlendをうまく使うことで様々な画角を作り出すことができます。
せっかくなので、Cinemachineの素晴らしい機能を紹介したいと思います。
ブレを作り出す「Basic Multi Channel Perlin」
選択したインスペクター上のNoise から Basic Multi Channel Perlin を選択してください。
手ぶれ機能や揺れや衝撃を再現するものです。
「6D‗Shake」
「Handheld_normal_mild」
6種類ほどのプリセットがあり、自分でも独自のプロファイルが作れますので、細かく設定したい方は作ってください。今回は「Handheld_normal_mild」を使用してみます。
では、ここまできたものを再生してみましょう。
良い感じになってきました。そのほかCinemachineの機能にはLookAt等便利な機能もありますので、ご興味のある方は下記をご参照ください
録画前の仕上げ
さて、だいたいかたちになってきましたが、ここから録画前の仕上げしていきたいと思います。
まず、二人いるモデルを一人にしましょう。
無くしたいトラック上で右クリック、「M」のMuteを選択し、再生されないようにします。そうすることで、再生されないようにできます。
失敗したと思ったBlendやクリップの組み合わせでも後から考えるとよかったな~と思うことがありますので、一度トラックごと複製しておいて保存してミュートしておいてもよいでしょう。
ミュートにしても、モデルは消えません。なぜならヒエラルキー上のモデルは残っていますので、モデルの表示を消しましょう。
「YB_Gospan Variant」のチェックを外し、「YB_Gospan Variant(1)」のみを表示します。
では再生して確認してみましょう。
一人になったことですっきりしましたね。
しかしせっかくのエフェクトがあるのに、明るいのは残念です。
背景の変更
背景を暗くする方法
Skyboxを使わずに暗くしたいという方は次のことをしてください。
ヒエラルキー上の「MainCamera」から「Camera」のコンポーネントの「ClearFlags」を「SolidColor」に、変更します。
「ClearFlags」の下にある「Background」をお好きなの色に変更してください。ひとまず真っ黒にしましょう。
再生しましょう。
いい感じになってきましたが、なにか忘れていませんか?
アンチエイリアスの設定とポストプロセスを導入しておりません。
では、導入していきましょう。
なお、Skyboxを変更するつもりがない方は次項を飛ばしてください。
Skyboxを変更する
かっこいい夜空の下で炎の剣を振り回したい!
そんなあなたに、11ドルでSkyboxが200種類以上。簡単に風景が変えられるすごい便利な「Allsky」です。
Free版もありますのでぜひ試してみてください。
AssetStoreから「AllSky」を「Import」します。なお、AllSky+200の場合は約3.9Gありますので、休憩でも取ってお待ちくださいね。
「Window」→「Rendering」→「Lighting Setting」
お好きなのをお選びください。
MainCameraの「ClearFlags」が「Skybox」になっていることを確認してくださいね。
PostProcessとAnti-aliasing
ポストプロセスを導入されてない方は前回の記事をご覧ください。PackageManagerから導入できます。
「AddComponent」で「Post」と入力し「Post-processLayer」を追加し、
①「Layer」に「Default」を一時的に設定します。
②「Anti-Aliasing」に「SMAA」を設定します。
スペックや状況に応じて設定してください。スペックが低い場合は「FXAA」をおすすめします。
それぞれの設定は下記のとおりになっています。
- Fast Approximate Anti-aliasing (FXAA) - モーションベクトルをサポートしないモバイルとプラットフォーム向けの高速アルゴリズム。
- Subpixel Morphological Anti-aliasing (SMAA) - モーションベクトルをサポートしないモバイルやプラットフォーム向けの、高品質だが低速のアルゴリズム。
- Temporal Anti-aliasing (TAA) - モーションベクトルを必要とする高度な技術。デスクトップとコンソールプラットフォームに最適。
次にヒエラルキー上で右クリックで、「CreateEmpty」を選択し、「GameObject」を作成します。
そのGameObjectを選択して「AddComponent」で「Post」と入力し「Post-processVolume」を追加します。
MeshEffects導入済みの方は次の通りです。
前回使用したPostProcessProfileをそのまま流用します。プロジェクトの上記のフォルダから、ドラッグアンドドロップしてください。そうすれば設定完了です。
なお、「Is global」のチェックは忘れないでください。
そうでない方はご自分で設定しなければならないです。
「New」をクリックして、プロファイルを作ります。
好みが非常に左右されますので、お好きなとおりにやっていただくのが一番です。また、その時々で最適なポストプロセスは違うと考えています。
ですので、上記のとおり「AddEffect」をクリックして、ポストプロセスを追加していってください。
※参考までに私が作ったものを掲載しておきます。
では、再生してみましょう。
よくなってきてますね。ですがもっと見せ場が欲しい!そう思ってしまうのは私だけでしょうか。
そんな方がいましたら、Timelineの素晴らしい機能「TimeDilationTrack」の出番です。
これは最初に導入した、「DefaultPlayable」に搭載されているものです。
時間を操作する「TimeDilationTrack」
空いてるトラック上で右クリック「TimeDilationTrack」を選択します。
白いトラックが追加されますので、さらにこのトラック上で右クリックをして「AddTimeDilationClip」を選択します。
白色のTimeDilationClipを選択し、赤線を引きましたTimeScaleをご覧ください。
「1」と入力されています。これを「2」にしてみましょう。
上記の動画ではコマ飛びしていてTimeDilationClipに入った部分が2倍速になってることがわかりづらいですが、
これでTimeline上の全体の時間の速さが操作できます。
便利な反面、全体の時間の速さがかわってしまうというのは困ることもありますので、要所で使っていくことをお勧めします。
また、CinemachineTrack同様にBlendもできますので、Clip間同士の流れをなめらかにすることもできます。
TimeScaleを「0.3」から「2」にBlendしたものです。
このようにして、緩急をつけていくとメリハリのあるアニメーションになっていくはずです。
適度に追加していきます。
「Easy in Duration」と「Easy Out Duration」について
上記のように、急にTimeScaleが違うTimeDilationClipが来ると、画面の速さがかわってしまい違和感を抱きやすいです。
「Easy in Duration」と「Easy Out Duration」を使ってみましょう。
多くのトラックで使えますし、重要な働きをします。
□のClipが台形になりましたね。
詳しくは下記をご覧ください。
では、今まで例をあげた機能をつかって、仕上げをしていきましょう。
Recoderで撮影する
では、Recoderを使って動画を撮影しましょう。
途中までは前回の記事と同様ですので、導入済みの方は流しながらご覧ください。
参考:
1.「Window」→「PackageManager」を選択します。
2.「Recoder」と入力し、「Install」を選択します。
3.しばらくImportの時間がかかりますので、待ちます。完了したら、PackageManagerを閉じます。
4.「Window」→「General」→「Recorder」→「RecorderWindow」を選択します。
ここから前回とは違う点になります。
「AddRecoder」をクリックして、「Movie」選択します。
5.「Recording Mode」を「FrameInterval」に変更します。
「Start」を、撮り始めたいフレーム、
「End」を、撮り終わりたいフレームまでに入力します。
今回は、「0」~「180」を指定します。
次に「Target FPS」を30にします。
※録画のFPSを変更されたい方はここを変更してください。よくわからない方は「30」のままにしてください。
「Image Seguence」のチェックを外します。
「Movie」にチェックを入れます。
「Capture」を「Tageted Camera」に変更しておきます。
「OutputResoulution」で解像度を変更できますが、今回は1920*1080のGameWindowの設定のままでいきます。
「OutputFile」も特に変更する必要もありませんが、保存先などを変更されたい方は「Path」の「...」をクリックして、変更してください。
初期設定では、「Recodings」というフォルダがプロジェクトフォルダに生成され「.mp4」で保存されます。
□→マーク部分で保存先を開くことができます。
では、撮影を開始しましょう。
「STARTRECODINGS」をクリックで再生され、撮影が開始されます。
再生と同時に録画をしますのでパソコンに負荷がかかります。
撮影が終了したら、再生を止めて、ファイルを確認しましょう。
「Movie_001.mp4」ができあがっていたら、無事撮影は終了です。
大変お疲れ様でした。
では、出来上がった動画を見ていきましょう。
炎を切る感じがよいですね。
最後に使用アセットの紹介です。
2022年1月24日より「笑門来福メガバンドル」が開催されております。とにかくお得なのでおすすめです(2022年2月8日まで)。
・エフェクト
・モーション
Free版
・背景
Free版
おわりに
長く細かな作業、大変お疲れ様でした。
TimelineやCinemachineの機能は無限大です。
ぜひ、他のアセットと組み合わせり、独自のアニメーションを撮影してください。
皆様のアニメーションを楽しみにしております。
お読みいただきありがとうございました。
私はUnity等を作って、自主制作アニメ「おかえりの柳橋さん」や色々な作品をTwitterやYoutubeで発信しておりますので、こちらも見て頂ければ幸いです。
なお、記事を見てアニメーションを作ったよ!って、言ってくださるとすっごい喜びますので、Twitterなどでご連絡くださいませ。
では、またお会いできる日を楽しみしております。
【Unity】MeshEffectsを使って、Vroidモデルに武器を持たせて動かし撮影しよう!
「Unity アセット真夏のアドベントカレンダー 2021 Summer!」 10日目の記事です。
9日目はkakoさんの「ShapesでDOTweenのすゝめ」です。
明日はAmeoさんの「Curvyを使って3D横スクロールステージを作ろう!」です。
はじめに
プロジェクトの作成から「MeshEffects」を導入し、Vroidモデルに武器を持たせ動かし、撮影する方法を紹介します。
※Vroidモデルは他のモデルに変更することも可能です。
はじめまして、Unity等を使って自主制作アニメーションをしている、たぬと申します。
- はじめに
- 1.「MeshEffects」の概要
- 2.「プロジェクト」の作成
- 3.「MeshEffects」の導入
- 4. デモシーンの確認
- 5. 「Post Processing」の導入
- 6. Vroidモデルの導入
- 7. モーション、エフェクト、武器の確認・設定
- 8. デモシーンでの再生
- 9. Recoderで撮影する
- おわりに
本記事では次のとおりの環境下で行います。
※Unity初級者向けを想定しております。
- Unity 2019.4.16
- Mesh Effects 1.4.1
- UniVRM-0.66.0_39d5(Vroidモデルを使用する場合)
- Post Processing Stack 3.0.3
- Recorder 3.0.1
1.「MeshEffects」の概要
リッチなエフェクトが簡単に実装できてしまう、素晴らしいアセットです。
以下、公式の動画になります。
かっこいいですね。
こういったことを自分の好きなモデルできないものかと考えてしまいます。
「MeshEffects」なら、そんな願いをすぐ叶えてくれます。
アセットストアの「MeshEffects」のページを見ておきましょう。
このパッケージには 21 のメッシュエフェクトが含まれています。
注:アップグレードする前に、古いバージョンのパッケージを削除する必要があります。
URP と HDRP には、プロジェクトフォルダに含まれているインポートパッチが必要です。Unity 2019.2.19f 以降で利用可能な URP および HDRP レンダリング
PC / コンソール / Motules / VR に対応しています。
2D スプライトでは動作しません
PC デモ
モバイルデモ
- 購入後そのまま使用可能(ドラッグアンドドロップのみ)
- どんな色もワンクリック
- 実際のメッシュサイズに対するエフェクトスケール
- 「メッシュレンダラー」と「スキンメッシュレンダラー」で動作
- デモシーンには(アニメーション / キャラクター / 武器 / 環境)が含まれます
重要!Unity3d はサブメッシュ当たり 1 つ以上のマテリアルはサポートしません。正しく機能させるには、サブメッシュを分割する必要があります。
(AssetStoreからの引用文)
とありますように、
・21種類のメッシュエフェクト
・Built-in RPに加え、URP と HDRP で使用可能
・PC / コンソール / Motules / VR に対応
Timeline上でモーションやエフェクトに手を加えたり、テクスチャを変更することで大きく表現の幅が広がり、ゲーム内でのカットシーンでも活躍することでしょう。
2.「プロジェクト」の作成
3Dを選択し、お好きなプロジェクト名を入力してください。保存先を選び、作成をクリックしてください。
本作業では、レイアウト下記のように配置しています。レイアウトが設定については、次をご参照ください。
右上から「2by3」を選択します。
上記のようになれば、成功です。
3.「MeshEffects」の導入
AssetStoreのウィンドウを表示させます。
検索から「MeshEffects」を入力、検索してでてきたものをクリックすると
※記事作成時にセールだったため、価格が半額で表示されています(20210730)。
「Import」画面がポップアップされますので、「Import」をクリックしてください。購入されてない方は購入してください。
「Import」をクリックしてください。すぐに「Import」されますので、完了までしばらくお待ちください。
4. デモシーンの確認
1.AssetStoreの画面はいらないので、Sceneに切り替えます。
2.プロジェクトのファイルが見づらいので〇を「←」によせておきます。また、レイアウトを微調整していきます。このあたりはやりやすいようにお好きにしてください。
3.「Impot」に成功していると、「KriptoFX」というフォルダができているはずなので、
「KriptoFX」→「MeshEffect」と開きます。
4.「PC_Demo」を選択します。
「Please read the readme :) 」とのことなので、ReadMeを読んでおきましょう。
今回の記事で必要な部分の要点をまとめますと 、
・正しく動作させるには"\Assets\KriptoFX\MeshEffect\PostProcess Profile.asset"を導入して、デモシーンのようにします。
・EffectのPrefabをエフェクトをつけたいオブジェクトにドラッグアンドドロップします。次に、設置したメッシュオブジェクトの"PSMeshRendererUpdater"の "Update Mesh Renderer"をクリックします。
そうすると、パーティクルとマテリアルが自動でオブジェクトに追加されます。
まず、さっそく再生ボタンをクリックして、プレイしてみましょう。
エフェクトが適応された剣を振り回す男「Character(Clone)」と球「TestSphere(Clone)」が表示されるはずです。
左側の赤〇部分で、色の変化やエフェクト21種類をプレビューできますので、お試しください。
この状態では問題があります。
一度再生をやめて、ヒエラルキーの「PostProcessing」を選択してください。
ScriptがMissingとなっていますので、「PostProcessingStack」を導入することで、解決します。
「PostProcessingStack」は、画面に様々な変化を与えてくれる機能です。
※詳しく知りたい方は下記URLをご参照ください。
5. 「Post Processing」の導入
1.「Window」→「PackageManager」を選択します。
左上の部分がUnityRegistryになっていることを確認し、検索タブに「post」と入力します。
上記のように表示されているのを確認し、「Install」をクリックします。
ScriptがMissingが「Post-processVolume」と表示されるようになっています。
ConsoleにErrorが出続ける場合があります。次のように対応してください。
「NullReferenceException: Object reference not set to an instance of an object.
UnityEngine.Rendering.PostProcessing.AmbientOcclusion.IsEnabledAndSupported.」のErrorが出た場合の対処法
ヒエラルキーから「Camera」→「Camera」を選択、「Post-processLayer」を「RemoveComponent」します。
「AddComponent」で「Post」と入力し「Post-processLayer」を追加し、
1.「Layer」に「Default」を一時的に設定します。
2. 「Anti-Aliasing」に「SMAA」を設定します。
スペックや状況に応じて設定してください。スペックが低い場合は「FXAA」をおすすめします。
それぞれの設定は下記のとおりになっています。
- Fast Approximate Anti-aliasing (FXAA) - モーションベクトルをサポートしないモバイルとプラットフォーム向けの高速アルゴリズム。
- Subpixel Morphological Anti-aliasing (SMAA) - モーションベクトルをサポートしないモバイルやプラットフォーム向けの、高品質だが低速のアルゴリズム。
- Temporal Anti-aliasing (TAA) - モーションベクトルを必要とする高度な技術。デスクトップとコンソールプラットフォームに最適。
次にヒエラルキーにある「PostProcessing」→「Post-processVolume」を「RemoveComponent」します。
「AddComponent」で「Post」と入力し「Post-processVolume」を追加します。
プロジェクトの「MeshEffect」内にある「PostProcess Profile」を「None(PostProcess Profile)」にドロップ&ドラッグします。
「Is Global」にチェックをいれましょう。
成功すると、赤まるのColorGradingとBloomが追加されます。「AddEffect」をクリックすると、他のエフェクトが追加できますが、今回は追加せずにいきましょう。
※いろいろ弄りたい方は、下記URLをご参照ください。ほかアセットでも追加できますので、ぜひ色々なポストプロセスを楽しんでください。
※参考にさせていただいたもの
6. Vroidモデルの導入
Vroidモデルを導入するために、UniVRMを導入します。
モデルを、アセットストアやMixamo等で導入する方はアセットストアから適宜Importしてください。
下記URLの最下部にある、
「UniVRM-0.66.0_39d5.unitypackage」を導入します。ダウンロードし、デスクトップ等に保存したら、
画面上から「Assets」→「ImpottPackage」→「CustomePackage」を選択します。
先ほどダウンロードした、「UniVRM-0.66.0_39d5.unitypackage」を選択して、
「Import」します。
上記の3つのフォルダが追加されます。
続いて、モデルを保存するためのフォルダを作成します。
プロジェクトの「Assets」上で右クリック→「Create」→「Folder」を選択します。
「NewFolder」というフォルダが作成されますので、とりあえず、「Vroid」と命名しておきます。
あらかじめ「VroidStudio」等から、モデルをVRM形式でエクスポートしておきます。
なお、今回はHulaFlatWorks様の衣装をお借りしております。
※VroidStudioでのモデルの説明ついては下記をご参照ください。
「Vroid」フォルダを選択した状態で、
エクスポートしたVRM形式のファイルをドラッグアンドドロップします。
Importに時間がかかりますので、しばらく待ちます。成功すると下記のようにファイルが生成されます。
青い箱のPrefabの「YB_Gospan」をヒエラルキーにドラッグアンドドロップします。
そうすると、下記のように表示されるはずです。
一度シーンを再生してみましょう。
「Tポーズ」を取ったモデルが画面に表示されれば、Importは成功しています。
7. モーション、エフェクト、武器の確認・設定
ではここから、デモシーンのようにキャラクターのように武器を持たせ動かしたいと思います。
一度再生してみて、デモシーンのキャラクターがどのような振る舞いをしているのか、「Inspector」を見てみましょう。
アニメーションシステムをコントロールしている「Animator」という「Component」の「Controller」に「Anim1」というものが設定されています。
また、「ME_AnimatorEvents」のなかの、
「EffectPrefab」に「Effect1」
「SwordPrefab」に「Dragonblade」
が設定されています。それぞれをクリックしてみましょう。
「Effect1」
1~21のエフェクトのPrefabが「MeshEffects>Prefabs>PCDemos」に格納されているがわかりました。
「Dragonblade」をクリックするとシーン上に選択された状態になり、「MeshEffects>DemoResources>Prefabs」に格納されていることがわかりました。
順にこの3つをモデルに配置すれば、同じようなことができそうです。
では、やってみましょう。
モーションの設定
プロジェクトの「MeshEffects>DemoResources>Animation」を開きます。「Animator」Windowが表示されます。
「Anim1」
「Anim2」
のように設置されています。
「Anim2」を元に新たな「Controller」を作成します。
「Anim2」を選択した状態で、「Ctrl+D」を押して、ファイルを複製します。
「Anim3」が生成されます。そこに、AnimationClipファイルである「SwordRotating 1」をドラッグアンドドロップします。
以下のようになります。
橙色の「idle」の上で右クリックをします。
「MakeTansition」を選択します。
→が表示されますので、「SwordRotating 1」を選択し、上記のようにつながった状態にします。
ヒエラルキーの「YB_Gospan」を選択し、インスペクターの「Animator」の「Component」を確認します。
「Controller」が「None」になっていますので、●をクリックして、「Anim3」 を選択します。
選択後、再生してみましょう。
このように、Animationの矢印が遷移し、Game画面で剣を振り回す動作「SwordRotating 1」をしていれば、「Animator」の「Controller」の作成は完了です。
このように、AnimationClipを追加していけば簡単にモーションを追加していけれます。アセットストアには無料有料の様々なモーションがおいてありますので、ぜひチャレンジしてください。
なお、本記事投稿日時点で、アニメーションアセットが無料(2021/08/16まで)になりますので、ぜひ入手されることをおすすめします。
クーポンコードの入力をくれぐれをお忘れないようにしてください。
【パブリッシャーセール & 期間限定 無料化アセット】
— AssetSaleLove @汗人柱 (@AssetLove) 2021年8月2日
テーマ「アニメーション」
格闘、魔法使い、剣戟、銃、弓など戦闘モーション全品50%オフ
各パブリッシャーから計3アセット分の無料プレゼントあり!
🎁引き換えコード:ANIMATE2021https://t.co/FxGgBa4RM1
期間:8月16日 15:59頃まで#Unity pic.twitter.com/VOSZkQAKuL
Animatorの詳しい使い方については下記をご参照ください。
「ReadMe」の文字も必要ないと思いますので、ヒエラルキーからチェックを外しておきます。
武器の配置
プロジェクトから「dragon」と検索し、「Dragonblade」のPrefabを見つけ、
「YB_Gospan」の「Root」から順に開いていき「J_Bip_R_Hand」 に「Dragonblade」をドラッグアンドドロップします。
「Dragonblade」が離れた位置にありますので、
PositionをすべてXYZの値を0にします。そうすると、以下のように表示されます。
Tポーズを取ったモデルの右手(「J_Bip_R_Hand」)の上に剣が載っているかたちになります。
一度、再生をしてみましょう。
武器がそのまま右手首あたりの上のままあった状態で、モーションが再生されているので、隣のキャラクターのように剣を握っているようになりません。
では、剣を握っているように微調整をしていきます。
アバターの身長や腕の長さで位置はかわってきます。
右手の親指の下あたりに剣の柄がくるといい感じに握ってくれます。以下、本アバターにおいての数値です。
PositionやRotation、Scaleを使って修正してください。
一度、再生して、
しっかり握れていることを確認します。
エフェクトをつける
長い道のりでした。大変お疲れ様です。
では、本記事の目的であるエフェクトをつけましょう。
ご自分の好きなエフェクトを1~21の中からお選びください。
私は火遊びが大好きなので、「effect7」を選びます。
「MeshEffects>Prefabs>PC Effects」からお好きなEffectを「Dragonblade」にドラッグアンドドロップします。
ヒエラルキー上の「Effecr7」を選択し、
インスペクター上の「PSMeshRendererUpdater」の「MeshObject」に「Dragonblade」をドラッグアンドドロップします。
そして、「UpdateMeshRenderer」をクリックします。
成功すると、剣から火を出てきます。
お選びいただいたEffectごとでシーンに再生されるものは変わります。
8. デモシーンでの再生
では、シーンを再生してみましょう。
Colorを弄ることで炎の色をかえることができます。
蒼炎というものをやってみたかったので、青色にして、再生してみます。
以上、お好きなようにカスタマイズしてエフェクトを楽しんでください。
EffectのPrefabのなかのパーティクルなどを弄ることで、より細かな演出に拘ることができます。
パーティクルシステムについては下記をご参照ください。
9. Recoderで撮影する
せっかく武器も持てて、モーションできたのに綺麗に撮影ができなければもったいないですね。
参考:
撮影をしてみましょう。
1.「Window」→「PackageManager」を選択します。
2.「Recoder」と入力し、「Install」を選択します。
3.しばらくImportの時間がかかりますので、待ちます。完了したら、PackageManagerを閉じます。
4.「Window」→「General」→「Recorder」→「RecorderWindow」を選択します。
5.「Recording Mode」を「SingleFrame」に変更します。
6.「ImageSequence」を選択します。(Movieを選択すれば動画も撮影できますが本記事では割愛いたします)
7.OutputResoulutionを選択します。FHDを選択します。
8.FormatをJPGからPNGに変更します。
9.初期設定では、保存されるファイルの名前は「image<Take><Frame>+Wildcards.png」で保存されます。
保存先は、プロジェクトのあるフォルダにRecordingsというフォルダが作成され、保存されます。
※変更したい方は変更してください。
赤●のところをクリックすると保存先が開くことができます。
10.シーンビューのFreeAspectをクリックし、「(Recordings resolution)(1920x1080)」に変更します。
11.再生します。GameWindowを大きくして撮影しやすくします。ひとまずこの状態で、撮影してみます。
12.「STARTRECORDING」をクリックすると、その瞬間が撮影されます。
先ほどの赤〇をしている保存先のフォルダを開いてみて、確認してみましょう。
左上のUI操作の部分も撮影されています。
それは「Source」が「GameView」になっているため、「GameView」そのままが撮影されてしまいます。
色々な方法で解決できますが、今回は「Source」を変更することで解決します。
「Caputure」の「Source」を「TargetedCamera」に変更します。
もう一度「STARTRECORDING」をクリックします。
無事にUIがなくなったものを撮影することができました。
以上、カメラの方向の調整、いらないものを消したりして、ベストショットを撮ってくださいね。
※暗すぎる場合は下記の「Directional light」の「Intensity」を調整してください。
おわりに
以上で、「MeshEffects」を使って、Vroidモデルに武器を持たせて動かし撮影しよう!は終わりになります。
長く細かな作業、大変お疲れ様でした。少しでも皆様の制作のきっかけになれば幸いです。
今回の記事だけでは、カメラが狙ったように動かせない、モデルの動きとタイミングがあわない、静止画だけじゃなくてアニメーションを作ってみたい方向けに、
執筆いたしましたので、引き続きご覧ください。
ぜひ様々な制作を楽しんでください。
お読みいただきありがとうございました。
Unity等を作って、自主制作アニメ「おかえりの柳橋さん」や色々な作品をTwitterやYoutubeで発信しておりますので、こちらも見て頂ければ幸いです。
では。