じゃっくぽっとラボ

UE4の技術ログあつまれ~

ボス前カットシーンを作る(2/2)シーケンサー編

前回の記事の続きです。
主にマスターシーケンサーの使い方となります。
長いです。

最終的にこうなります。

参考記事
[UE4] Sequencerでカットシーン制作(4) Blueprintからの再生制御|株式会社ヒストリア
【連載】第4回:UE4のシーケンサーを使用した映像制作~ワークフロー編~ - Unreal Engine

Boss_Cutscene

ムービーなので、ほぼシーケンサーの使い方になります。  

シネマティクスから、マスターシーケンスを作成

f:id:JackpotDevelop:20210413233415j:plain
マスターシーケンスはここから作るんや
レベルシーケンスとの違いは、複数のレベルシーケンスを組み合わせてムービーを作りたいときはマスターを使うという感じです。

作成するとウインドウが出てきます。

f:id:JackpotDevelop:20210414001935j:plain:w300
マスターシーケンスのウインドウ
名前だけ「Boss_Cut」に変更して他はデフォルトです。後から変更できるので。
デフォルトだとShotというものが5つほど作成され、シーケンサータブが作成されます。
f:id:JackpotDevelop:20210414002812j:plain
マスターシーケンスの中に5つのShotが入ってます
このShotをクリックするとそれぞれにカメラが入っているので、このカメラを位置やズーム等を調整して、どこから撮って、どれくらいの長さそのカメラにするのか決めることが出来ます。
ざっくりいうと、マスターシーケンスを作ると、デフォルトでレベルシーケンスがいくつか入ったセットが出来上がるという感じです。  

ムービーが自動で開始されるように設定

シーケンスを作成すると、レベル上にシーケンサーのアイコンが出現します。
これを選択して詳細パネルを見ます。

f:id:JackpotDevelop:20210414201411j:plain:w300
シーケンサの設定
画像の通り、4か所チェックを打っておきます。 レベルの開始とともにシーケンサが自動で再生。プレイヤーは操作できないようにします。

キャラクターをアニメーションさせる

やり方としては2つあります。

DCCツールを使って、あらかじめすべて作ってしまう方法

フローについてはこちらの記事が参考になりました。

www.unrealengine.com

地形に合わせてアクションさせたり、そのカットだけで使うアニメーションを使う場合はこの方法が強いです。 作ったアニメーションを原点に置いて、再生するだけですからね。  

アニメーションBPのスロットをシーケンサー上で上書きする方法

docs.unrealengine.com

ゲーム内で使うために作成したアニメーションを使いまわして低コストでムービーを作りたいときはこの方法です。
歩く・走る・しゃべる等を再生して、足が滑らないようにトランスフォームをシーケンサーで編集します。

キャラクターの配置とアニメーション

今回はアニメーションBPを使った方法で作りたいと思います。
まずはカメラワークを決めるために、とりあえずキャラクターの動きを作ります。

この時点で、絵コンテや展開を決めておきます。 今回は、

  1. プレイヤーが扉から出てくる。
  2. ボスが上から落ちてきてプレイヤーの行く手を阻む。
  3. プレイヤーが身構える。

この流れにします。

プレイヤーのアニメーションBPをレベルに置きます。  

f:id:JackpotDevelop:20210414203611j:plain
アニメーションBPを配置

レベル上のアニメーションBPが選択された状態でシーケンサータブを開き、「+トラック」ボタンから アニメーションBPのトラックを追加します。

f:id:JackpotDevelop:20210414203907j:plain
トラックを追加

扉をシーンに追加し、アニメーションBPを初期位置に移動させました。
ここで、トランスフォームにキーを打ちます。

f:id:JackpotDevelop:20210414204409j:plain
初期位置に移動させてキーを打った

シーケンサーのカーソルを180フレーム目に移動してから、アニメーションBPを選択して前方に移動させてキーを打ちます。
すると、前のキーの位置と、現在のキーの位置を結ぶ線が出現します。

f:id:JackpotDevelop:20210414210713j:plain:w500
線が現れた
これで最初のプレイヤーの動きが出来ました。
スペースキーでシーケンサーを再生することが出来ます。移動させた位置によっては早すぎたり遅すぎたりするので、位置を調整するか、キーをドラッグアンドドロップで移動させて調整しましょう。

補間なしの動きをさせたいときは、キーにマウスを乗せて右クリックすると「キー補間」を選ぶことができます。 三角のやつにしました。

f:id:JackpotDevelop:20210414213406j:plain
キー補間をリニアにしました

アニメーションを割り当てたいところですが、先にボスの方も動きを作っておきます。
プレイヤーの時と同じように、ボスのアニメーションBPを配置し、動きを作ります。
配置したら、選択した状態でシーケンサーの「+トラック」ボタンから追加します。
上空に配置して160フレームくらいにキーを打ち、170フレームにカーソルを移動した後、プレイヤー前方に配置してキーを打ちます。

f:id:JackpotDevelop:20210414212026j:plain
ボスのキーが出来ました

再生してみると、ボスがヌルっと着地した後、プレイヤーが止まります。
とりあえずここで、それぞれの動きは完了とします。次はアニメーションです。

配置したアニメーションBPを開き、アニムグラフにスロットを追加します。
このスロットにシーケンサーからアニメーションを流し込みます。

f:id:JackpotDevelop:20210414212509j:plain:w300
スロットの追加

シーケンサーからアニメーションBPを操作する場合、もうひと手間必要になります。
アニメーションBPの詳細タブ「アニメーション」の「AnimationMode」を「Use Custome Mode」に変更します。

シーケンサーのトラックにアニメーションというトラックがあると思うので「+アニメーション」からThirdPersonWalkを選択。タイムラインにアニメーションが追加されました。

f:id:JackpotDevelop:20210414212943j:plain
アニメーション追加

再生してみて足が滑る場合は、タイムライン上のアニメーションを右クリックして、プロパティからPlay Rateを変更します。
ここではアニメーションの差し替えやアニメーション終了後の挙動等を設定することができます。

f:id:JackpotDevelop:20210414213706j:plain
アニメーションの再生速度を変更

ボスの方も落下中、着地のアニメーションを割り当てます。タイムラインに置いたアニメーションはブレンドのカーブを調整できるようになっているので調整しておきます。

f:id:JackpotDevelop:20210414214357j:plainf:id:JackpotDevelop:20210414214429j:plain
見辛いけどコレ、動かせます

アニメーションの割り当て、ブレンドをしてキャラクターの動きが完成しました。

カメラワーク

Shot1

マスターシーケンスのショットトラックから最初のショット(shot0010_01)をダブルクリックします。
CineCameraActorのトラックのカメラマークを押すと、「パイロットモード」となりカメラに乗り移って位置を変更できます。 ここで気づくのが、やたらズームされてるなぁということ。使いにくいので変更します。
CineCameraActorのトラックを選択すると詳細タブにカメラ設定が出てくるので、「現在のカメラ設定」→「レンズ設定」から「12mm Prime f/2.8」を選びます。

f:id:JackpotDevelop:20210414222050j:plain:w300
レンズ設定から拡大率を変更
視点を好きな位置に動かしたら、エディタ左上もしくは、CineCameraActorトラックのカメラマークを押してパイロットモードを解除します。

最初のショットのままだとプレイヤーが見切れてしまうので、マスターシーケンスに戻って、適度な長さに調整します。

2番目のショットを詰めて配置して、ボスが落下するキーまで伸ばします

f:id:JackpotDevelop:20210414223901j:plain
1番目と2番目のショットの長さを調整

Shot2

2番目のショットをダブルクリックして編集します。 このショットではフィールドがどんな場所かプレイヤーに見せるため、主人公を画面内に収めつつカメラを動かしてみます。 キャラクターのトランスフォームをアニメーションさせた要領で、カメラのトランスフォームを調整します。
初期位置を決めたらZ位置を下げてキーを打ちます。

f:id:JackpotDevelop:20210415013624j:plain
カメラがZ方向に下がるようにアニメーション
キャラクターの時と同様、これでアニメーションされます。
f:id:JackpotDevelop:20210415013958g:plain
Shot02の結果(ボスの足見えてる…)

Shot3

3番目のショットでは、落下してくるボスにカメラをフォーカスします。
ショット3はボスの落下のキーから着地のキーの少し後までの長さにします。

f:id:JackpotDevelop:20210415015100j:plain
ショット3の長さ

フォーカスさせるにはカメラの詳細パネルから「現在のカメラ設定」→「カメラ追跡の有効化」にチェックします。

f:id:JackpotDevelop:20210415015414j:plain
カメラ追跡の設定
「追跡するアクタ」にボスのABPを指定し、相対オフセットのZ値を変更します。
相対オフセットはデフォルトだと対称アクタの原点になっているので、Z値の調整が必要になります。

Shot4

身構えるプレイヤーを映すショットです。
ゆっくり主人公の顔にカメラを近づけます。エディタ上でカメラを選択し、ギズモの座標システムをローカルに切り替えます。カメラの正面方向に動かせるようになるので、初期位置と主人公の手前でキーを打ちます。

f:id:JackpotDevelop:20210415023354j:plainf:id:JackpotDevelop:20210415023356j:plain
ギズモをワールドからローカルに切り替える

カメラワークはこれで完成です。

仕上げ

アクタを非表示にしておく

Shot2でボスの足が見えてしまっていました。落下のアニメーションまでは非表示にしておきましょう。 ボスのアニメーションBPのトラックに可視性のトラックを追加します。

f:id:JackpotDevelop:20210415024345j:plain
Actor Hidden In Game(可視性)を追加する

「可視性」のトラックが追加されます。チェックを外した状態、つけた状態でそれぞれキーを打てば「このタイミングでは非表示」と設定することができます。Shot2の間は表示されないようにしました。

f:id:JackpotDevelop:20210415024521j:plain
可視性の切替え

フェードイン・アウトを追加

マスターシーケンサーの「+トラック」ボタンから、フェードトラックを追加します。

f:id:JackpotDevelop:20210415192406j:plain
フェードトラックを追加する
0フレームの時にフェードを1,少し後にカーソルをずらし0のキーを打ちます。
画像で赤丸で囲った部分を編集すると、カーソルの位置に自動でキーが打たれます。 トラックの色もフェードしてくれるので直感的に分かります。
f:id:JackpotDevelop:20210415192718j:plain
フェードトラックに2つキーを打った

ムービーの終わりにもフェードアウトを作りましょう

f:id:JackpotDevelop:20210415192912j:plain
フェードアウトを作りました

ディレクターブループリントでマップを読み込む

マスターシーケンサーの「+トラック」ボタンからイベントトラックを追加。

f:id:JackpotDevelop:20210415193058j:plain
イベントトラック

ムービーの一番最後にキーを打ちます。うすーくキーが作成されるのでここにマウスを重ねて右クリックします。

f:id:JackpotDevelop:20210415193344j:plain
イベントのバインド
プロパティ→アンバウンド→新規エンドポイントを作成をクリックします。
マスターシーケンサーのディレクターブループリントが開くので、OpenLevelノードを追加します。
f:id:JackpotDevelop:20210415193839j:plain
OpenLevelでボス戦のマップを読み込む

このイベントトラックは割といろんなことに使うことが出来て、アニメーションに合わせてエフェクトをスポーンしたり、音を出したりブループリントで出来ることがなんでも割り当てられます。 詳しい実装は公式ドキュメント見て…!
イベント トラック | Unreal Engine ドキュメント

完成

冒頭でも載せたましたが、完成したのがこちら。

 

まとめ

今回はムービー用のマップとボス戦のマップを別に作りましたが、サブレベルの読み込みを制御することでひとつのマップで行うことも可能だと思います。
(プレイヤーの入力、UIの表示、シーケンサーで変更したポストプロセスなどちゃんと戻す必要があります)
また、死んで再度訪れた際、ムービーを流してほしくない場合は、BP_LevelChangerで読み込むマップを変えておくといいでしょう。