UnityのTimelineを解説【キャラの表情や動きを5秒で編集可能です】

UnityのTimelineを使えば3Dモデルキャラクターの表情や動きを5秒でプリセットで上書き編集可能って本当?
凝った編集ができるのでVTuberやミュージックビデオに最適って本当?
カメラはActivation Trackを置いて位置を決めるだけって本当?
こんな疑問に答えます。

僕はVRoidで漫画が作れるiPhoneアプリComicamを開発して公開中です。
そんな僕が解説していきます。

作業環境

Unity2018.2.21f1
HTC Vive

UnityのTimelineを解説【キャラの表情や動きを5秒でプリセット上書き編集可能です】

UnityのアニメーションファイルをVRゴーグルで作成するまでの作業はこちらで解説しています。
» Unityでモーションキャプチャする方法【1ボタンで記録+編集可能】

VRoidで3Dモデルを作る方法はこちらでまとめています。
» VRoidの完全マップ【入門・基礎・中級・上級を徹底解説】

Unity2017からの新機能タイムラインを使って超最速で簡単にアニメを作っていきます。

UnityのTimelineを編集する環境を整える

TImelineオブジェクトを新しく作成する

左サイドバー(ヒエラルキ)を右クリックしてCreate Emptyを選びます。

新規GameObjectができるので、名前を「Timeline」などわかりやすい名前に変えておきます。

Timelineウィンドウを出す

Window>Sequencing>Timelineを選び、Timelineウィンドウを出します。

ドラッグして右下あたりに配置するのがおすすめです。
Createボタンを押します。

作成するタイムラインの名前を聞かれるのでシンプルに「Timeline.playable」などど名付けて保存します。

これでTimelineを編集する環境が整いました。

UnityのTimelineの空のトラックを準備する

トラックグループ トラックの種類 説明
3Dモデル Animation Track 3Dモデルの身体のモーション
Override Track 手や足などをオーバーライド(上書き)
Animation Track 3Dモデルの表情のモーション
Override Track 表情などをオーバーライド(上書き)
Override Track 表情などをオーバーライド(上書き)その2
カメラ Activation Track カメラ1(正面)
Activation Track カメラ2(横)
Activation Track カメラ3(斜め上)
音楽 Audio Track 音楽
録画 Record Track レコードトラック(一発撮り用)

こんな感じで作るべきトラックを最初に作ってしまった方がわかりやすいです。

Addボタンからトラックの追加ができます

右上のAddボタンから新規トラックを追加していけます。

トラックのタイトル部分の小さな黒丸をクリックしてトラックの3Dモデルを指定します。

オーバーライドトラックは作成したトラックの上で右クリックで作成します

メイントラックのモーションを変えないで表情などを上書きできる機能です。

UnityのTimelineにAnimation Clipを配置する

アニメーションクリップの追加は、空のトラックの上で右クリックして「Add From Animation Clip」でOKです。
マウスでドラッグ挿入するとパソコンが超重くなったのでここは右クリックでの挿入がおすすめです。

別ウィンドウが開くのでアニメーションクリップを選びます。
まずはHTC Viveでモーションキャプチャして作成した体と顔のアニメーションクリップ2本を追加します。

HTC Viveで自分で動いてアニーメションクリップを簡単に作るまでの作業はこちらの記事で解説しています。
» Unityでモーションキャプチャする方法【1ボタンで記録+編集可能】

拡大すればトラックの微妙な位置調整も可能です

スライダー部分を伸縮していけば思い切り拡大することが可能です。
トラックをぴったり目盛り通りに配置しやすいです。
より綿密に合わせるならサイドバーで数値入力もできます。

特にミュージックビデオを作る場合にドラムのビートに合わせるのに便利そうです。
動画編集ソフト側で微調整してもいいんですが、この時点で意識してタイミングを綺麗にしておく方が後で作業が楽です。

UnityのTimelineでプレビュー再生してみる

トラックを置いてみた時点でとりあえず再生してみましょう。
Timelineの再生ボタンを押します。
上部のUnity全体の再生を押しちゃうとHTC Viveの動きが入ってしまうのでそっちは押さないでOKです。

UnityのTimelineで顔や体の細かい動作を上書きで追加する

表情のアニメーションクリップをオーバーライドレイヤーに置いていくだけで顔が変えれます

表情は先ほど作成しておいた顔のモーションの下のオーバーライドレイヤーに表情のアニメーションクリップを置いていくだけです。
「え?それだけ?」
って驚くくらい簡単です。

MMDのようにキーフレームを打つ必要はないです。
場所の移動も簡単。
マジで革命ですね。

今回はUnityちゃんに最初から付いている表情アニメーションを使用しています。
VRoidの表情のアニメーションクリップを自分で手で打ち込んで作る方法はこちらの記事で解説しています。
» VRChatの表情を解説【打ち込んで作った後に割り振っていく】

表情プリセットの口の部分のキーを消してリップシンクに影響しないようにします

口の動きはマイクからリップシンクで入力した方を活かしたいので消します。

アニメーションクリップをダブルクリックすればキーフレームで編集画面に移れます。
そこでMTHで始まる口に関するキーフレームを複数選択して右クリックで全削除します。

表情同士のミックスも可能です

こうやってトラックを同じレイヤーで重ねるとミックスされます。
「目を閉じる」+「驚く」みたいに2レイヤーで別々に重ねるのもありかなと思います。
かなり複雑な表情も5秒くらいで作れます。

サイドバーでアニメーションクリップの詳細設定ができます

アニメーションクリップを選択した状態でサイドバーで詳細を設定できます。
そんな使う場面は多くないと思います。

Animation ExtrapolationのPreとPostの部分が「Hold」になっているとアニメ効果が保持されてしまいます。
「目を閉じる」のアニメーションクリップでずっと目が閉じたままになってしまうなど場合はここを「None」に変えましょう。

手のグーパーのオーバーライドが成功しないです

手の形のみをオーバーライドした時に体のモーションが上手く変化してくれません。
わかったら追記したいと思います。

UnityのTimelineでカメラを設定する

カメラを複数作成する

カメラをDuplicate(複製)します。
Camera2、Camera3とかわかりやすい名前に変えておきます。

カメラの位置を設定する

それぞれのカメラの位置を調整します。
プレビューを見ながらマウスで動かしていきます。
数値での微調整も可能です。

再生しないとUnityちゃんが埋まってしまったので再生状態でカメラ位置調整しました。

カメラの位置はだいたい定番の位置があるので迷わないと思います。
横顔・正面・斜め上とかですね。

カメラをTimelineに配置する

先ほど作っておいたカメラレイヤー(Activation Track)にCamera2、Camera3などをそれぞれ指定します。
レイヤー上で右クリックしてアクティベーションクリップを追加します。

再生してみるとActiveな部分ごとにカメラが切り替わるのが確認できます。

応用としてカメラを動かすにはCinemamachine機能を使うようです。別記事で書く予定です。
» 参考:CINEMACHINE - 映画にもゲームにも使える強力なカメラ機能(Unity公式)

UnityのTimelineで編集した動画を録画する

録画する方法は結論から言うとプレビュー画面のキャプチャです。
まずこのようにGameタブを別ウィンドウにします。

Gameタブの画面サイズを設定する

Gameタブの画面サイズを設定します。
プルダルン部分から新しい設定を追加します。

Aspect Ratio(縦横比固定)に設定して自分の液晶画面に可能な限り拡大表示してキャプチャ録画しました。
超大型液晶ディスプレイを持っている人はFixed Resolution(サイズ指定)で1920 * 1080サイズぴったりでキャプチャすればいいと思います。

この後はOBSで自分の画面を録画すればOKです。
» VRChatをYouTube Liveで配信する方法【OBSをHTC Vive用に設定】

キャプチャ以外の選択肢が1日かけても見つかりませんでした

  コメント
シンプルにキャプチャ ・簡単
・ただし大きな液晶持ってないと大きな解像度の指定キャプチャはできない
・OBSで音を拾う設定が必要。もしくは音は別で合わせる
Recorder
(アセット)
・プレビューの録画ができない
・レコーダーを動かすとHTC Viveも動いてしまいモーションが記録されてしまう
UnityCam ・プレビューの録画ができない
・実行再生を押してしまうとHTC Viveも動いてしまいモーションが記録されてしまう
スクリプトを書く ・めんどい

RecorderというアセットやUnityCamも試したんですが、キャプチャする際にUnity全体を実行再生する必要がありました。
実行再生するとHTC Viveのキャプチャが開始されてしまいます。
Viveの連携を切るとモデルも消えてしまうのでリアルタイムの一発撮りしかできせん。
一発撮りをしたいならバーチャルキャストでやればいいのでUnityでわざわざ撮影している意義が薄れてしまいます。
試行錯誤したら出来るのかもしれないですが、とりあえずめんどいのでシンプルにキャプチャでいいかなって思います。

これで無事に動画の撮影まで完了です。

UnityのTimelineでさらに知っておきたいこと【細かい制御や演出効果も可能です】

Timelineで作る動画の背景は360度画像がおすすめです

360度画像を背景に置くだけでTimlineでどんなにカメラが動いても綺麗に背景を描画してくれます。
» 【簡単】Unityで360度の画像を作る方法【球にセットするだけです】

Unity Timelineを入れ子にしたりスクリプト制御することも可能です

Timelineには他にも機能が多数あります。
ゲームの制作向けのものが多いですがVTuberやミュージックビデオで使えそうなものもあります。

UnityのTimelineのControl trackで他のTimelineを入れ子にできます

例えばパーティクルが噴出する的な複雑な内容のTimelineを作成し、それを1つの素材として別のTimelineで呼び出してキャラの手に紐づけて動かすなどです。
Apple Motionでライブラリ素材を呼び出すのに似てる気がします。

UnityのTimelineのPlayable Trackでスクリプトを利用できます

Playable Trackを利用すればスクリプトによるアニメ制御ができます。
例えばゲーム製作で「宝箱をゲットしたら数秒間光り続ける」的な制御に使うようです。
» 参考:スクリプティングでタイムラインをより創造的に活用しよう(Unity公式)

UnityのTimelineでループ再生も普通にできます

単純にループ再生させたい場合は再生範囲ボタンを押して範囲を設定します。
他の動画ソフトと一緒です。

UnityのTimelineのSignal機能でマーカーを打てます

シグナルはUnity2019からの新機能でTimelineで目印のマーカーを打っていけます。
他の動画ソフトによくある機能ですね。
» 参考:Timeline Signal の使用方法(Unity公式ブログ)

Timeline機能で完成した動画はこちらです

使い方を探りつつ数時間でこんな動画が作れました。

というわけで今回は以上です。
マウスでポンポン置いていくだけで表情が設定できるのはマジで感動です。

関連記事HTC Viveのセットアップ作業の全まとめ【購入からプレイまで徹底解説】

関連記事HTC Viveを購入する方法、ベストな販売店と在庫確認方法を解説

-Unity