9日間で3DライブをUnityで作った話-アニメ×ゲームジャム F.F. in京都 備忘録-
はじめに
2024年8月中旬に「アニメ×ゲームジャム F.F. -For Freshers- in 京都」が開催されました。
UnityのAnimeToolBoxを活用してアニメーション映像を作るちょっと変わったゲームジャムになります。
2024/8/10-2024/8/11は京都でオフラインで作業を行い、2024/8/12-2024/8/18にかけてアニメーションのブラッシュアップ期間としてオンラインで作業をする合計9日間のスケジュールでの開催でした。
以前オンライン参加した「アニメ×ゲームジャム supported by Unity」が楽しいながらもUnityでの映像制作の知見を色々得られたこともあり、京都旅行の理由にもなるのでエンジニア枠として今回明らかにフレッシャーでないのにも関わらず参加しました。
(一応応募前に運営の方に確認したところ気持ちが若ければOKですとの返答を頂きました)
2名のアニメーターの学生の方と3Dモデリングができる学生の方と私でチーム「アシティア」を結成しました。
チームでアニメーションの構成を話し合い「平安時代にいる女の子が和歌を読んだことでタイムスリップし、現代で和歌をもじったアイドルソングを歌ってライブをする」流れで作ることが決まり、ライブ前まで2Dでライブは3Dで作ることになりました。
今回私は3Dライブパートの担当になったのですが、色々工夫を重ねた結果、自分なりに良い3Dライブ映像ができたので備忘録的に3Dライブパートでやったあれこれを本記事で残しておこうと思います。
もし次回以降のアニメゲームジャムの参加者の方がこの記事を役立ててくれたら嬉しいです。(もちろんそれ以外でも役立ててくれたら嬉しい。)
※1 Unityの基礎知識周りについては解説を雑に省略しています。
※2 元の資源をいったん昔の状態を戻して再度実装しているので提出した映像と差異がある個所があります。
下準備
今回ライブステージや客席や観客のモデルはモデリングができる学生の方が制作してくれました。
ステージ上のモニターに写っている中継映像はRenderTexture経由で少し離れた場所に置いたカメラの描画内容を表示しています。
ライブステージを華やかに彩っているビームライトはnoribenさんが販売しているビームライトシェーダーを利用して実装しました。
VRMモデルの作成
3Dライブでは2Dパートにいた女の子を3Dモデルにしてライブをさせる必要があります。そのため、アニメーターさんのキャラデザに合わせてVroid StudioでVRMモデルを制作することに決めました。
上記デザイン画を元に制作したVRMモデルがこちらになります。
できるかぎり衣装を似せたかったのですが、自身のVRoid力が足りず、服装に関しては似ている下記の衣装を使わせていただきました。
また、髪の揺れをできるかぎり自然なものにしたかったため、
髪のボーン数を多めにするなど調整を行っています。
作成したVRMモデルをUniVRMでUnityにインポートすると下記のような見た目になります。
工夫するともっと見た目はよくなりそうですが、いったんキャラの細かい見た目の改良は後にし、大まかなライブの流れを作るため、ライブ中のダンス、歌唱モーションとカメラワーク作りに進むことにしました。
モーションとカメラワークの設定
今回3Dライブで使った曲はフリーBGMとして公開されている「CHALLENGE」という曲になります。
もちろん曲だけ公開されているので、この曲に合わせたカメラワークや人のモーションデータは存在しません。
9日間という短い期間で0からモーションの作成を依頼する時間も作る時間もないため、既存のアイドルライブっぽいモーションを曲のタイミングに合わせてVroidモデルに設定し、それっぽく見えるタイミングだけカメラに映し、不自然に見えてしまうタイミングはカメラに映さないようにしました。
今回使わせていただいたモーションデータはこちらです。
※動画の音がなぜか二重になっている原因は後ほど説明します。
VRMモデルにモーションを設定した後にCinemachineVirtualCameraでカメラワークをつけていきました。
1つのカメラだけを使うのではなく、1つのカメラワークごとにカメラを作り、それをSequence上のCinemachine Trackで次々切り替える形にしています。
近距離の視点の後は遠距離、その後は中距離…と内容が被っている視点が連続しないように意識しました。
近距離のカメラで人が撮影しているような動きにしたい場合はVirtualCameraのNoise機能を利用して手ブレをつけています
手の動きがかっこいいモーションの場合、手をLook Atの対象にするといいカメラワークになりました。
ダンス部分の全体のカメラワークは以下のようになりました。
3Dライブ制作初心者ながらもそれっぽくはできたのではないでしょうか？
リップシンクと表情の設定
さらに歌っているぽさを出すために表情とリップシンクの実装も行いました。(さきほどのカメラワークの例の動画だと表情だけ実装されてリップシンクがない状態です。ややこしくて申し訳ない。)
リップシンクの実装はuLipSyncにて行っています。
uLipSyncが参照するAudioSourceのAudioClipとして今回歌っている「CHALLENGE」の歌声だけを外部ツールで抽出した音源を設定し、ライブの音源とタイミングを合わせることで歌っているような口パクを実現しました。
ただこの口パクは実際に実行中に音源を再生しないと動作しないため、実行すると「CHALLENGE」が二重に聞こえる事象が発生するようになりました…。アニメゲームジャム中は動画を音源無しで録画、その後uLipSync用のゲームオブジェクトを非活性にし音源のみ録画と二回録画することで音源二重再生事象を回避していました。
さらに自然なまばたきも入れたかったのでこちらの記事を参考に自動で瞬きを行うスクリプトを実装しました。
さらに表情を強調したい箇所は手でアニメーションをつけています。
こうして表情とリップシンクを追加したものがこちらの動画になります。
以前より歌ってる感を出すことができました。
litoonシェーダーへの変更
全体のライブの流れはできたので、この後はひたすらにビジュアルアップをしていくことにしました。
まずはいったんスキップしたVRMモデルのビジュアルアップです。
3Dライブではありますがアニメーションの前半部分の2Dパートとできる限り雰囲気を同じにさせたかったため、litoonシェーダーを利用してアニメ調のトゥーンな見た目にすることにしました。
元々のUniUnlitシェーダーからlitoonシェーダーに切り替え、アニメ調のプリセットで各パラメータを調整すると下記のようになります。
見た目はよくなりましたが、顎や白目の影が気になりますね。
この影問題を解消するため、各カメラごとに影が変にならないライトを用意してSequenceで切り替えていくことにしました。
そうしてできたものが下記のスクリーンショットになります。
顔のアップの画がかなり良くなりましたね！
ポストプロセスの設定
ここからは下記記事を参考に全体の見た目のビジュアルアップをしました。
まずは基本的なポストプロセスです。
Bloomでサイリウムやビームライトの光があふれる調整を行い、Color Adjustmentsと White BalanceとTonemappingで色味の調整を行っています。
さらにカメラごとに近距離にあるものに注目してほしいタイミングの場合は
ChinemaChine Post Processingの機能でDepth Of Fieldを設定し、遠景をぼやけさせるようにしました。
ポストプロセスをかけた後の見た目は下記のようになります。
見た目が少しづつ豪華になってきましたね！
ボリュメトリックフォグの設定
次にライブステージの奥行き感を出すためにボリュメトリックフォグの実装を行いました。
こちらのアセットを利用しています。
さらに奥行き感を強化するために空中に漂い光を当たって光るようなエフェクトも作成しました。
上記2つを実装すると下記のような見た目になります。
AnimeToolBoxで仕上げ
仕上げにAnimeToolBoxでフレア(薄く明るくする効果)とディフュージョン(画面を柔らかくする効果)を行いました。
AnimeToolBoxに関しては下記のマガジンで機能の使い方を色々説明しています。
今回組んだノードはこちらです。
Flareブロックではフレア用のテクスチャをそのタイミングの照明の色にし、上部の方に置いてほのかに明るくしています。
※ライブのカメラワークの展開によってフレアテクスチャの位置や色は変更しています。
DFブロックでは一度全体にBlueをかけた映像を元の映像に薄く合成することで、すこしだけ映像を柔らかくしました。
上記2つを実装すると下記のような見た目になります。
これで完成です！
ビジュアルアップ前と後でかなり画が変わりましたね！
自分はこれを成し遂げたときは驚きと興奮と喜びであふれていました。
アニメゲームジャム完走しました！
— 41h0(シホ)🐬☄️🐶🎧🐾🧸🌙 (@41h01) August 18, 2024
テーマが「うた」だったので3Dライブシーンを作っていました。
AnimeToolBoxも活用して結構いい画作りができた感触#Unity#アニメゲームジャム pic.twitter.com/nw8SEtGmfN
完成！
こうして完成し、提出した3Dライブの映像がこちらになります。
上記3Dライブ映像含め前半の2Dパートも合体させたアニメーションを提出したところ、なんとANiC賞をいただきました！
【速報】#アニメxゲームジャム F.F. in #京都 のアワード受賞結果が発表！映えあるグランプリ作品はチーム神白甘水（しんぱくかんすい）！🏆✨準グランプリには、チーム俺Ｄ、そしてチームアシティアがANiC賞を受賞しました👏… pic.twitter.com/9561yUjstd
— ANiC 特定非営利法人 アニメ産業イノベーション会議 (@ANiC_Japan) August 30, 2024
まとめ
9日間でアニメを作るというハードスケジュールで貴重なお盆休みが一瞬で消えた感覚はあるのですが、CinemachineやSequenceやAnimeToolboxなど普段使わないUnityの機能や3Dライブの空間の作り方などの知見を習得することができたゲームジャムでした。
また、自分よりも若いアニメーターさんとの共同作業や声優さんのセリフ録音のための台本作成、レコーディングの指示出しなど普段の業務では絶対に経験することができない体験ができてとても楽しかったです！
今後もアニメゲームジャムは開催予定とのことなので、また機会があれば参加したいです。
今読んでいる皆様でUnityでアニメを作るのに興味がある方は次回参加してみてはいかがでしょうか？
ここまでお読みいただきありがとうございました！
