UE4 Saitama 初心者向けハンズオン #5 で使用したスライド資料です。

1. UE4 SAITAMA 初心者向けハンズオン #5

2. UNREAL ENGINE 4 MEETUP SAITAMAとは？
埼玉では、「UE4について開発者、興味を持っている人と直接会っ
て色々コミニケーションをしたい」という方針の元、定期的にUE4につ
いて共通の興味関心や問題意識等を話し合うことを重視したイベン
トにする予定
※個人的な方針として、2018年5月までは、どんな結果になろうとも
月１でやっていく予定
（来年以降は好評なら続けていくかも）

3. 今回のアジェンダ
・UE4エディター操作説明（約３０分）
UE4エディターを扱う上でよく使う操作方法を一通り実施します
（一度も触ったことがない人がいる場合）
・アニメーションモンタージュ(Slotアニメーション)でコンボを作る
※時間が余ったら各自自習

4. UE4エディター操作説明
https://www.slideshare.net/yuukiogino/unreal-engine-63538268

5. アニメーションモンタージュ(Slotアニメーション)で
コンボを作る

6. アニメーションモンタージュ(Slotアニメーション)でコンボを作る
下記スライドを多く引用させていただいております。
引用項目が多いので、ここで一括紹介させていただきます。
猫でも分かる UE4のAnimation Blueprintの運用について
https://www.slideshare.net/EpicGamesJapan/ue4animation-blueprint

7. 下記スライドを多く引用、また今回のハンズオンで使用します。
引用項目が多いので、ここで一括紹介させていただきます。
UE4勉強会 IN 大阪 - アニメーション基礎
https://www.slideshare.net/com044/ue4-in-91056422

8. アニメーションBPの復習※今回アニメーションBPを多用するのでおさらい
その前に……

9. スケルタルメッシュのアニメーション システム（おさらい）
UE4 のアニメーション システムは、いくつかのアニメーション ツールとエディタで構成
され、メッシュのスケルタルベースの変形をモーフベースの頂点変形と混合して複雑
なアニメーションを実現するための機能。（公式より一部引用）

10. アニメーション作成（おさらい）
コンテンツで右クリック→アニメーション

11. アニメーションBP（おさらい）
コンテンツで右クリック→アニメーション→アニメーションBP
でアニメーションBPを作成できます

12. ビューポートの基礎操作（おさらい）
エディターと同じ
マウス左+ドラッグ ：前後移動、左右回転
マウス右+ドラッグ ：上下左右回転
マウス中スクロール ：前後移動
マウス中+ドラッグ ：上下左右移動
Lキー+マウス左+ドラッグ ：ライト方向を回転

13. グラフの基礎操作（おさらい）
ブループリントエディターとほぼ一緒
何もないところで右クリック ：ノード検索
マウス左+ドラッグ ：ノードの複数選択
ピンの上でマウス左+ドラッグ：ノードの線を引く
→ピンの上にドラッグした場合、ピンをつなぐ
線の上でダブルクリック ：リルートノード(Add Rerote Node)

14. グラフの基礎操作（おさらい）
※一部アニメーションBPに
対応していないノードがあ
ります

15. アニメーションBPの中身（おさらい）
まず、ThirdPerson_AnimBPの中身を見て処理の流れを理解しましょう

16. アニメーションBP・イベントグラフ（おさらい）
通常のBPとほぼ一緒。アニメーション再生の条件を記述する

17. アニメーションBP・イベントグラフ（おさらい）

18. アニメーションBP・アニムグラフ（おさらい）
アニメーション再生を記述。最終アニメーションポーズにつなげることで
アニメーション結果がViewに再生される

19. ステートマシン（おさらい）
スケルタルメッシュのアニメーションを一連のステートへ分割するグラフィカルな手法
複雑なアニメーション遷移を制御できる

20. トランジションルール（おさらい）
ステートへ遷移するための条件式
復習はここまで

21. Slotアニメーション

22. Slotアニメーション
汎用的に繋げないといけないアニメーションをステートだけで組むと……

23. Slotアニメーション
かなり複雑になっていく……

24. Slotアニメーション
やりすぎるとこんな感じに……

25. これを見た実装者はこうなる↓

26. Slotアニメーション
解決策の一つとして、Slot機能を使う

27. Slotアニメーション
イベントグラフから任意のタイミングで呼び出せる。元のステート状態は維持される
Unityが分かる人ならAnyStateによく似た機能
通常のアニムグラフ(ステート)の流れ
イベントグラフから
スロット呼び出し
Slot1の流れ
アニメーション再生
Slot2の流れ
アニメーション再生
イベントグラフから
スロット呼び出し

28. Slotの設定
アニメーション系（アニメーションBP、アニメーションシーケンス等）から
ウィンドウ→アニメーションスロットマネージャー

29. Slotの設定
スロットを追加、グループを追加で新規に作ることが可能
移動、削除は右クリックのメニューから

30. Slotの設定
アニムグラフから、『スロット（DefaultSlot）』を検索

31. Slotの設定
スロットを経由するように繋ぎなおせば準備OK
スロットは詳細→Settings→Slot Nameを変えることで切替が可能

32. Slotの設定 おまけ
スロットは複数繋げることも可能
※Slotアニメーションの合成は特殊な組み方をするので、後述

33. Slotアニメーション再生

34. Slotアニメーションの呼び方
※今回、シーケンサーは触れません

35. AnimMontageでSlotアニメーション再生

36. AnimMontage
AnimMontage (アニム モンタージュまたは略してモンタージュ) は、幅広いアニ
メーション エフェクトを有効にする多目的ツール
※公式ページより引用

38. AnimMontage
コンテンツで右クリック→アニメーション→アニメーションモンタージュ

42. AnimMontage セクションの追加
セクション トラック（一番上）で右クリック→新規モンタージュセクション
名前入力は任意

43. AnimMontage セクションの分割
×ボタンをクリックすることでセクションを分割できる

44. AnimMontage セクションの結合
繋げたいセクショントラックをクリック→繋げるセクション（深緑）をクリック

45. AnimMontage 通知
通知トラックで右クリック→メニュー表示
通常の通知に「Montage Notify」、ステートに「Montage Notify Window」が追加
※通知の詳細は後述

46. AnimMontage 再生
イベントグラフでMontage Playノードを呼び出し

48. AnimMontage 再生
Montage Jump to Sectionノード（Anim Motage再生時のみ有効）
指定したセクションのアニメーションを再生（すぐ実行される）

49. AnimMontage 再生
Montage Jump to Section Endノード（Anim Motage再生時のみ有効）
指定したセクションのアニメーションの最後に飛ぶ（すぐ実行される）

50. AnimMontage 再生
Montage Set Next Sectionノード（Anim Motage再生時のみ有効）
指定したセクション(Section Name to Change)の再生終了後に再生するセクション
(Next Section)を指定（セクションの結合を動的に行ってる感じ）

51. AnimMontage 再生
Montage Pauseノード（Anim Motage再生時のみ有効）：AnimMontageの一時停止
Montage Resumeノード（Anim Motage再生時のみ有効） ：一時停止からの再開

52. AnimMontage 再生
Montage Stopノード（Anim Motage再生時のみ有効）
AnimMontageの再生停止（Montage Resumeノードで続きから再生されない）

53. AnimMontage 再生
Play Montage ノード
Montage Playノードと同じく、AnimMontageの再生ができる
違いは開始のセクションが指定できる、任意のタイミングで実行処理が呼ばれる等

54. AnimMontage 再生
通常のFunction：
ノード実行後に呼び出し。
タイムラインとは違い、再生時間毎には呼ばれない
On Completed：
再生終了時に呼び出し
On Blend Out:
最後のアニメーションブレンドが終了したら呼び出し
On Interupted:
ちょっとよくわからない。後回し
On Notify Begin:
Montage Notify、Montage Notify Windowの起点から呼び出し
On Notify End:
Montage Notify Windowの終わりで呼び出し
Notify Name:Montage Notify(Window)で設定した名前が取れる

55. AnimMontage 通知(改めて)
Montage Notify
通知トラックで右クリック→通知を追加→Montage Notify
Anim Montageのみの既存通知

56. AnimMontage 通知(改めて)
Montage Notify
通常の通知と違い、イベントによる呼び出しが不可。
その代わりPlay Motageノードから通知が呼び出される。
詳細のNotify Nameで任意の名前を設定。この値がPlay Motageノードで渡される。

57. AnimMontage 通知(改めて)
Montage Notify Window
通知トラックで右クリック→通知ステートを追加→Montage Notify Window
Anim Montageのみの既存通知

58. AnimMontage 通知(改めて)
Montage Notify Window
通知トラックで右クリック→通知ステートを追加→Montage Notify Window
Anim Montageのみの既存通知

59. AnimMontage 通知(改めて)
Montage Notify Window
通常の通知と違い、イベントによる呼び出しが不可。
その代わりPlay Motageノードから通知が呼び出される。
詳細のNotify Nameで任意の名前を設定。この値がPlay Motageノードで渡される。
ステートの終点も取れるので、ボタン入力受付終了とかに利用できる

60. AnimMontage 通知
カスタム通知
基本的にアニメーションシーケンスと同じ。

61. 通知(復習)
アニメーションからアニメーションBPに任意のタイミングで通知ができる
カスタム通知はイベントグラフでイベントとして呼び出し可

62. 通知
Montage Tick Type
詳細→Category
通知のトリガータイミング
Queued：非同期の通知。通知が来るタイミングにずれがあるが処理は軽い。
Branching Point:同期の通知。時間通りに通知が来るが処理が重い。
格ゲーとか正確に入力のタイミングを取る場合はBranching Pointがお勧め

63. BluePrintだけでSlotアニメーション再生

64. Play Slot Animation
任意のアニメーションを指定したスロットで再生
アニメーションのループ不可、ワンショットスタイルのアニメーション用

65. Play Slot Animation as Dynamic Montage
任意のアニメーションを指定したスロットで再生
違いはMontage Animationを動的生成する（セクション名は「Default」のみ）

66. Play Slot Animation as Dynamic Montage
上記の設定でMontage(Slot)Animationをループ再生させることが可能
ただし、動的生成はコスト高いので多用はしないこと

67. Stop Slot Animation
指定したスロットのアニメーション再生をストップする

68. Slotアニメーションをブレンド

69. Slotアニメーションのブレンド
必ずSourceにアニメーションを繋げる必要があるため、ブレンドするためには
アニメーションをキャッシュする必要がある

70. アニメーションをキャッシュする
アニムグラフからローカルにアニメーションをキャッシュして呼び出す

71. アニメーションをキャッシュする
アニムグラフから「新規保存のキャッシュされたポーズ」（日本語）を検索

72. アニメーションをキャッシュする
ステートマシーンから「新規保存のキャッシュされたポーズ」を繋げる

73. アニメーションをキャッシュする
Save chachedで「キャッシュしたポーズを使用」のノードを検索

74. アニメーションをキャッシュする
「キャッシュしたポーズを使用」をSourceに結合

75. Slotアニメーションでコンボを作ってみる実装の参考例

86. 実装例（ハンズオンで行った内容）
アニメーションBPにカスタムイベントを追加

87. 実装例（ハンズオンで行った内容）
作成したAnimMontageにカスタム通知を追加
例）
ComboStart:ボタン入力開始したい時に使用するカスタム通知
ComboEnd:ボタン入力の受付を終了したい時に使用するカスタム通知

88. 実装例（ハンズオンで行った内容）
キャラクタークラス（SampleだとSideScrollerCharacter）を開く
『Q』の入力イベントを取得し、先ほど作成したカスタムイベントを呼び出す

89. 実装例（ハンズオンで行った内容）
アニメーションBPに戻り、カスタムイベントから上記画像の通り処理を追加する
先ほど追加したカスタム通知を呼び出し、上記画像の通り処理を繋げる

90. 実装例（ハンズオンで行った内容）
Qを押すとアニメーションが遷移し、アニメーションのコンボ攻撃ができる
・再生できない場合で考えられるケース
Slotがアニムグラフに未設定
通知が呼ばれるタイミングが違う（通知の位置ずれ）
通知が呼ばれるタイミングが遅すぎてAnimMontageの再生が終了している
（セクションの最後辺りで通知を呼び出してる等）

91. これでコンボアニメーションができたぁ！
カスタム通知を利用すれば、当たり判定（コリジョン）の有効化、無効化をする
ことも可能！
今回実装したのは入力受付時間内にボタンが押せれば、現在のセクション再生を
キャンセルし、次のセクションを再生する、というもの
→某ゲームの「目押しコンボ」に近い
先ほどのスクリプトを拡張することにより、コンボの入力受付の「ルール（仕
様）」を変えることも可能なので、暇があったら挑戦してみてください

92. おまけ

93. おまけ

94. おまけ
First Socket NameとSecond Socket Nameにボーン名を入れ、Trail用に再生する
エフェクトをセット
※エフェクトにTrail用の設定がなければ表示できません。

95. 今回はここまで
今回ハンズオンでSlotアニメーションを一通り触ってみました。
これで
アクションゲームでコンボを繋げる
任意のタイミングでダメージアニメーション等の汎用的に呼び出す必要のある
アニメーション再生の実装
が出来るはずです。
気になった方は公式ドキュメントを読みましょう！

96. 公式ドキュメントリンク
スケルタルメッシュのアニメーション システム
http://api.unrealengine.com/JPN/Engine/Animation/
アニメーション システムの概要
http://api.unrealengine.com/JPN/Engine/Animation/Overview/index.html
アニム モンタージュ
http://api.unrealengine.com/JPN/Engine/Animation/AnimMontage/