Slide 1

Slide 1 text

プロシージャルワークフロー × UnrealEngine5 で挑む映像制作

Slide 2

Slide 2 text

登壇者プロフィール テクニカルプランナー 小林 哲朗 3DCG/制作全般 ゲームエンジンに精通 CGIアーティスト 長田 晃輝 DCCツールを用いたアセット制作および ディレクションに従事 テクニカルアーティスト 伊藤 晴紀 モデリングやルックデブなどのアート ワークをはじめ、 UE5での機能実装など を行っている

Slide 3

Slide 3 text

目録 1. 企画 2. 映像制作ワークフロー 3. 今までの進捗状況 4. Houdiniでの作業 5. Substanceやマテリアル設定など 6. UE5を使った画作り 7. 最新の映像

Slide 4

Slide 4 text

はじめに  本プロジェクトは Unreal Engine5.1までの機能で制作した映像作品です。 また、本プロジェクトはプロダクトではなく R&Dプロジェクトです。 試行錯誤した内容や経験談などを中心にお話いたしますが、皆様のプロダクトの参 考になれば幸いです。

Slide 5

Slide 5 text

1.プロシージャルワークフローで 少人数・高効率な 制作体制を築きたい 企画

Slide 6

Slide 6 text

企画 ▪ 欧米のAAAゲーム開発において、最近ではプロシージャルワークフローが標準 的になってきている ▪ 日本国内でもプロシージャルワークフローの需要が、着実に増えてきていること を実感している i. https://www.youtube.com/watch?v=gCt4oLEQ2LU ii. https://www.youtube.com/watch?v=D0ERCi9mMZg iii. https://vimeo.com/273986776

Slide 7

Slide 7 text

2.UE5を使ったコンテンツ を作ってみたい 企画

Slide 8

Slide 8 text

企画 ▪ GUNCY'SではUnityを使った作品には関わるチャンスが多く、ナレッジも溜まっ てきているが UEの事例は少数なので実際に深堀りして使ってみたい ▪ フォトリアルな質感、ライティングの制作に関わったケースが少ないのでナレッ ジを溜めたい ▪ 映像コンテンツとしても品質の高い映像を実現したい

Slide 9

Slide 9 text

映像作品を作ってみよう 企画

Slide 10

Slide 10 text

本編映像

Slide 11

Slide 11 text

どうやって作っていくか 映像制作ワークフロー

Slide 12

Slide 12 text

● プロダクション ○ ボリューメトリック撮影 ○ プロップアートワーク ○ UEレベルデザイン ○ UEシーケンスコンポジット ○ レンダリング ○ AEコンポジット ○ エンコード ● プリプロダクション ○ 企画 ○ プロット ○ 設定作成 ○ コンセプトアート ○ カラースクリプト ○ コンテ ○ プリビズ 映像制作ワークフロー

Slide 13

Slide 13 text

● プロダクション ○ ボリューメトリック撮影 ○ プロップアートワーク ○ UEレベルデザイン ○ UEシーケンスコンポジット ○ レンダリング ○ AEコンポジット ○ エンコード ● プリプロダクション ○ 企画 ○ プロット ○ 設定作成 ○ コンセプトアート ○ カラースクリプト ○ コンテ ○ プリビズ 映像制作ワークフロー

Slide 14

Slide 14 text

 今回は映像制作のデモンストレーションに近いため、  様々な映像の技法を活かせる物語のプロットを考え、書き出していく。 プロット

Slide 15

Slide 15 text

ライブ配信者が、廃虚と化した大正ロマンの 洋館を探索する。 しかし、館の中では不思議な現象が次々と起 こる。 プロット

Slide 16

Slide 16 text

設定作成 キャラや背景の時代考証など煮詰めていく

Slide 17

Slide 17 text

字コンテ 絵コンテ Vコンテ コンテ

Slide 18

Slide 18 text

字コンテ 演出や場面などをシーンごとに区切って書き出していく

Slide 19

Slide 19 text

絵コンテ

Slide 20

Slide 20 text

Vコンテ 絵コンテを使いカット尺の確認

Slide 21

Slide 21 text

コンセプトアート

Slide 22

Slide 22 text

コンセプトアート

Slide 23

Slide 23 text

コンセプトアート

Slide 24

Slide 24 text

カラースクリプト コンテにカラーを上乗せして各カットの調子を確認する

Slide 25

Slide 25 text

カラースクリプト+コンセプトアート

Slide 26

Slide 26 text

プリビズ

Slide 27

Slide 27 text

● プロダクション ○ ボリューメトリック撮影 ○ プロップアートワーク ○ UEレベルデザイン ○ UEシーケンスコンポジット ○ レンダリング ○ AEコンポジット ○ エンコード ● プリプロダクション ○ 企画 ○ プロット ○ 設定作成 ○ コンセプトアート ○ カラースクリプト ○ コンテ ○ プリビズ 映像制作ワークフロー

Slide 28

Slide 28 text

ボリューメトリック撮影 実写をベースにそのままポリゴン化・モーション化し、保存する

Slide 29

Slide 29 text

映像→ シェーダー or テクスチャ 4DViewsボリュ―メトリック 4DViewsとは?

Slide 30

Slide 30 text

4DViewsボリュ―メトリック 各カットの演技を撮影していく

Slide 31

Slide 31 text

4DViewsボリュ―メトリック UEでコンポジット【実演】

Slide 32

Slide 32 text

4DViewsボリュ―メトリック

Slide 33

Slide 33 text

アセットの制作 ▪ 職人による温かみのある手作りのモデリング ▪ Houdini ▪ Substance

Slide 34

Slide 34 text

DCCで手作り 汎用性の必要が無い一点もののプロップ類

Slide 35

Slide 35 text

ボタン一つで自動的に対象の 環境・オブジェクトをターン テーブルとして撮影、 Flow PTにアップロードまでを 行うPlugin 自作Lookdev Plugin Flow PT UE パイプライン サーバ Flow PTでlookdev

Slide 36

Slide 36 text

Houdini

Slide 37

Slide 37 text

UE Houdini Houdini工程の流れ 洋館のレイアウト 各パーツの モジュール化 ユニークモデル 作成 HoudiniEngine で再構築 USD 出力 洋館の制作

Slide 38

Slide 38 text

洋館の間取り・レイアウト

Slide 39

Slide 39 text

洋館のレイアウト 洋館の間取り図 パラメータで間取りを 調整できるように

Slide 40

Slide 40 text

洋館のレイアウト UEでカメラワーク確認

Slide 41

Slide 41 text

モジュール化

Slide 42

Slide 42 text

モジュール化 モジュール化とは… 壁や床を全て一つのモデルとして 作るのではなく、 面ごとに分割して作ること 部屋の大きさなどに柔軟に対応できるよ う、 必要な要素をパラメータ化する

Slide 43

Slide 43 text

モジュール化 画像は公式ドキュメントより抜粋 なぜモジュール化するのか 一体成型だとLumenのSurfaceCache が上手く計算できない(UE5.1当時) →モジュール化で解決!

Slide 44

Slide 44 text

モジュール化 壁モジュール

Slide 45

Slide 45 text

モジュール化 間取りに合わせて ラインを引く レイアウトに合わせて構築

Slide 46

Slide 46 text

モジュール化 レイアウトに合わせて構築 ラインを基に モジュールを生成

Slide 47

Slide 47 text

モジュール化 その他モジュールを配置

Slide 48

Slide 48 text

窓モジュール

Slide 49

Slide 49 text

窓モジュール ※コンセプトアートのため、最終的なデザインとは異なります

Slide 50

Slide 50 text

窓モジュール 扉あり 扉なし ※コンセプトアートのため、最終的なデザインとは異なります 窓の種類

Slide 51

Slide 51 text

窓モジュール 子供部屋 ステンドグラス ※コンセプトアートのため、最終的なデザインとは異なります 窓の種類

Slide 52

Slide 52 text

窓モジュール 窓の形状それぞれのHDAを作成 窓の種類

Slide 53

Slide 53 text

窓モジュール 窓モジュールのパラメーター

Slide 54

Slide 54 text

窓モジュール ※コンセプトアートのため、最終的なデザインとは異なります 廃墟版

Slide 55

Slide 55 text

窓モジュール 廃墟版

Slide 56

Slide 56 text

窓モジュール 配置

Slide 57

Slide 57 text

ユニークモデル 固有の形状のものは、 モジュールではなく 一点物で作る

Slide 58

Slide 58 text

ユニークモデル 階段・エントランス

Slide 59

Slide 59 text

ユニークモデル 屋根・外壁の装飾

Slide 60

Slide 60 text

ユニークモデル 正面口・ベランダ

Slide 61

Slide 61 text

ユニークモデル 完成

Slide 62

Slide 62 text

USDワークフロー

Slide 63

Slide 63 text

USD パラメータ情報… アトリビュートに情報を格納 配置情報… 点群化して情報を格納 Houdiniからエクスポート

Slide 64

Slide 64 text

USD パラメータ情報… アトリビュートに情報を格納 配置情報… 点群化して情報を格納 Houdiniからエクスポート

Slide 65

Slide 65 text

USD USD ROPで出力 Houdiniからエクスポート

Slide 66

Slide 66 text

USD UEにインポート 簡易的なWidgetでUSDを インポート

Slide 67

Slide 67 text

USD UEにインポート HoudiniEngineで 再構築

Slide 68

Slide 68 text

USD 完了

Slide 69

Slide 69 text

洋館のディティールや その他プロップ等

Slide 70

Slide 70 text

ベッド

Slide 71

Slide 71 text

壁紙

Slide 72

Slide 72 text

Slide 73

Slide 73 text

シャンデリア

Slide 74

Slide 74 text

柱のレリーフ

Slide 75

Slide 75 text

柱のレリーフ 画像の輪郭を抽出

Slide 76

Slide 76 text

柱のレリーフ ノイズでDisplacement

Slide 77

Slide 77 text

柱のレリーフ ノイズでDisplacement

Slide 78

Slide 78 text

柱のレリーフ 完成

Slide 79

Slide 79 text

Substance 3D Designer

Slide 80

Slide 80 text

Substance 3D Designerとは

Slide 81

Slide 81 text

1. リファレンスを視る a. 構成する要素を分解し、部品化をする 2. マテリアルを作成する a. 細かく部品化した形状をシェイプで再現する b. 部品化したシェイプを変形しバリエーションを出す c. 色々なパターンのシェイプを並べてる d. 並べたシェイプを元に色や質感を足していく マテリアル作成の考え方

Slide 82

Slide 82 text

リファレンスを視る (FREEP!K- Damask seamless pattern background )より引用 https://www.freepik.com/free-vector/damask-seamless-pattern-background_1534426.htm

Slide 83

Slide 83 text

リファレンスを視る

Slide 84

Slide 84 text

マテリアルを作成する

Slide 85

Slide 85 text

完成

Slide 86

Slide 86 text

完成

Slide 87

Slide 87 text

完成

Slide 88

Slide 88 text

作成したマテリアルを Unreal Engine5 へ読み込む

Slide 89

Slide 89 text

Unreal Engine5 マテリアル 透明 布 親マテリアル ガラスA 布A インスタンス ガラスB 布B アセットA アセットB アセットC

Slide 90

Slide 90 text

Unreal Engine5 マテリアル

Slide 91

Slide 91 text

タイルテクスチャ ユニークテクスチャ テクスチャの運用 タイルテクスチャとユニークテクスチャ

Slide 92

Slide 92 text

タイルテクスチャ デカールを使用する

Slide 93

Slide 93 text

タイルテクスチャ UVセットを分ける

Slide 94

Slide 94 text

タイルテクスチャ UVセットを分ける

Slide 95

Slide 95 text

ユニークテクスチャ

Slide 96

Slide 96 text

ユニークテクスチャ UDIMの使用

Slide 97

Slide 97 text

Substanceマテリアルを UEへ直接インポートする Substance 3D for Unreal Engine https://www.fab.com/ja/listings/292bb370-f146-4d1e-89c2-afbdb26cea6b

Slide 98

Slide 98 text

Substanceマテリアルを UEへ直接インポートする

Slide 99

Slide 99 text

Unreal Engine 5について NaniteとLumen

Slide 100

Slide 100 text

Naniteの概要 クラスタとフォールバックメッシュ

Slide 101

Slide 101 text

Lumenの概要 NaniteとLumen Card r.Lumen.Visualize.CardPlacement 1

Slide 102

Slide 102 text

▪ Naniteにおける注意点 ○ ソフトエッジ ○ フォールバックメッシュ ▪ Lumenにおける注意点 ○ サーフェスキャッシュ ○ アーティファクト ○ 現状最適解だったレイトレの設定 Lumenとメッシュの関係性

Slide 103

Slide 103 text

メッシュ: Nanite ソフトエッジでないと Nanite力が発揮しない

Slide 104

Slide 104 text

メッシュ: Nanite 1f目 2f目 Nanite:off Nanite:on ● フォールバックメッシュに注意 ○ たまにライティングの影響がおかしい箇所が発生する ○ Naniteオンのままメッシュをエクスポートすると FBMが出てくる

Slide 105

Slide 105 text

メッシュ: Lumen メッシュに厚み( or 閉じたメッシュ)がないと Lumenを活かせない

Slide 106

Slide 106 text

メッシュ: Lumen ● ピンク:GIが効かない(反射が黒くなる) ○ 解決法 ■ 複雑ではない形状にオブジェクトを 切り分ける。 (完全には直らないこともある) [Surface Cache] 表示モード ● サーフェスキャッシュ:穴形状はつらい

Slide 107

Slide 107 text

アーティファクトの出現( Nanite) メッシュ: Lumen

Slide 108

Slide 108 text

メッシュ: Lumen 謎の影は Cast ray traced shadowが有効の時 参考:Modular Seaside Town  https://www.unrealengine.com/marketplace/ja/product/modular-seaside-town

Slide 109

Slide 109 text

メッシュ: Lumen ● 解決法 ○ プロジェクト設定 or ライト からCast Ray Traced Shadowをオフ ○ (r.RayTracing.NormalBiasを上げる) ○ (メッシュの厚みを増やす) ○ (パストレを使う) ● メッシュの厚みを増やす ● Path Tracer

Slide 110

Slide 110 text

メッシュ: Lumen Naniteを主体とするプロジェクトならば … ▪ Ray Traced Shadow ▪ Ray Traced SkyLight は理由がない限りオフが安定していておすすめです。 使うときはメッシュの形状に気を付けましょう。

Slide 111

Slide 111 text

ライティング ▪ 印象的なライティングにするには ○ ライトシャフト ○ フェイクを混ぜる ○ Fogの制御

Slide 112

Slide 112 text

ライトシャフト 光が差し込むシャフト

Slide 113

Slide 113 text

ライトシャフト 光源を見つめる方向のシャフト

Slide 114

Slide 114 text

● Intensityを爆上げする ● Volumetric Scattering Intenityを爆上げする ● Cast Volumetric Shadowをオンにする ※ExperimentHeightFogのVolumetroc Fogをオンにしてあること ライトシャフト

Slide 115

Slide 115 text

往々にして、メッシュの隙間から fogが漏れ出すので、 白い豆腐などを適宜配置し、 fogを遮断することができる。 ちなみに、 5.2以降で精度がかなり改善されている。 【実演】 ライトシャフト

Slide 116

Slide 116 text

ライトシャフト スポットライトなどを使えばムラのある光漏れを擬似的に再現できる

Slide 117

Slide 117 text

Fogを綺麗に出したい r.VolumetricFog.GridPixelSize を8から2に下げて精度を高める(重くなる)【実演】

Slide 118

Slide 118 text

フェイクを混ぜる 印象的に見せたい箇所へのライティング

Slide 119

Slide 119 text

● 太陽方向を明確にしたい ● 正面階段のディティールを見せたい ● 次カットに映る柱時計の位置を明確に ● 崩壊部に寒々しさが欲しい フェイクを混ぜる

Slide 120

Slide 120 text

▪ 太陽方向用 AreaLight ● 階段用AreaLight ● 柱時計用SpotLight ● 影用青ライト フェイクを混ぜる

Slide 121

Slide 121 text

フェイクを混ぜる

Slide 122

Slide 122 text

ライトの置きすぎ注意 Attenuation Radiusが重なったライトが 1つのメッシュに 16個より多く当たると起こる

Slide 123

Slide 123 text

r.Shadow.Virtual.OnePassProjection.MaxLightsPerPixel ● デフォルト: 16 ● 改善後:32 上げすぎると相応に負荷が高まるので、 ゲーム制作の際は気を付けること

Slide 124

Slide 124 text

カットの管理 ▪ 1カットごとにシーケンスを分けてレンダリング ○ 安定性、レンダリング中のトラブルの早期発見を図る ▪ 必要に応じて MRQのプリセットを使い分ける ○ CVarsの使い分け

Slide 125

Slide 125 text

カットの管理 コンソール変数( CVars)の使い分け

Slide 126

Slide 126 text

カットの管理 CVarsの使い分け【実演】 ジェネラルなCVars設定:残像発生 カット専用CVars設定:くっきりFog

Slide 127

Slide 127 text

CVarsの使い分けメモ ● r.VolumetricFog.HistoryWeight ○ デフォルト: 0.9 ○ 調整後:0.02 ● r.VolumetricFog.TemporalReprojection ○ デフォルト: 1.0 ○ 調整後:0.0 ● r.VolumetricFog.GridPixelSize ○ デフォルト: 8.0 ○ 調整後:2.0

Slide 128

Slide 128 text

▪ 紆余曲折在りつつも、ひとまず映像作品が出来上がってきた 映像作品ができるまで

Slide 129

Slide 129 text

今後はプロシージャルワークフローで少人数・高効率な制作体制を 実際のプロダクトへ適用していこうと考えています。 今回の発表で UEの特徴や性質、工夫できる箇所など 皆様の参考になるものがあれば幸いです。 おわりに

Slide 130

Slide 130 text

ご清聴ありがとうございました。 株式会社GUNCY’S 小林哲朗 / 伊藤 晴紀 / 長田 晃輝