豚×京都 ~UE4でなろう破壊神~ 【UE4 VFX Art Dive 2020】

41K Views

July 06, 20

スライド概要

講演動画はこちら
https://youtu.be/6SoaPTX_vvw

スライドデータはこちらからダウンロード可能です
https://epicgames.box.com/s/locsql9m36jcx0rx5xsj9ia85hk2p8cl

発表者:斎藤 修(Epic Games Japan)
本スライドは2020年7月5日に行われた勉強会「 UE4 VFX Art Dive Online」の講演資料となります。

profile-image

Unreal Engineを開発・提供しているエピック ゲームズ ジャパンによる公式アカウントです。 勉強会や配信などで行った講演資料を公開しています。 公式サイトはこちら https://www.unrealengine.com/ja/

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
1.

豚×京都 ~UE4でなろう破壊神~ Epic Games Japan Technical Artist - Developer Relations 斎藤 修

2.

自己紹介 斎藤 修 https://twitter.com /shiba_zushi Epic Games Japan Technical Artist - Developer Relations ● 2019年6月からEpicに入りました ● それまでは規模大きめのコンソール開発してました ● その前は漫画とか描いてました ● UE4とHoudiniが好物です #UE4 | @UNREALENGINE

3.

はじめに #UE4 | @UNREALENGINE

4.

はじめに 破壊って #UE4 | @UNREALENGINE いいですよね…

5.

はじめに #UE4 | @UNREALENGINE

6.

はじめに 皆さんもとにかく物を破壊したくなったこと ありますよね? #UE4 | @UNREALENGINE

7.

はじめに 人は内なる破壊衝動を秘めているものです #UE4 | @UNREALENGINE

8.

はじめに しかしここ法治国家日本では 勝手に物を壊すと怒られます #UE4 | @UNREALENGINE

9.

はじめに なので #UE4 | @UNREALENGINE UE4を使って破壊しましょう!

10.

今日話すこと #UE4 | @UNREALENGINE

11.

今日話すこと ・豚を使って京都の街並みを破壊する方法 #UE4 | @UNREALENGINE

12.

今日話すこと ・豚を使って京都の街並みを破壊する方法 →UE4における破壊に関する機能 ワークフローの紹介 #UE4 | @UNREALENGINE

13.

今日話すこと ・豚を使って京都の街並みを破壊する方法 →UE4における破壊に関する機能 ワークフローの紹介 #UE4 | @UNREALENGINE Rigid Body Soft Body Fluid FBX Alembic VAT Niagara Raymarching Houdini PhysX Chaos etc...

14.

はじめに というわけで #UE4 | @UNREALENGINE

15.

はじめに #UE4 | @UNREALENGINE

16.

はじめに #UE4 | @UNREALENGINE

17.

はじめに #UE4 | @UNREALENGINE

18.

はじめに #UE4 | @UNREALENGINE

19.

はじめに 壊しました! #UE4 | @UNREALENGINE

20.

はじめに この作例を通して解説をしていこうと思います #UE4 | @UNREALENGINE

21.

はじめに まずはじめに 私の中の破壊神は仰られました #UE4 | @UNREALENGINE

22.

はじめに 美しいものを 壊しなさい まずはじめに 私の中の破壊神は仰られました #UE4 | @UNREALENGINE

23.

はじめに というわけで 使用させて頂いていたのは京都の美麗アセット #UE4 | @UNREALENGINE

24.

はじめに 作者の方には豚で壊す許可を頂いております #UE4 | @UNREALENGINE

25.

はじめに では #UE4 | @UNREALENGINE 早速破壊を……

26.

はじめに お待ちなさい #UE4 | @UNREALENGINE

27.

はじめに もしかするとよくあるやり取り #UE4 | @UNREALENGINE

28.

はじめに ねえ この建物ぶっ壊したいんだけど ちゃちゃっとやっといてくれない? モデルあるからすぐ壊せるでしょ? #UE4 | @UNREALENGINE

29.

はじめに 罪 #UE4 | @UNREALENGINE

30.

はじめに モデルは破壊readyにする必要があります #UE4 | @UNREALENGINE

31.

破壊readyとは? ・モデルが閉じていること ・モデルがめり込んでないこと #UE4 | @UNREALENGINE

32.

なぜ?? 破壊とは つまり 「物理的」なシミュレーションです #UE4 | @UNREALENGINE

33.

なぜ?? モノの形状、構造、質量 それらが正しくなければ 正しいシミュレーションは行なえません #UE4 | @UNREALENGINE

34.

なぜ?? 適切な形で めり込みのない 物理的に正しいモデルにする必要があります #UE4 | @UNREALENGINE

35.

モデルの準備 今回のこちらの美しい京都アセット 美しいだけではなくゲーム用に「最適化」されています #UE4 | @UNREALENGINE

36.

モデルの準備 ゲーム用のアセットは最適化のために 見えないところは消していたり 一体化させてたりします #UE4 | @UNREALENGINE

37.

モデルの準備 なので これを そのままシミュレーションすると…… #UE4 | @UNREALENGINE

38.

モデルの準備 ばーん #UE4 | @UNREALENGINE

39.

モデルの準備 正しくシミュレートするとこちら #UE4 | @UNREALENGINE

40.

モデルの準備 物理的に正しいモデル #UE4 | @UNREALENGINE とても大事ですね

41.

モデルの準備 では 先程の家一軒を破壊readyにする為に どれくらいの対応が必要か? #UE4 | @UNREALENGINE

42.

モデルの準備 ノード全体図 #UE4 | @UNREALENGINE

43.

モデルの準備 シミュレーション設定 #UE4 | @UNREALENGINE

44.

モデルの準備 モデル対応 #UE4 | @UNREALENGINE シミュレーション設定

45.

モデルの準備 対応が必要だった箇所を可視化してみます #UE4 | @UNREALENGINE

46.

モデルの準備 こちらの家 #UE4 | @UNREALENGINE

47.

モデルの準備 パーツ単位で並べると #UE4 | @UNREALENGINE こうなります

48.

モデルの準備 赤色が #UE4 | @UNREALENGINE 破壊readyではないパーツです

49.

モデルの準備 モデルを裏側から見てみる #UE4 | @UNREALENGINE

50.

モデルの準備 厚み0(ペラポリ) 一体成型された瓦 裏面ポリなし 一枚ポリで まとめられた板壁 見えてない箇所は 天井がない 閉じられていない ぶっさしモデル 見えてない箇所は 壁がない 地面へのめり込み モデルを裏側から見てみる #UE4 | @UNREALENGINE

51.

モデルの準備 厚み0(ペラポリ) 一体成型された瓦 裏面ポリなし 一枚ポリで まとめられた板壁 見えてない箇所は 天井がない 見えてない箇所は 壁がない これらは全て #UE4 | @UNREALENGINE 閉じられていない ぶっさしモデル 地面へのめり込み 非常に丁寧な「最適化」です

52.

伝えたいこと 最適化したアセットを あとから破壊readyにするのは大変です #UE4 | @UNREALENGINE

53.

伝えたいこと 破壊は #UE4 | @UNREALENGINE 計画的に

54.

伝えたいこと ちなみに #UE4 | @UNREALENGINE この作例の場合

55.

伝えたいこと 画面内だけでも100overのモデルが使用されています #UE4 | @UNREALENGINE

56.

伝えたいこと 可能な限り自動化しましたが とても大変でした… #UE4 | @UNREALENGINE

57.

モデルの準備 さらに次の落とし穴 #UE4 | @UNREALENGINE

58.

モデルの準備 これ 破砕readyのモデル UE4でレイアウトしといたから いい感じに壊しといて #UE4 | @UNREALENGINE

59.

モデルの準備 愚か #UE4 | @UNREALENGINE

60.

モデルの準備 Twitterでの投稿 #UE4 | @UNREALENGINE

61.

モデルの準備 Twitterでの投稿 #UE4 | @UNREALENGINE

62.

モデルの準備 UE4にモデルをインポートすると 基本的には全て三角化されます #UE4 | @UNREALENGINE

63.

モデルの準備 これらの三角ポリゴンは全てバラバラですが #UE4 | @UNREALENGINE

64.

モデルの準備 「Remove Degenerates」のチェックを入れると 位置、UV、ノーマルなどが同じ頂点は結合されます #UE4 | @UNREALENGINE

65.

モデルの準備 つまり UE4にインポートするという事は 元のモデルとは全く違うモデルが生成されるという事です #UE4 | @UNREALENGINE

66.

モデルの準備 さらに エクスポート時にUE4は 気を利かせて頂点融合してからエクスポートします #UE4 | @UNREALENGINE

67.

モデルの準備 具体例を出しますと 例えばこのモデルは UE4に入れて出すとこうなって出てきたりします #UE4 | @UNREALENGINE

68.

モデルの準備 #UE4 | @UNREALENGINE

69.

モデルの準備 愚か #UE4 | @UNREALENGINE

70.

モデルの準備 ちなみに対処方法 #UE4 | @UNREALENGINE

71.

モデルの準備 UE4からエクスポートしたFBXには 各トランスフォーム情報が含まれています #UE4 | @UNREALENGINE

72.

モデルの準備 UE4からエクスポートしたFBXには 各トランスフォーム情報が含まれています #UE4 | @UNREALENGINE

73.

モデルの準備 これを使って変換行列を作れば 元モデルからレイアウトを再現することが可能です #UE4 | @UNREALENGINE

74.

モデルの準備 https://twitter.com/shiba_zushi/status/1257055294095413248?s=20 詳しくは上記連続ツイートをどうぞ #UE4 | @UNREALENGINE

75.

伝えたいこと 破壊は #UE4 | @UNREALENGINE 計画的に

76.

ワークフロー さて 数々の地雷をくぐり抜け ようやく美しき京都アセットが破壊readyとなりました #UE4 | @UNREALENGINE

77.

ワークフロー UE4で破壊表現する場合 大きく分けて2つのワークフローがあります #UE4 | @UNREALENGINE

78.

ワークフロー UE4で破壊表現する場合 大きく分けて2つのワークフローがあります 事前に破壊する #UE4 | @UNREALENGINE リアルタイムに破壊する

79.

ワークフロー UE4で破壊表現する場合 大きく分けて2つのワークフローがあります 事前に破壊する リアルタイムに破壊する FBX Niagara Alembic PhysX VAT Chaos #UE4 | @UNREALENGINE

80.

ワークフロー 今回の作例は「事前に破壊する」を採用しています 事前に破壊する リアルタイムに破壊する FBX Niagara Alembic PhysX VAT Chaos #UE4 | @UNREALENGINE

81.

ワークフロー Niagaraによるリアルタイム破砕は このあと池田さんの講演で事例がご紹介されます! 事前に破壊する リアルタイムに破壊する FBX Niagara Alembic PhysX VAT Chaos #UE4 | @UNREALENGINE

82.

ワークフロー PhysXとChaosは? 事前に破壊する リアルタイムに破壊する FBX Niagara Alembic PhysX VAT Chaos #UE4 | @UNREALENGINE

83.

ワークフロー …… #UE4 | @UNREALENGINE

84.

ワークフロー こちらの家で検証を行いました #UE4 | @UNREALENGINE

85.

ワークフロー https://www.youtube.com/watch?v=4xUAueQigbo まず上のHoudiniEngineを使う手法で モデルをシミュレート可能なStaticMesh群に変換 #UE4 | @UNREALENGINE

86.

ワークフロー PhysXの場合は約2000弱パーツのStaticMesh #UE4 | @UNREALENGINE

87.

ワークフロー Chaosの場合はそれをGeometryCollection化しました #UE4 | @UNREALENGINE

88.

ワークフロー PhysXの場合(4.25.0) #UE4 | @UNREALENGINE

89.

ワークフロー Chaosの場合(4.25.0) #UE4 | @UNREALENGINE

90.

ワークフロー …… #UE4 | @UNREALENGINE

91.

ワークフロー https://docs.unrealengine.com/ja/Engine/Chaos/ChaosDestruction/index.html #UE4 | @UNREALENGINE

92.

ワークフロー https://docs.unrealengine.com/ja/Engine/Chaos/ChaosDestruction/index.html 現在Chaosはベータ機能となっております #UE4 | @UNREALENGINE

93.

ワークフロー 特にGeometryCollection周りの挙動は マイナーバージョンごとでもどんどん改善されております #UE4 | @UNREALENGINE

94.

ワークフロー Chaosについては また別の機会に 掘り下げてお話させて頂けましたら #UE4 | @UNREALENGINE

95.

ワークフロー https://docs.unrealengine.com/ja/Engine/Chaos/ChaosDestruction/index.html 今すぐにでも触りたいという方は #UE4 | @UNREALENGINE こちら

96.

ワークフロー では「事前に破壊する」ワークフローについて 事前に破壊する リアルタイムに破壊する FBX Niagara Alembic PhysX VAT Chaos #UE4 | @UNREALENGINE

97.

事前破壊 「事前に破壊する」場合 破壊シミュレーション自体は 各DCCツールなどで行っておく必要があります #UE4 | @UNREALENGINE

98.

事前破壊 今回はHoudiniを利用しました #UE4 | @UNREALENGINE

99.

事前破壊 https://www.sidefx.com/ja/products/houdini/whats-new-in-18/ Houdini18より追加されたデストラクション系の機能は 非常に簡単にRBDシミュレーションを組むことが可能です #UE4 | @UNREALENGINE

100.

事前破壊 設定これだけ モデルさえ破壊readyであれば シミュレーションはさほど難しくないです #UE4 | @UNREALENGINE

101.

事前破壊 https://www.sidefx.com/ja/products/houdini/whats-new-in-18/ SideFX Labsを使うと デストラクションデータのエクスポートも非常に簡単です #UE4 | @UNREALENGINE

102.

事前破壊 破壊シミュレーションが用意できたら UE4へインポートして実装していきます #UE4 | @UNREALENGINE

103.

事前破壊 今回検証した実装方法は以下の3種類 事前に破壊する リアルタイムに破壊する FBX Niagara Alembic PhysX VAT Chaos #UE4 | @UNREALENGINE

104.

事前破壊 これらの手法 実装方法は異なりますが 見た目としてはほぼ同じです #UE4 | @UNREALENGINE

105.

事前破壊 それぞれの手法の特徴をご説明します FBX Alembic VAT データサイズ ? ? ? 処理負荷 ? ? ? 作業コスト ? ? ? #UE4 | @UNREALENGINE

106.

FBX まずはFBXから FBX Alembic VAT データサイズ ? ? ? 処理負荷 ? ? ? 作業コスト ? ? ? #UE4 | @UNREALENGINE

107.

FBX FBXと分類していますが 実装としては スケルタルメッシュによるボーンアニメーションです #UE4 | @UNREALENGINE

108.

FBX 破壊モーションはHoudiniで作成し 「Side FX Labs」の 「RBD to FBX」でFBXエクスポートしています #UE4 | @UNREALENGINE

109.

FBX https://www.sidefx.com/ja/tutorials/game-tools-rbd-to-fbx/ 「RBD to FBX」に関してはこちらをご参照下さい #UE4 | @UNREALENGINE

110.

FBX UE4はオブジェクトにアニメーションがベイクされていると スキニングしなくても自動的にボーンを作成してくれます #UE4 | @UNREALENGINE

111.

FBX その際 ルートが原点にできるので アニメーション精度やバウンズにはご注意下さい #UE4 | @UNREALENGINE

112.

FBX また スケルタルアニメーションのメリットとしては ノーティファイを打てる事も挙げられると思います #UE4 | @UNREALENGINE

113.

FBX エフェクトを骨やソケットにアタッチ可能な点も 非常に使い勝手が良いのではないかと思います #UE4 | @UNREALENGINE

114.

FBX また スケルタルアニメーションは アニメーション圧縮が可能な点も強力なメリットです #UE4 | @UNREALENGINE

115.

FBX http://hogetatu.hatenablog.com/entry/2018/12/05/000944 アニメーション圧縮の詳細に関しましては こちらが非常に素晴らしい記事です #UE4 | @UNREALENGINE

116.

FBX 詳細は記事を見て頂けたらと思うのですが 破壊はアニメーションが曖昧でもバレにくく ボーン階層も浅いので PerTrackで荒く圧縮をかけてもいいと思います #UE4 | @UNREALENGINE

117.

FBX また 処理負荷に関しては主にCPUコストとして出てきます #UE4 | @UNREALENGINE

118.

FBX タスクスレッドで 並列処理される アニメーション更新処理 また 処理負荷に関しては主にCPUコストとして出てきます #UE4 | @UNREALENGINE

119.

FBX レンダースレッドで処理される GPUスキニング更新処理 タスクスレッドで 並列処理される アニメーション更新処理 また 処理負荷に関しては主にCPUコストとして出てきます #UE4 | @UNREALENGINE

120.

FBX スケルタルアニメーションの負荷はボーン数に依存します GPUスキニング更新処理は並列化されない点もご注意下さい #UE4 | @UNREALENGINE

121.

FBX という感じで凄くざっくりとまとめますと… FBX Alembic VAT データサイズ ? ? ? 処理負荷 ? ? ? 作業コスト ? ? ? #UE4 | @UNREALENGINE

122.

FBX という感じで凄くざっくりとまとめますと… FBX データサイズ ○ 処理負荷 ? 作業コスト ? #UE4 | @UNREALENGINE Alembic VAT ? ○ アニメーション圧縮が 可能なので ? ? 長尺で有利 ? ?

123.

FBX という感じで凄くざっくりとまとめますと… データサイズ FBX Alembic VAT ○ ? ? 処理負荷 ○ 作業コスト ? #UE4 | @UNREALENGINE 懸念はCPUによる ? ? アニメーション更新コストと GPUスキニング更新コスト (特別重いという事はないです) ? ?

124.

FBX という感じで凄くざっくりとまとめますと… FBX Alembic VAT データサイズ ○ ? ? 処理負荷 ○ ? 作業コスト △ #UE4 | @UNREALENGINE ? パーツ数が多いと インポート処理が結構大変 ? ? 実装手順もそれなりに多い

125.

FBX FBXはこんな感じです! FBX Alembic VAT データサイズ ○ ? ? 処理負荷 ○ ? ? 作業コスト △ ? ? #UE4 | @UNREALENGINE

126.

Alembic では次にAlembic FBX Alembic VAT データサイズ ○ ? ? 処理負荷 ○ ? ? 作業コスト △ ? ? #UE4 | @UNREALENGINE

127.

Alembic https://docs.unrealengine.com/ja/Engine/Content/Importing/AlembicImporter/index.html はじめに #UE4 | @UNREALENGINE Alembicインポータはデフォルトで使用できますが 「実験的機能」である点はご考慮下さい

128.

Alembic また Alembicには3種のインポート方法があります #UE4 | @UNREALENGINE

129.

Alembic 今回はこちらのジオメトリキャッシュを使用しています #UE4 | @UNREALENGINE

130.

Alembic FBX Alembic VAT レベルに配置するとこんな感じです #UE4 | @UNREALENGINE

131.

Alembic 破壊モーションはFBXと同じくHoudiniで作成したものを 「Alembic」ノードでabcエクスポートしています #UE4 | @UNREALENGINE

132.

Alembic 作成したabcファイルは ドラッグ&ドロップで そのままインポートできます マテリアルはフェイスセット によって分けられるので 作成するのを忘れないように ご注意下さい #UE4 | @UNREALENGINE

133.

Alembic また ジオメトリキャッシュは モデルやモーションのプレビューができない点が若干困ります #UE4 | @UNREALENGINE

134.

Alembic シーケンサーのジオメトリキャッシュトラックを使うと プレビューが簡単にできて便利です #UE4 | @UNREALENGINE

135.

Alembic FBX Alembic ジオメトリキャッシュで気をつけるべき点といえば やはり肥大しがちなデータサイズです #UE4 | @UNREALENGINE

136.

Alembic レンダースレッドと タスクスレッドで 大量に処理されている デコード処理など また 並列処理されていますが 頂点全てを操作する為処理負荷も高めです #UE4 | @UNREALENGINE

137.

Alembic という感じでざっくりとまとめますと… FBX Alembic VAT データサイズ ○ ? ? 処理負荷 ○ ? ? 作業コスト △ ? ? #UE4 | @UNREALENGINE

138.

Alembic という感じでざっくりとまとめますと… データサイズ FBX Alembic VAT ○ ✕ ? ○ ? ? △ ? ? 頂点ごとのデータを持つため 処理負荷 データサイズは重い 作業コスト #UE4 | @UNREALENGINE

139.

Alembic という感じでざっくりとまとめますと… FBX Alembic VAT ○ ✕ ? 処理負荷 ○ △ ? 作業コスト △ ? ? 頂点ごとに処理されるため データサイズ 処理負荷も重め #UE4 | @UNREALENGINE

140.

Alembic という感じでざっくりとまとめますと… データサイズ FBX Alembic VAT ○ ✕ ? ○ △ ? △ ○ ? インポート処理が比較的早く 処理負荷 エクスポートも簡単 作業コスト #UE4 | @UNREALENGINE

141.

Alembic Alembicはこんな感じです! FBX Alembic VAT データサイズ ○ ✕ ? 処理負荷 ○ △ ? 作業コスト △ ○ ? #UE4 | @UNREALENGINE

142.

VAT 最後にVAT FBX Alembic VAT データサイズ ○ ✕ ? 処理負荷 ○ △ ? 作業コスト △ ○ ? #UE4 | @UNREALENGINE

143.

VAT VATとはVertex Animation Textureの略で 頂点シェーダーを利用してオフセット表現を行う手法の事です #UE4 | @UNREALENGINE

144.

VAT VATの仕組みに関してはこのあと池田さん 宮本さんの講演で とても丁寧にご説明されておりますので 是非そちらをご覧下さい #UE4 | @UNREALENGINE

145.

VAT 破壊モーションはこれまで同様Houdiniで作成し 「Side FX Labs」の「Vertex Animation Textures ROP」で エクスポートしています #UE4 | @UNREALENGINE

146.

VAT VATテクスチャはインポート後 非圧縮 リニア ニアレストに設定 #UE4 | @UNREALENGINE

147.

VAT VATマテリアルは「Vertex Animation Textures ROP」の テキストをエディタにコピペするだけで簡単に作れます #UE4 | @UNREALENGINE

148.

VAT FBX Alembic VAT データサイズは RBDに関して言えば VATはかなりリーズナブルです #UE4 | @UNREALENGINE

149.

VAT 処理負荷もVATは基本的に全てGPUで処理されるので CPU負荷はほとんどありません #UE4 | @UNREALENGINE

150.

VAT という事でざっくりとまとめますと… FBX Alembic VAT データサイズ ○ ✕ ? 処理負荷 ○ △ ? 作業コスト △ ○ ? #UE4 | @UNREALENGINE

151.

VAT という事でざっくりとまとめますと… FBX データサイズ Alembic ○RBDは破片単位で ✕ ピクセルを持つので データサイズは小さい VAT ○ 処理負荷 ○ △ ? 作業コスト △ ○ ? #UE4 | @UNREALENGINE

152.

VAT という事でざっくりとまとめますと… データサイズ 処理負荷 作業コスト #UE4 | @UNREALENGINE FBX Alembic VAT ○ ✕ ○ ○ △ ◎ △ ○ ? 処理負荷はGPUに依存する 現行コンソールなどであれば 概ね最軽量と考えて良い

153.

VAT という事でざっくりとまとめますと… データサイズ 処理負荷 作業コスト #UE4 | @UNREALENGINE FBX Alembic VAT ○ ✕ ○ ○ △ ◎ △ ○ ✕ マテリアルやテクスチャの 適切な設定と管理が大変 エクスポートも 問題が発生しやすい

154.

VAT VATはこんな感じです! FBX Alembic VAT データサイズ ○ ✕ ○ 処理負荷 ○ △ ◎ 作業コスト △ ○ ✕ #UE4 | @UNREALENGINE

155.

ワークフロー かなり雑な比較ですので あくまで参考程度に… FBX Alembic VAT データサイズ ○ ✕ ○ 処理負荷 ○ △ ◎ 作業コスト △ ○ ✕ #UE4 | @UNREALENGINE

156.

ワークフロー ちなみに もしここにリアルタイム破壊を入れた場合… FBX Alembic VAT PhysX Chaos データサイズ ○ ✕ ○ ? 処理負荷 ○ △ ◎ ? 作業コスト △ ○ ✕ ? #UE4 | @UNREALENGINE

157.

ワークフロー ちなみに もしここにリアルタイム破壊を入れた場合… FBX データサイズ ○ 処理負荷 ○ 作業コスト △ #UE4 | @UNREALENGINE Alembic VAT PhysX Chaos ✕ ○ ◎ △ ◎ ? ○ ✕ ? リアルタイムに計算されるので データサイズは小さい

158.

ワークフロー ちなみに データサイズ もしここにリアルタイム破壊を入れた場合… FBX Alembic VAT PhysX Chaos ○ ✕ ○ ◎ △ ◎ ✕ ○ ✕ ? 処理負荷 ○ 作業コスト △ #UE4 | @UNREALENGINE 数万パーツの破片の演算を リアルタイムで行うのは かなり厳しい

159.

ワークフロー ちなみに もしここにリアルタイム破壊を入れた場合… FBX Alembic VAT PhysX Chaos データサイズ ○ ✕ ○ ◎ 処理負荷 ○ △ ◎ DCCツールと行ったり来たり ✕ ✕ ◎ 作業コスト #UE4 | @UNREALENGINE △ しなくてすむのは非常に楽 ○

160.

ワークフロー こんな感じでしょうか FBX Alembic VAT PhysX Chaos データサイズ ○ ✕ ○ ◎ 処理負荷 ○ △ ◎ ✕ 作業コスト △ ○ ✕ ◎ #UE4 | @UNREALENGINE

161.

ワークフロー 状況に応じて 適宜一番良い手法をご選択頂けたらと思います FBX Alembic VAT PhysX Chaos データサイズ ○ ✕ ○ ◎ 処理負荷 ○ △ ◎ ✕ 作業コスト △ ○ ✕ ◎ #UE4 | @UNREALENGINE

162.

ワークフロー ちなみに今回の作例では Rigid BodyではFBXを FBX Alembic VAT PhysX Chaos データサイズ ○ ✕ ○ ◎ 処理負荷 ○ △ ◎ ✕ 作業コスト △ ○ ✕ ◎ #UE4 | @UNREALENGINE

163.

ワークフロー Soft BodyではAlembicを使用しました FBX Alembic VAT PhysX Chaos データサイズ ○ ✕ ○ ◎ 処理負荷 ○ △ ◎ ✕ 作業コスト △ ○ ✕ ◎ #UE4 | @UNREALENGINE

164.

ワークフロー FBX 日本家屋 街並み全体 (RigidBody) Alembic 豚 のれんなど (SoftBody) 理由としては実装速度重視で 処理負荷を度外視した為です (重すぎたらVATに置き換えようと考えていました) #UE4 | @UNREALENGINE

165.

SoftBody ちなみに SoftBodyに関しては Alembic、VATはそのまま実装可能かと思いますが #UE4 | @UNREALENGINE

166.

SoftBody https://www.sidefx.com/tutorials/game-tools-skinning-converter/ FBXもスキニングコンバーターという手法がありますので 是非お試し頂けたらと思います #UE4 | @UNREALENGINE

167.

シーン製作 さて これでようやく事前破壊したデータを UE4に実装できましたので 見た目を調整していきましょう #UE4 | @UNREALENGINE

168.

シーン製作 まずは破壊データインポート後の マテリアルアサインに関して #UE4 | @UNREALENGINE

169.

自動化BP 今回 少し複雑な破壊でマテリアルの種類が多かったので Editor Utility Widgetでアサインを自動化しました #UE4 | @UNREALENGINE

170.

自動化BP 数十あるマテリアルを手作業で割り当てるのは非常に辛いので 単純作業には是非皆様BPでの自動化をお役立て下さい #UE4 | @UNREALENGINE

171.

自動化BP https://qiita.com/EGJ-Kaz_Okada/items/985b98fb934d751f4f69 http://kinnaji.com/ https://qiita.com/EGJ-Kaz_Okada/items/9f530db3b53d0fde3f20 Editor Utility Widgetに関する情報は ネット上で強い方が沢山発信して下さっております 本当にありがとうございます #UE4 | @UNREALENGINE

172.

エフェクト 見た目が多少整ったところで #UE4 | @UNREALENGINE 次はエフェクト

173.

エフェクト 使用したのはNiagaraとRaymarchingです #UE4 | @UNREALENGINE

174.

Niagara Niagaraの実装は池田さんの本を参考に 完全にそのまま実装しました #UE4 | @UNREALENGINE

175.

Niagara Houdiniで作成した破壊データから Impactの位置や方向などを出し #UE4 | @UNREALENGINE

176.

Niagara SideFXLabsのNiagaraノードを使用して HCSVとして書き出し UE4へインポート #UE4 | @UNREALENGINE

177.

Niagara Niagaraで使用することで 破壊シミュレーションに対応した エフェクトを簡単に出すことが可能です #UE4 | @UNREALENGINE

178.

Niagara https://www.unrealengine.com/ja/release-notes 4.25よりNiagaraはプロダクションレディです 皆様是非ご活用頂けましたら幸いです #UE4 | @UNREALENGINE

179.

Raymarching 次にRaymarching #UE4 | @UNREALENGINE

180.

Raymarching https://shaderbits.com/ こちらはライアンさんのシェーダーを 有り難く使わせて頂いております #UE4 | @UNREALENGINE

181.

Raymarching Volumetricsというプラグインにマテリアルがありますので 皆様すぐにでも使用可能です #UE4 | @UNREALENGINE

182.

Raymarching 今回はRaymarchingで煙を三次元的に動かしたかったので 3Dテクスチャを連番で作成しました #UE4 | @UNREALENGINE

183.

Raymarching Houdiniで 破壊シミュレーションに合わせて 煙のシミュレーションを行い #UE4 | @UNREALENGINE

184.

Raymarching SideFXLabsの「Volume to Texture」ノードで 3Dテクスチャをエクスポート #UE4 | @UNREALENGINE

185.

Raymarching それをVolumetricsマテリアルのレンダーターゲットに 連番として流し込みました #UE4 | @UNREALENGINE

186.

Raymarching レンダーターゲットへの連番適用は シーンキャプチャで撮影したものを力技で流し込みました #UE4 | @UNREALENGINE

187.

Raymarching Pythonを使用し 連番テクスチャをアサインしたプレーンを フレーム数分自動作成して整列させ #UE4 | @UNREALENGINE

188.

Raymarching これらをカメラフェードさせつつシーンキャプチャする事で 連番テクスチャを一枚のレンダーターゲットで扱う事ができます #UE4 | @UNREALENGINE

189.

Raymarching 今回はメモリを 気にしなかったので 大量の高解像度連番テクスチャを 使用しましたが 状況によっては ループ化してしまうのも 良いのではないかと思います #UE4 | @UNREALENGINE

190.

Raymarching またVolumetricsには リアルタイム流体シミュのサンプルもありますので こちらを使ってみるのも楽しいかも知れません #UE4 | @UNREALENGINE

191.

Material 次にマテリアルでの小技 #UE4 | @UNREALENGINE

192.

Material 自然な壊れ感になるように歪ませました #UE4 | @UNREALENGINE

193.

Material 手法としてはPre-Skined Local Positionを利用することで モデルが壊れたタイミングで歪むようにしています #UE4 | @UNREALENGINE

194.

Material Pre-Skined Local Positionはスケルタルメッシュアニメーションでのみ 使用可能なノードですが 非常に便利です #UE4 | @UNREALENGINE

195.

Material AlembicやVATの場合でも UVに壊れる前の位置や 壊れた後の位置を埋め込んでおくことで 自然なひび割れなどを表現することが可能かと思います #UE4 | @UNREALENGINE

196.

Material https://www.slideshare.net/EpicGamesJapan/ue4-139190798 モデルを割るのが厳しい場合は エッジ汚しのUVを追加するのも良い方法かもしれません #UE4 | @UNREALENGINE

197.

撮影 概ね破壊シーンの構築は完了したので ここからは撮影調整です #UE4 | @UNREALENGINE

198.

撮影 https://docs.unrealengine.com/ja/Engine/Plugins/VirtualCameraPlugin/index.html 今回カメラはバーチャルカメラを使用しました 自然な手ブレを追加する為です #UE4 | @UNREALENGINE

199.

撮影 専用のアプリとプラグインを入れるだけで すぐに撮影が可能ですので 是非皆様もお試し頂けましたら #UE4 | @UNREALENGINE

200.

撮影 https://historia.co.jp/archives/7374/ 細かな手ブレなどは補正されてしまいますので カメラシェイクトラックなどを追加するのも良いかと思います #UE4 | @UNREALENGINE

201.

仕上げ ライティングとポスプロは 基本的に京都アセットの設定を そのまま使用させてもらってます #UE4 | @UNREALENGINE

202.

仕上げ 適切なライティング設定が行われていれば 昼と夜を切り替えるのも非常に簡単です #UE4 | @UNREALENGINE

203.

仕上げ ディレクターからの突然の修正にも UE4であればきっと柔軟に 対応する事ができるでしょう #UE4 | @UNREALENGINE

204.

仕上げ と #UE4 | @UNREALENGINE いう感じで……

205.

仕上げ 完成しました!! #UE4 | @UNREALENGINE

206.

仕上げ 完成しました!! #UE4 | @UNREALENGINE

207.

まとめ まとめです #UE4 | @UNREALENGINE

208.

まとめ 破壊シーンを作るには 破壊readyのモデルが必要です 破壊は 計画的に行いましょう #UE4 | @UNREALENGINE

209.

まとめ 破壊シーンを作るには 破壊readyのモデルが必要です 破壊は 計画的に行いましょう UE4には破壊シーンを実装する際 複数のワークフローが存在します 状況に合わせてより良い方法を 選択しましょう #UE4 | @UNREALENGINE

210.

まとめ 皆様の破壊衝動が UE4で合法的に発散されることを願っております #UE4 | @UNREALENGINE

211.

まとめ 良い破壊神ライフを! #UE4 | @UNREALENGINE

212.

ご清聴 ありがとうございました #UE4 | @UNREALENGINE