SlideShare une entreprise Scribd logo
1  sur  223
Télécharger pour lire hors ligne
ⒸKLab inc.
TechDEMO“OKURIGAMI” : VFX Breakdown
Houdini x Unity x AfterEffects
Sasaki-y
ⒸKLab inc.
自己紹介
2
ⒸKLab inc.
自己紹介
● 佐々木洋太
● KLab株式会社技術統括部RRRグループ所属
○ ※RRR = RealTime Rendering Researchの略
● VFXシニアアーティスト
3
ⒸKLab inc.
自己紹介
● 来歴
○ アニメ制作会社、3DCG制作会社で主に2D・3Dのエフェクト・コンポジット・映像制作に多数携わっ
た後KLabに入社。
4
ⒸKLab inc.
● 入社後
○ 入社後は先端VFXの技術検証やテックデモ制作に携わりつつ、オリジナル RPGタイトルのカット
シーン制作に参加。
■ テックデモのLink
■ UnityKorea様で行ったテックデモのウェビナー Link
● 現在
○ 現在は主に映像・エフェクトの技術・アート両分野での「新規プロジェクトへの協力・高度な VFXの技
術検証及び社内導入・制作力向上への貢献・コンセプトやスタイルガイドの構築」といった業務を
行っています。
○ 技術検証・実践内容の一部は 2020年のCEDECや、Unity道場に登壇して紹介しています。
■ CEDEC2020:資料 SideFX社様のCEDEC紹介ページ
■ 「Unity道場:Houdini編」:紹介ページ 前編資料 後編資料
自己紹介
5
ⒸKLab inc.
● リアルタイム・レンダリング・リサーチグループ(RRR)
○ KLabの3Dビジュアル研究開発グループ
○ 横断活動グループとしてプロジェクトサポート及び新規開発に関与
○ 2018年に結成
○ 現在は7人
■ 全員がそれぞれ違う得意分野を持っている人
■ 全員が「楽するための苦労をしたい 」人
● <今の仕事を仕組化・効率化し、未来を楽にする。>という、KLabの大事にしている価値観の一つでも
あります。
自己紹介
6
ⒸKLab inc.
● 現在主に使用しているツール
○ Houdini
■ プラグイン:RedshiftRender
○ AfterEffects
■ プラグイン:主要プラグインほぼ全て
○ Unity
■ 主な使用ツール:VisualEffectGraph、Timeline、Cinemachine、ShaderGraph、ParticleSystem
● サブツール及び、今まで仕事で使用してきたツール
○ 3dsmax
■ 主なプラグイン: FumeFX、AfterBurn、thinkingParticles、V-ray、Pencil+、Krakatoa、Frost、Xmesh、Rayfire
○ AfterEffects以外のAdobe製品
■ 主なソフトウェア: Photoshop、Illustrator、Premiere Pro、Encore
○ Realflow
○ Live2D
○ UnrealEngine4
○ Nuke
○ Maya
○ MotionBuilder
自己紹介
7
ⒸKLab inc.
● 自主制作
○ 仕事だけではなく趣味でもプリレンダーやリアルタイムの映像・エフェクト・モーショングラフィックス
制作をしています。
■ 先日ボーンデジタル様主催の『 Houdiniで作るNPRエフェクト&After Effectsでのコンポジット
実践解説オンラインセミナー 』という題で、趣味の NPRエフェクトの解説セミナーを行いまし
た。
○ 本日はよろしくお願い致します。
自己紹介
8
ⒸKLab inc.
アジェンダ
9
ⒸKLab inc.
アジェンダ
● TechDemo“OKURIGAMI”について簡単に紹介
● Breakdown Overview
● Breakdowns for each part
○ Ocean
○ SDF Particles
○ Cutscene
○ River & Waterfall
○ Splash
○ PV
● Appendix
● Q&A
10
ⒸKLab inc.
TechDemo“OKURIGAMI”について簡単に紹介
11
ⒸKLab inc.
TechDemo“OKURIGAMI”について簡単に紹介
● 概要
○ 研究開発の一環で作られたプロジェクトです。
○ キャラクター・アニメーション・リグ・エフェクト等の個別の研究開発は、それぞれ単独だと成果や結
果が分かり辛い事があります。そのため、テックデモという形で一つのアプリにそれらを集約する事
で、研究開発の成果や結果を分かりやすく具体化する事がこのプロジェクトの主な目的です。
12
ⒸKLab inc.
TechDemo“OKURIGAMI”について簡単に紹介
● コンセプト
○ 物語のコンセプトや目的は、下記画像のようなシンプルなものです。
13
ⒸKLab inc.
TechDemo“OKURIGAMI”について簡単に紹介
● 期間
○ 企画スタートから三か月位です。
○ 基本的には他の案件業務等と掛け持ちしながらの作業となります。
○ コンセプトを詰めたり、必要な要素を割り出したり、各種検証期間も含んでいるので実作業期間は
最後の一か月位になります。
14
ⒸKLab inc.
TechDemo“OKURIGAMI”について簡単に紹介
● 人員
○ 基本的に各ポジション 1~2名です。
■ アニメーターのみ少し多めとなっています。
15
ⒸKLab inc.
TechDemo“OKURIGAMI”について簡単に紹介
● この項目の説明は以上となります。
16
ⒸKLab inc.
Breakdown Overview
17
ⒸKLab inc.
Breakdown Overview
● 概要
○ Okurigamiの紹介及び、VFXのブレイクダウン概要をまとめた動画です。
18
ⒸKLab inc.
Breakdowns for each part
19
ⒸKLab inc.
Ocean
20
ⒸKLab inc.
Ocean
● 目的
○ Houdiniで自動生成された背景モデルに対して適応できる海素材を作成すること。
○ 海の動きをきちんと作成すること。
○ 波打ち際のホワイトウォーターをきちんと作成すること。
21
ⒸKLab inc.
Ocean
● 検証&作業方針
○ Houdiniで自動生成された背景モデルに対して適応できる素材を作成すること。
■ そのためには、自動生成に対応するルールに則った手法で各種素材を作成する必要があり
ます。
○ 海の動きをきちんと作成すること。
■ そのためには、ディスプレイスメントマップやノーマルマップをきちんと海の動きベースで作成
する必要があります。
○ 波打ち際のホワイトウォーターをきちんと作成すること。
■ そのためには、オブジェクトとの接触面を Shaderで白くするとか静止画ベースやノイズで誤魔
化すのではなく、映像ベースのホワイトウォーター素材をきちんと作成する必要があります。
22
ⒸKLab inc.
Ocean
● 基本的な考え方
○ Unity社公式のサンプルプロジェクトである「 Boat Attack」の海の作り方をベースにしています。
○ しかし、それだけでは検証目的が達成されないので、 GDCの講演資料から海外 AAAタイトルで使
用されている手法を参考にして海のテクスチャ類を作成し、それらをハイブリッドしてアートスタイル
に合わせて調整して最終的な形にしています。
23
ⒸKLab inc.
Ocean:Breakdown
24
ⒸKLab inc.
Ocean : Breakdown
● Overview
○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。
25
ⒸKLab inc.
Ocean : Breakdown
● 海面素材作成
○ 各種テクスチャを書き出すために、まずはプリレンダーで使うような海洋素材を作成します。
26
ⒸKLab inc.
Ocean : Breakdown
● 海面素材作成
○ 海洋素材のベースはシェルフから作成しています。
27
ⒸKLab inc.
Ocean : Breakdown
● 海面素材作成
○ Houdiniの基本的な海洋メッシュ生成の考え方は、高精度のメッシュをそのまま使うのではなく、高
精度メッシュの海洋ノイズをディスプレイスメントマップに変換し、それを基にディテールを形作ると
いうものです。
28
ⒸKLab inc.
Ocean : Breakdown
● 海面素材作成
○ そのため、ディスプレイスメントマップ生成段階でノードをバイパスし、ディスプレイスメントマップ以
外の各種テクスチャを生成・ベイクするようなブランチを作成すれば、ゲームエンジン向けの海洋テ
クスチャ生成アセットが作成できます。
29
ⒸKLab inc.
Ocean : Breakdown
● 海面素材作成
○ そのため、ディスプレイスメントマップ生成段階でノードをバイパスし、ディスプレイスメントマップ以
外の各種テクスチャを生成・ベイクするようなブランチを作成すれば、ゲームエンジン向けの海洋テ
クスチャ生成アセットが作成できます。
30
ⒸKLab inc.
Ocean : Breakdown
● 海面素材作成:Post Process
○ シェルフの海洋アセットをベースにする場合、 UVが単一のUV空間に納まっていないので、必要な
アトリビュートを操作して単一の UV空間に納めます。
31
ⒸKLab inc.
Ocean : Breakdown
● 海面素材作成:Post Process
○ シェルフの海洋アセットをベースにする場合、 UVが単一のUV空間に納まっていないので、必要な
アトリビュートを操作して単一の UV空間に納めます。
32
ⒸKLab inc.
Ocean : Breakdown
● 海面素材:コンポジット
○ ゲームエンジンで扱いやすいように素材を調整し、テクスチャシートに変換します。
33
ⒸKLab inc.
Ocean : Breakdown
● 海面素材紹介
○ 最終的に使用しているテクスチャはこちらです。
34
ⒸKLab inc.
Ocean : Breakdown
● 海面素材作成:Tips
○ 元々タイリング可能な形で海洋ノイズが作られているので、特殊な変更をしない限り自然とシーム
レステクスチャになります。
○ 参考にした海外AAAタイトルの講演だと256枚のループテクスチャにしていましたが、そこまでしなく
ても今回求められる要件は満たせそうだったので、当テックデモでは 48枚~64枚のループテクス
チャにしています。
35
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際のメッシュ作成
○ 最終的にはメッシュの動きをディスプレイスメントマップに変換するので、ベースのアセット自体はプ
リレンダーで使うような作り方と同様に作成します。
36
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際のメッシュ作成
○ 波の満ち引きを作りやすいように、コリジョン用のオブジェクトには傾斜を付けておきます。
37
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際のメッシュ作成:シミュレーション
○ パーティクルもメッシュも普通にシミュレーションして問題ありません。
38
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際のメッシュ作成:シミュレーション
○ ただし、後でメッシュの各種アトリビュートを使用するのでメッシュは普通のポリゴンにしておく必要
があります。
■ 「Particle Fluid Surface」等のノードはデフォルト設定が Surface Polygon ではなく Polygon
Soup になっているので注意が必要です。
39
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーター作成
○ ホワイトウォーターを作成します。
○ テクスチャとしては、キャッシュをベイクしたものを使うかレンダリングしたものを使用するかなので、
基本的な制作手段はプリレンダーで作る時と同様で問題ありません。
40
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーター作成
○ ホワイトウォーターは SideFX社公式ドキュメントでシェルフの使用を推奨していますが、白波の動き
になっているパーティクルかボリュームがあれば大丈夫なので、慣れている方は自作 Solverを使用
しても問題ありません。
41
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーター作成
○ ホワイトウォーターは SideFX社公式ドキュメントでシェルフの使用を推奨していますが、白波の動き
になっているパーティクルかボリュームがあれば大丈夫なので、慣れている方は自作 Solverを使用
しても問題ありません。
42
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーター作成:Post process
○ パーティクルの nage(age/life) は隠されたアトリビュートとして特に宣言しなくても生成されているの
ですが、書き込み不可能の性質の性なのか参照すると思ったような挙動にならなかったので、同じ
性質のアトリビュートを作成してパーティクルの寿命に応じた拡大縮小及び色の変化の処理を行っ
ています。
43
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーター作成:Post process
○ パーティクルの nage(age/life) は隠されたアトリビュートとして特に宣言しなくても生成されているの
ですが、書き込み不可能の性質の性なのか参照すると思ったような挙動にならなかったので、同じ
性質のアトリビュートを作成してパーティクルの寿命に応じた拡大縮小及び色の変化の処理を行っ
ています。
44
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーター作成:Post process
○ パーティクルの nage(age/life) は隠されたアトリビュートとして特に宣言しなくても生成されているの
ですが、書き込み不可能の性質の性なのか参照すると思ったような挙動にならなかったので、同じ
性質のアトリビュートを作成してパーティクルの寿命に応じた拡大縮小及び色の変化の処理を行っ
ています。
45
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際メッシュのオプティマイズ
○ 波打ち際のメッシュをディスプレイスメントマップとして使うための調整を行います。
46
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際メッシュのオプティマイズ
○ シミュレーションしたメッシュを正方形のグリッドに Ray Sop を使用して投影します。
○ これにより正方形の単一の UV空間内に波の動きをベイクすることができます。
47
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際メッシュのオプティマイズ
○ シミュレーションしたメッシュを正方形のグリッドに Ray Sop を使用して投影します。
○ これにより正方形の単一の UV空間内に波の動きをベイクすることができます。
48
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際メッシュのオプティマイズ
○ シミュレーションしたメッシュを正方形のグリッドに Ray Sop を使用して投影します。
○ これにより正方形の単一の UV空間内に波の動きをベイクすることができます。
49
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際メッシュのオプティマイズ
○ シミュレーションしたメッシュを正方形のグリッドに Ray Sop を使用して投影します。
○ これにより正方形の単一の UV空間内に波の動きをベイクすることができます。
50
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際メッシュのオプティマイズ
○ 位置ベースでメッシュの色分けを行います。
○ これによりディスプレイスメントマップとして扱えるような色分けがなされます。
51
ⒸKLab inc.
Ocean : Breakdown
● 波打ち際メッシュのベイク
○ オプティマイズしたメッシュを Baker 系のノードで書き出します。
52
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーターのベイク・レンダリング
○ ホワイトウォーターも波打ち際メッシュのようにグリッドに投影し、高速でベイクを行う事ができます。
○ しかし、ホワイトウォーターの場合はマテリアルやレンダリング設定を調整する事で Mantra でも比
較的素早くレンダリングが可能です。
53
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーターのベイク・レンダリング
○ ベイクの場合は頂点カラーに焼き付ける仕様上、きめ細やかなパーティクルやボリュームのディ
テールは失われやすいです。そのため、ホワイトウォーターは普通にレンダリングしても問題ござい
ません。
54
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーターのベイク・レンダリング
○ 最終的にはグレースケールのテクスチャとして使用するので、ライティングの影響を受けない Glow
や Constant といった定数マテリアルを使用すれば、 Mantra でも比較的綺麗且つ高速にレンダリ
ングをすることができます。
55
ⒸKLab inc.
Ocean : Breakdown
● ホワイトウォーターのベイク・レンダリング
○ 最終的にはグレースケールのテクスチャとして使用するので、ライティングの影響を受けない Glow
や Constant といった定数マテリアルを使用すれば、 Mantra でも比較的綺麗且つ高速にレンダリ
ングをすることができます。
56
ⒸKLab inc.
Ocean : Breakdown
● Composite : COP
○ ベイクしたノーマルマップ等のデータを扱いやすいように調整します。
57
ⒸKLab inc.
Ocean : Breakdown
● Composite : COP
○ 一部のテクスチャは COP上でテクスチャシートに変換しておきます。
58
ⒸKLab inc.
Ocean : Breakdown
● Composite : AfterEffects
○ テクスチャの色味やディテールを整え、ゲームエンジンで扱いやすいように調整します。
59
ⒸKLab inc.
Ocean : Breakdown
● Composite : AfterEffects
○ 一部のテクスチャは AfterEffects 上でループ素材に変換します。
○ SideFXLabs の Make Loop ノード等で上手にループが作成できる場合は良いのですが、今回の
波打ち際メッシュでは上手くいかなかったので、コンポジットでループ素材になるように調整していま
す。
60
ⒸKLab inc.
Ocean : Breakdown
● Composite : AfterEffects
○ 一部のテクスチャは AfterEffects 上でループ素材に変換します。
○ SideFXLabs の Make Loop ノード等で上手にループが作成できる場合は良いのですが、今回の
波打ち際メッシュでは上手くいかなかったので、コンポジットでループ素材になるように調整していま
す。
61
ⒸKLab inc.
Ocean : Breakdown
● Work in Unity
○ キャラや背景、ルックに合わせて各種調整を行います。
○ Shader は前述したように、Unity社公式のサンプルプロジェクトのものをベースにしつつ必要な改
良を施しています。
62
ⒸKLab inc.
Ocean : Breakdown
● Work in Unity
○ 背景が自動生成故にアジャイルなので、作業進捗によって形状が変化します。
■ そのため Shader や素材は微調整がし易いように仕込み、適宜調整してブラッシュアップをし
ていきました。
63
ⒸKLab inc.
Ocean : Breakdown
● Work in Unity:Tips
○ 余談ですが、 Shader は海や VFX に限らず、キャラや背景に至るまでほぼ全て Shader Graph で
作成しています。
64
ⒸKLab inc.
Ocean : Breakdown
● 注意点
○ 今回使用している Shader Graph 10.4.0 の Flipbook ノードにはテクスチャのタイリングがずれる不
具合がございます。
○ これはUnity社公式のフォーラムにも投稿されている既知の不具合で、最新バージョンでは修正さ
れています。
○ しかし、今回のように修正前のバージョンの Shader Graph で Flipbook ノードを使用する場合は、
ノードをカスタマイズして不具合を修正することをお奨めします。
65
ⒸKLab inc.
Ocean : Breakdown
● この項目の説明は以上となります。
66
ⒸKLab inc.
SDF Particles
67
ⒸKLab inc.
SDF Particles
● 目的
○ Unity の GPU Particle ツールである Visual Effect Graph を様々な形で使用し、アプリとして問題
なくビルドできるかどうかを確かめること。
○ アプリ化を目的としないリアルタイムコンテンツや映像使用目的で Visual Effect Graph が有用なの
は今までの使用経験から分かっているので、今回はアプリとしてビルドした際に問題なく動作する
かを焦点にしています。
68
ⒸKLab inc.
SDF Particles
● 目的
○ Unity の GPU Particle ツールである Visual Effect Graph を様々な形で使用し、アプリとして問題
なくビルドできるかどうかを確かめること。
○ アプリ化を目的としないリアルタイムコンテンツや映像使用目的で Visual Effect Graph が有用なの
は今までの使用経験から分かっているので、今回はアプリとしてビルドした際に問題なく動作する
かを焦点にしています。
● 検証&作業方針
○ SDF (Signed Distance Field)を使用した表現が問題なく動作するかの確認。
○ ゲームプレイ中に Visual Effect Graph 外の要素から Visual Effect Graph の値をオーバーライドし
ても問題ないかどうかの確認。
○ Cutscene での各種使用が問題なく動作するかどうかの確認(この項目は Cutscene の説明の際
に紹介します)。
69
ⒸKLab inc.
SDF Particles:Breakdown
70
ⒸKLab inc.
SDF Particles : Breakdown
● Overview
○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。
71
ⒸKLab inc.
SDF Particles : Breakdown
● SDFとは
○ Signed Distance Field の略称です。
○ Visual Effect Graph におけるSDFブロックは、端的に説明すると特定の形状に対してパーティクル
が引き寄せられるor離れるような表現を行う事ができる仕組みです。
■ この性質を用いることで、特定の形状にパーティクルの動きを沿わせるといった表現が可能
になります。
72
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Houdini
○ キャラクターのFBXデータを読み込み、パーティクルの発生源となる Point Cache と SDF として用
いるための Vector Field を書き出します。
73
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Houdini
○ キャラクターのFBXデータを読み込み、パーティクルの発生源となる Point Cache と SDF として用
いるための Vector Field を書き出します。
74
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Houdini
○ キャラクターのFBXデータを読み込み、パーティクルの発生源となる Point Cache と SDF として用
いるための Vector Field を書き出します。
75
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Houdini
○ キャラクターのFBXデータを読み込み、パーティクルの発生源となる Point Cache と、 SDF として
用いるための Vector Field を書き出します。
76
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Houdini
○ PointCache と VectorField の書き出しに使用しているノードは、 Unity-Technologies の Github 上
で公開されている VFXtoolbox のものを使用しています。
77
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Visual Effect Graph
○ 基本的な構成はこのような形になっています。
○ Houdini から書き出したデータに基本的に使用するアトリビュートが格納されているので、 Visual
Effect Graph のノード構成は画像のようにシンプルに形作る事ができます。
78
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Visual Effect Graph
○ 基本的な構成はこのような形になっています。
○ Houdini から書き出したデータに基本的に使用するアトリビュートが格納されているので、 Visual
Effect Graph のノード構成は画像のようにシンプルに形作る事ができます。
79
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Visual Effect Graph
○ 基本的な構成はこのような形になっています。
○ Houdini から書き出したデータに基本的に使用するアトリビュートが格納されているので、 Visual
Effect Graph のノード構成は画像のようにシンプルに形作る事ができます。
80
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Visual Effect Graph
○ 仮シーンに配置し、調整を行って Prefab 化します。
81
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Visual Effect Graph
○ 仮シーンに配置し、調整を行って Prefab 化します。
82
ⒸKLab inc.
SDF Particles : Breakdown
● Work in Unity
○ 本番用のシーンに配置し、調整を行います。
■ 大量の発光するパーティクル故に Post Process の影響を顕著に受けるので、 本番環境で
の微調整が重要です。
83
ⒸKLab inc.
SDF Particles : Breakdown
● Parameter override
○ 他のコンポーネントから Visual Effect Graph のパラメータを上書きできるかの確認や調整を行いま
す。
84
ⒸKLab inc.
SDF Particles : Breakdown
● Parameter override
○ ゲームプレイ中、実際にキャラクターの接近に応じて消えていく処理が問題なく動作する事を確認し
ます。
85
ⒸKLab inc.
SDF Particles : Breakdown
● Parameter override
○ 動作確認後、フェードアウトの始まる距離を調整したり、見た目を適宜微調整します。
86
ⒸKLab inc.
SDF Particles : Breakdown
● Parameter override
○ 動作確認後、フェードアウトの始まる距離を調整したり、見た目を適宜微調整します。
87
ⒸKLab inc.
SDF Particles : Breakdown
● Parameter override:Future work
○ 今回は簡単な色のフェードでしたが、 Visual Effect Graph のパラメータを外部から上書きできるこ
とが確認できたので、これを応用する事で例えばキャラクターが接近したらタービュランスを強めて
パーティクルが散りながら消えていくといった表現も可能だと思われます。
88
ⒸKLab inc.
SDF Particles : Breakdown
● Others
○ フィールド全域に発生させている環境パーティクルも Visual Effect Graph で作成しています。
○ Visual Effect Graph はパーティクルの発生範囲の調整がし易く、バウンディングボックスとパーティ
クルの発生範囲を個別に簡単に設定できるのでこういった用途でも便利です。
89
ⒸKLab inc.
SDF Particles : Breakdown
● この項目の説明は以上となります。
90
ⒸKLab inc.
Cutscene
91
ⒸKLab inc.
Cutscene
● 目的
○ ゲームやアプリであまり見かけない Alembic を使用し、ビルドして問題なく動作するかどうかの検
証。
○ SideFXLabs Tree Generator の検証。
○ ゲームやアプリであまり見かけない木の成長アニメーションの作成・検証。
○ 本番環境外で基本的な Timeline を作成し、それを後からマージして問題なく動作させられるかの
検証。
○ カットシーンカメラからインゲームカメラへのシームレスな移行を、アーティスト主体で簡単に行える
かどうかの検証。
○ カットシーン用のキャラクターアニメーション工数はほぼ取れないので、ほぼキャラクターアニメー
ション無しでオープニングやエンディングを成立させる演出の構築。
92
ⒸKLab inc.
Cutscene
● 検証&作業方針
○ 『Tree Generator』『木の成長アニメーション』『 Alembic』はまとめて検証を行うのが効果的に思える
ので、これらは一括りにして検証を行うこと。
○ Timeline やそれに付随するアセットを後から本番環境にマージするので、あまり無茶なカットシーン
の作り方をしないこと。
○ カットシーンからインゲームにシームレスに切り替わるシークエンスを作ること。
○ キャラクターのアニメーションに依存しないようなカメラワークやカット割りでカットシーンを作成する
こと。
93
ⒸKLab inc.
Cutscene:Breakdown
94
ⒸKLab inc.
Cutscene : Breakdown
● Overview
○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。
95
ⒸKLab inc.
Cutscene : Breakdown
● Overview
○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。
96
ⒸKLab inc.
Cutscene : Breakdown
● Tree generator 検証:概要
○ 始めに Houdini18.5.462 から正式に追加されたTree generator 系のノードの検証を行いました。
97
ⒸKLab inc.
Cutscene : Breakdown
● Tree generator 検証
○ ルールに則って様々な樹木や枝葉が生成できることを検証し、充分実用的な機能だと判断して使
用を決定しました。
98
ⒸKLab inc.
Cutscene : Breakdown
● Tree generator 検証
○ ルールに則って様々な樹木や枝葉が生成できることを検証し、充分実用的な機能だと判断して使
用を決定しました。
99
ⒸKLab inc.
Cutscene : Breakdown
● Tree generator 検証
○ ルールに則って様々な樹木や枝葉が生成できることを検証し、充分実用的な機能だと判断して使
用を決定しました。
100
ⒸKLab inc.
Cutscene : Breakdown
● Tree generator 検証
○ ルールに則って様々な樹木や枝葉が生成できることを検証し、充分実用的な機能だと判断して使
用を決定しました。
101
ⒸKLab inc.
Cutscene : Breakdown
● Tree generator 検証
○ 最終的な枝葉に使うビルボード用のテクスチャも、樹木生成の仕組みを応用してプロシージャルア
セットを作成し、大量のバリエーションを迅速に生成して使用しています。
102
ⒸKLab inc.
Cutscene : Breakdown
● Tree generator 検証:Tips
○ Tree generator の概要や基礎的なチュートリアルは SideFX社公式サイトの方に掲載されておりま
すので、興味のある方はそちらをご覧ください。
103
ⒸKLab inc.
Cutscene : Breakdown
● Tree generator 検証:Tips
○ SideFX Labs のツールなので、 Houdini Engine のセッションシンクでも問題なく使用できます。
104
ⒸKLab inc.
Cutscene : Breakdown
● Tree animation 検証・作成:概要
○ Tree generator の各種検証後、木の成長アニメーションの検証・作成を行いました。
105
ⒸKLab inc.
Cutscene : Breakdown
● Tree animation 検証・作成
○ 映像制作で用いるような手法をそのまま使うと、ポリゴン数が数百万ポリゴンになったり、データサ
イズが数十~数百ギガバイトになることが予想されたので、流石にテックデモとはいえ後々の業務
にコンバートし辛い手法は避けようと判断しました。
○ そのため、まずは Tree generator の基本的な機能から外れない形でアニメーションを作り、オプ
ティマイズしてポリゴン数やデータサイズが許容範囲内かどうかを確認する作業から始めました。
106
ⒸKLab inc.
Cutscene : Breakdown
● Tree animation 検証・作成
○ Tree generator を用いて木の成長アニメーションの作成・検証を行いました。
○ Alembic のデータサイズが800メガバイト弱、ポリゴン数も後々 VAT 等で書き出すことも可能な位
に収まりました。
○ 検証段階ではメッシュのピクつきが多かったのでブラッシュアップし、各種調整を行ったものを最終
的なアセットとして使用しています。
107
ⒸKLab inc.
Cutscene : Breakdown
● Alembic 検証:概要
○ 基本仕様
■ Unity のパッケージマネージャからインストールできる公式のパッケージを使用し、各種検証
を行いました。
■ Alembic パッケージのカスタムは特に行っておらず、標準環境のものを使用しています。
108
ⒸKLab inc.
Cutscene : Breakdown
● Alembic 検証:概要
○ HDRP で問題なく使用できるのは今までの経験で分かっていたので、『 URPで同じように使用でき
るか?』『アプリとしてビルドした時に問題ないか?』が検証の焦点でした。
109
ⒸKLab inc.
Cutscene : Breakdown
● Alembic 検証:URP
○ Tree generator で作成したモデルを Alembic で書き出して読み込み、 Vコンテを作成しながら問題
なく動作するかどうか検証しました。
○ 結論としては、HDRP 同様に URP でも使用可能という答えに至りました。
110
ⒸKLab inc.
Cutscene : Breakdown
● Alembic 検証:ビルド
○ Windows ビルドは問題なく実行され、 アプリケーションとして正常に動作することを確認できまし
た。
■ これにより、今回のような用途での Alembic の利用は Windows 環境では問題ないという検
証結果を得る事ができました。
○ iOS / Android は共に標準では Alembic をサポートしていないので、当たり前ではありますがその
ままビルドしても Alembic のアセットは表示されませんでした。
■ しかし、Alembic のアセットが表示されないだけで、影響している周辺のその他の要素は問
題なく動作している事を確認できました。
111
ⒸKLab inc.
Cutscene : Breakdown
● Alembic 検証:注意点1
○ Tree generator のアトリビュート分けの問題なのか、 書き出した Alembic ファイルを Unity でアニ
メーションさせると、 1番最新の世代のものしか表示されなくなるという問題がありました。
112
ⒸKLab inc.
Cutscene : Breakdown
● Alembic 検証:注意点1:Lucky break
○ Tree generator のアトリビュート分けの問題なのか、 書き出した Alembic ファイルを Unity でアニ
メーションさせると、 1番最新の世代のものしか表示されなくなるという問題がありました。
○ 原因の解明まで検証する工数はなかったので、この状況を逆手にとって、幹・枝・葉のような各世代
ごとの木の情報を別々に書き出して使用しました。
■ 個別にアニメーションを制御できるので、却ってこの方が Timeline で細かい制御がし易くて
便利でした。
113
ⒸKLab inc.
Cutscene : Breakdown
● Alembic 検証:注意点2
○ 集団作業で Github 等でバージョン管理を行い、自分以外の人がプロジェクトやシーン全体に関わ
るようなものを更新すると、よくリンクが切れます。
■ 解決策としては、リンクの切れた Alembic ファイルを右クリック →『Reimport』で解決します。
■ 致命的な問題ではないので対症療法でも作業に支障は生じないのですが、気になる場合は
カスタム対応をする必要があるでしょう。
114
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:概要
○ リアルタイムのコンポジット・編集は Unity 標準機能の Timeline エディタで行っています。
115
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:概要
○ Timeline 作業の要点は下記の通りです。
■ 本番環境に後からマージしても問題ないようなシーン作りを行うこと。
■ キャラクターのアニメーションはほぼアイドリングポーズのみで行うこと。
● その上で、オープニングとエンディングをカットシーンとして成立させること。
■ カットシーンカメラからインゲームカメラへの移行をアーティスト主導で行えるか検証すること。
116
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Vコンテ
○ Alembic の検証等を行いながら、並行して Vコンテを作成します。
117
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Vコンテ
○ この段階で、カットシーン全体の尺とおおよそのカメラワークを完成させます。
○ また、キャラクターアニメーションがほぼ無しでも大丈夫なようなカット割りを行います。
118
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Vコンテ
○ この段階で、カットシーン全体の尺とおおよそのカメラワークを完成させます。
○ また、キャラクターアニメーションがほぼ無しでも大丈夫なようなカット割りを行います。
119
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Vコンテ
○ この段階で、カットシーン全体の尺とおおよそのカメラワークを完成させます。
○ また、キャラクターアニメーションがほぼ無しでも大丈夫なようなカット割りを行います。
120
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Vコンテ:エフェクト
○ Vコンテの段階で、木のアニメーション以外のエフェクトも一通り仕込み、見た目やタイミングを大ま
かに調整しておきます。
121
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Vコンテ:エフェクト
○ Vコンテの段階で、木のアニメーション以外のエフェクトも一通り仕込み、見た目やタイミングを大ま
かに調整しておきます。
122
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Cinemachine
○ カメラはUnity社公式のカメラ制御ツールである Cinemachine を使用しています。
123
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Cinemachine
○ 機能が優れている点もさることながら、ヴァーチャルカメラという性質上、シーンのカメラ設定に影響
を与えることなくカメラの追加や調整が可能な点もこのツールの強みです。
■ これにより、本番環境の設定に影響を与えることもなく、 Github 上の差分を作る事もなくカット
シーン作業で自由にカメラを追加したり調整したりすることができます。
■ 上記と同様の理由で、 CinemachineCamera を Prefab や Package で後から本番環境に持
ち込んでも、コンフリクト等の問題を起こすことなくマージすることができます。
124
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Cinemachine:Dolly
○ ドリーの作成・制御も容易です。
■ そのため、背景のウォークスルーのようなショットも作りやすいです。
125
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Cinemachine:DoF
○ Post process は URP 標準のものを使用しており、 DoF も標準のものを使用しています。
126
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Cinemachine:DoF
○ ただし、標準環境だと Post process に Timeline 上でキーフレームを打つことができず、 DoF のオ
ンオフが手軽にできません。
○ 対処法として、カメラ毎に異なる DoF の設定を持たせ、カメラ自体の表示をオンオフすることで、疑
似的に DoF のオンオフや複数の DoF 設定を使えるようにしています。
127
ⒸKLab inc.
Cutscene : Breakdown
● Work in Timeline:Cinemachine:Seamless camera transition
○ 検証項目の一つでしたが、 Timeline 上で Cinemachine を用いる事で簡単に実現できました。
○ ただしこの手法を使う場合は、実際にゲームプレイで使用するカメラも CinemachineCamera に設
定しておく必要があります。
128
ⒸKLab inc.
Cutscene : Breakdown
● Work in Visual Effect Graph
○ SDF Particles の応用で、木に収束・拡散するパーティクルを Visual Effect Graph で作成していま
す。
129
ⒸKLab inc.
Cutscene : Breakdown
● Work in Visual Effect Graph
○ SDF Particles の応用で、木に収束・拡散するパーティクルを Visual Effect Graph で作成していま
す。
130
ⒸKLab inc.
Cutscene : Breakdown
● Work in Visual Effect Graph
○ SDF Particles の応用で、木に収束・拡散するパーティクルを Visual Effect Graph で作成していま
す。
131
ⒸKLab inc.
Cutscene : Breakdown
● Work in Visual Effect Graph
○ SDF Particles の応用で、木に収束・拡散するパーティクルを Visual Effect Graph で作成していま
す。
132
ⒸKLab inc.
Cutscene : Breakdown
● Work in Visual Effect Graph
○ 縁取りのように使っている SDF Particles も Visual Effect Graph で作成しています。
133
ⒸKLab inc.
Cutscene : Breakdown
● Work in Visual Effect Graph
○ 画像の様に四角形の SDF 用の素材を用意する事で、様々な縦横の比率に対応したパーティクル
表現を Visual Effect Graph で行う事ができます。
134
ⒸKLab inc.
Cutscene : Breakdown
● Work in Visual Effect Graph
○ 画像の様に四角形の SDF 用の素材を用意する事で、様々な縦横の比率に対応したパーティクル
表現を Visual Effect Graph で行う事ができます
135
ⒸKLab inc.
Cutscene : Breakdown
● Work in Visual Effect Graph:ビルド
○ アプリケーションとしてビルドした際に問題ないかどうかも検証内容の一つだったので、カットシーン
中は多い時は毎秒50万パーティクル位のパーティクルを発生させています。
○ 結果としましては、Windowsビルドは当然ではありますが問題無しで、意外なことにこのままのパー
ティクル量でも iPhone12 Pro 以上の環境では iOS でも問題なく動作しました。
136
ⒸKLab inc.
Cutscene : Breakdown
● More effects:Smoke
○ 煙素材は Houdini で作成したテクスチャを Unity の Particle system で使用し、アセットを作成して
います。
137
ⒸKLab inc.
Cutscene : Breakdown
● More effects:Smoke
○ Visual Effect Graph を使用していない理由ですが、 Unlit の素材を Visual Effect Graph で使用す
ると、深度情報が上手く生成されないのか、 DoF を使用した際にボケのかかっている部分とそうで
ない部分がパッキリと分かれてビジュアルが破綻してしまうためです。
138
ⒸKLab inc.
Cutscene : Breakdown
● More effects:Smoke
○ HDRP で Ray tracing を効かせた状態だと、 Visual Effect Graph で Unlit のものを扱っても綺麗に
ボケがかけられる事が多いのですが、今回は環境が URP なので前述の問題が発生する可能性
が低い Particle system を使用しています。
139
ⒸKLab inc.
Cutscene : Breakdown
● テクスチャ調整
○ 木に書き込まれたようなテクスチャは、線画素材を AfterEffects で加工して作成しています。
140
ⒸKLab inc.
Cutscene : Breakdown
● テクスチャ調整
○ 木に書き込まれたようなテクスチャは、線画素材を AfterEffects で加工して作成しています。
141
ⒸKLab inc.
Cutscene : Breakdown
● この項目の説明は以上となります。
142
ⒸKLab inc.
River & Waterfall
143
ⒸKLab inc.
River & Waterfall
● 目的
○ 背景の自動生成アセットに組み込めるような、川や滝を生成する仕組みを作成すること。
144
ⒸKLab inc.
River & Waterfall
● 目的
○ 背景の自動生成アセットに組み込めるような、川や滝を生成する仕組みを作成すること。
● 検証&作業方針
○ 背景の自動生成に対応するために、ルールに則った形でメッシュや Flowmapが生成されるプロ
シージャルアセットを構築すること。
145
ⒸKLab inc.
River & Waterfall
● 基本的な考え方
○ 背景やそれに付随する要素の考え方やアプローチは、海外 AAAタイトルのBreakdown資料を参考
にしています。
○ また、個人的にもこの分野は興味があって自分なりのアプローチを構築していたので、その手法と
ハイブリッドにしてアセットを構築しています。
■ 私の個人的な考え方は、 『Unity道場Houdini編:UnityとHoudiniで作るRealtimeVFX実践解
説』で詳しく紹介しています。
● こちらはUnity社のYoutubeページや Unity Learning Materials にも掲載されています
ので、よろしければご覧ください。
146
ⒸKLab inc.
River & Waterfall:Breakdown
147
ⒸKLab inc.
River & Waterfall : Breakdown
● Overview
○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。
148
ⒸKLab inc.
River & Waterfall : Breakdown
● Overview
○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。
149
ⒸKLab inc.
River & Waterfall : Breakdown
● Work in Houdini
○ カーブに沿ってメッシュや Flowmap を生成するようなアセットを作成します。
150
ⒸKLab inc.
River & Waterfall : Breakdown
● Work in Houdini
○ メッシュや Flowmap の詳細な生成手法は前述した 『Unity道場Houdini編:UnityとHoudiniで作る
RealtimeVFX実践解説』で解説しています。
○ 資料・動画共に一般公開されているので気になる方は併せてご覧ください。
151
ⒸKLab inc.
River & Waterfall : Breakdown
● Work in Houdini
○ 背景の自動生成の際に、 VFX作業と同じようなカーブを生成するようにして頂く事で、アセットを適
応するだけで川や滝用のメッシュや Flowmap を生成することができます。
○ こうする事で、アジャイル進行及び本番環境を触れない状態でも、本番環境と同様の仕組みで
PoC を作成することができます。
○ ほぼ本番同様の仕組みで PoC を作成するので、調整したアセットはスムーズに本番環境に移行さ
せることができます。
152
ⒸKLab inc.
River & Waterfall : Breakdown
● Work in Houdini:Tips
○ ゲームエンジンで水の深さを表現するときに、カメラからの距離や深度を用いる事があります。
○ そういった場合は背景の制作や自動生成の段階で、多少川底を深めに作って頂くように背景担当
者とすり合わせをしておくと、ゲームエンジン上で水の見た目の調整がし易くなります。
○ 参考にした海外AAAタイトルの資料だと、意図的に川底を深めに作ってゲームエンジン上で川が綺
麗に見えるような工夫をしていました。
153
ⒸKLab inc.
River & Waterfall : Breakdown
● Work in Houdini:Tips
○ 直瀑の滝のような直角に近いものでも、直角にカーブやメッシュを作るのではなく多少傾斜を付け
ておくことをお奨めします。
154
ⒸKLab inc.
River & Waterfall : Breakdown
● Work in Houdini:Tips
○ 直瀑の滝のような直角に近いものでも、直角にカーブやメッシュを作るのではなく多少傾斜を付け
ておくことをお奨めします。
○ こうすることで法線方向をベースに Flowmap を生成しやすくなります。
■ 感覚的に言うと、モデルのノーマルマップ生成時に直角のディテールからは上手くノーマル
マップが生成できないので、傾斜を付けるのと同じような感じです。
○ 法線方向を元から使用しない場合もあるのですが、法線方向を使用できた方がアセットの汎用性
が高まるので、事前にこういった仕込みをしておくと後々の作業が楽になります。
155
ⒸKLab inc.
River & Waterfall : Breakdown
● PDGで処理する際の工夫
○ PDG で使わない普通のアセットの場合、メッシュや Flowmap 生成・各素材のエクスポートまでの
一連の仕組みを一つの Subnet に収めることが多いと思います。
○ しかしこれだと PDG でのクック時に問題が起こりやすいので、素材生成とエクスポートの Subnet
を分けて、二つ或いは三つの HDA にすると PDG で問題が起こり辛いです。
156
ⒸKLab inc.
River & Waterfall : Breakdown
● テクスチャ作成:ミスト
○ Houdini で煙ベースの素材を作成し、 AfterEffects で調整してループ素材にして Unity で使用して
います。
○ ミスト感をだすために、煙だけではなく煙の Velocity を参照したパーティクルを混ぜたりしてテクス
チャを作成しています。
157
ⒸKLab inc.
River & Waterfall : Breakdown
● テクスチャ作成:滝
○ Houdini で簡単に滝を模してシミュレーションした素材を AfterEffects で加工し、タイリング可能な 1
枚のテクスチャにして Unity で使用します。
○ 元が滝を模して物理シミュレーションした素材なので、加工されて静止画になっても UVスクロール
や Flowmap で動かした時に動きに説得力があります。
158
ⒸKLab inc.
River & Waterfall : Breakdown
● テクスチャ作成:滝
○ Houdini で簡単に滝を模してシミュレーションした素材を AfterEffects で加工し、タイリング可能な 1
枚のテクスチャにして Unity で使用します。
○ 元が滝を模して物理シミュレーションした素材なので、加工されて静止画になっても UVスクロール
や Flowmap で動かした時に動きに説得力があります。
159
ⒸKLab inc.
River & Waterfall : Breakdown
● Work in Unity
○ キャラや背景、ルックに合わせて各種調整を行います。
○ 背景が自動生成故にアジャイルなので、作業進捗によって形状が変化します。
■ そのため各種要素は背景の生成具合に合わせて適宜調整していきました。
160
ⒸKLab inc.
River & Waterfall : Breakdown
● この項目の説明は以上となります。
161
ⒸKLab inc.
Splash
162
ⒸKLab inc.
Splash
● 概要
○ 厳密にはこの項目は検証内容ではないのですが、海や川といったプレイヤーが進入可能な水回り
の要素が多くなったので、それらにプレイヤーが進入した際の水飛沫のエフェクトが必要になって
作成しました。
○ 検証内容ではないので作業工数は最低限で行う必要がありました。
■ そのため「Houdini でのシミュレーション・レンダリング → AfterEffects でのコンポジット・調整
→ Unity での ParticleSystem 及び Shader 作成」を約1日で行っています。
163
ⒸKLab inc.
Splash:Breakdown
164
ⒸKLab inc.
Splash : Breakdown
● Overview
○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。
165
ⒸKLab inc.
Splash : Breakdown
● Work in Houdini
○ プリレンダーで使用するような弾ける水の素材を数パターンほどシミュレーションします。
166
ⒸKLab inc.
Splash : Breakdown
● Work in Houdini
○ リング素材も簡単な白い円でも良かったのですが、せっかくなのでシミュレーションついでに少し
凝ったものを作成しました。
167
ⒸKLab inc.
Splash : Breakdown
● Lighting in Houdini
○ ライトはドームライト 1灯です。
○ 透明な流体のビジュアル構築及びアーティファクト低減のために、 Dome Map はシンプルな見た目
のテクスチャを使用しています。
168
ⒸKLab inc.
Splash : Breakdown
● Rendering in Houdini
○ レンダリングは Redshift で行っています。
○ Mantra の場合、水のようなオブジェクトを今回位のクオリティでレンダリングするのに 1コマ数分か
かりますが、 Redshift だと1コマ数秒で終わるので、タイトなスケジュールでは重宝します。
169
ⒸKLab inc.
Splash : Breakdown
● Rendering Tips in Houdini
○ Mantra も設定次第では添付 Gif のようにレンダリング時間を短縮することができます。
○ クオリティラインとコンポでのフォロー具合を勘案することで、 Mantra でも充分実用的な速度でレン
ダリングする事が可能です。
170
ⒸKLab inc.
Splash : Breakdown
● Composite in AfterEffects
○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし
てレンダリングします。
171
ⒸKLab inc.
Splash : Breakdown
● Composite in AfterEffects
○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし
てレンダリングします。
172
ⒸKLab inc.
Splash : Breakdown
● Composite in AfterEffects
○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし
てレンダリングします。
173
ⒸKLab inc.
Splash : Breakdown
● Composite in AfterEffects
○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし
てレンダリングします。
174
ⒸKLab inc.
Splash : Breakdown
● Composite in AfterEffects
○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし
てレンダリングします。
175
ⒸKLab inc.
Splash : Breakdown
● Work in Unity
○ Particle System や Shader の仕込みを行い、キャラクターと合わせてスケール感や抽象度を調整
します。
176
ⒸKLab inc.
Splash : Breakdown
● Work in Unity
○ Particle System や Shader の仕込みを行い、キャラクターと合わせてスケール感や抽象度を調整
します。
177
ⒸKLab inc.
Splash : Breakdown
● Work in Unity
○ 飛び散る水飛沫はテクスチャシートベースで作りましたが、拡散するリングは広がっていく速度を微
調整したかったので、 Flowmap で静止画テクスチャが広がっていくようにアセットを作りました。
178
ⒸKLab inc.
Splash : Breakdown
● How to create a Flowmap
○ Flowmap は流体シミュレーションのついでに Houdini で作成しています。
○ 今回使用しているような Flowmap の作り方は、前述した 『Unity道場Houdini編:UnityとHoudiniで
作るRealtimeVFX実践解説』で解説しています。
○ 資料・動画共に一般公開されているので気になる方は併せてご覧ください。
179
ⒸKLab inc.
Splash : Breakdown
● この項目の説明は以上となります。
180
ⒸKLab inc.
PV
181
ⒸKLab inc.
PV
● 概要
○ これも厳密には検証内容ではないのですが、社内外への展開のために作成いたしました。
○ 『 Unity からの連番書き出し』 →『 Houdini でのエフェクト作成』 →『 AfterEffects での素材作成やコ
ンポジット・編集』を合わせて三日位で行っています。
182
ⒸKLab inc.
PV : Breakdown
183
ⒸKLab inc.
PV : Breakdown
● Overview
○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。
184
ⒸKLab inc.
PV : Breakdown
● 編集
○ AfterEffects でコンポジットから編集まで地続きで行います。
○ この手の映像仕事を生業にしている方からすれば自明なことではございますが、これ位の尺の映
像の場合は編集ソフトを介さずに、 AfterEffects で編集までしてしまうことは珍しくありません。
185
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:素材&アニメーション作成
○ ロゴ素材のパスデータを Element3D で3Dオブジェクト化してアニメーションさせています。
186
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:素材&アニメーション作成
○ ロゴ素材のパスデータを Element3D で3Dオブジェクト化してアニメーションさせています。
187
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:イメージ背景素材作成
○ イメージ背景のベース素材は Unityで作成しています。
188
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:イメージ背景素材作成
○ この手のボリュームフォグやライトを用いたグラデーション映像をプリレンダーで作成しようとする
と、綺麗なビジュアルを作るのも大変ですしレンダリングにも時間がかかります。
○ ゲームエンジンだとこの手のビジュアルは比較的作りやすく、レンダリングも瞬時に終わるので、個
人的にはこういったイメージ素材は最近はゲームエンジンで作る事が多いです。
189
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:ショックウェーブ素材作成
○ 画像素材を Houdini に読み込み、ショックウェーブエフェクトを作成します。
190
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:ショックウェーブ素材作成
○ 画像素材を Houdini に読み込み、ショックウェーブエフェクトを作成します。
191
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:ショックウェーブ素材作成
○ 画像素材を Houdini に読み込み、ショックウェーブエフェクトを作成します。
192
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:ショックウェーブ素材作成
○ 画像素材を Houdini に読み込み、ショックウェーブエフェクトを作成します。
193
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:ショックウェーブ素材作成
○ ショックウェーブ自体は『グレースケールで読み込んだ画像素材の Cd を基準に煙のエミッターとな
るパーティクルを作成』 →『拡散する Velocity をエミッターに付与して煙をシミュレーション』 →『煙の
Velocity を基にショックウェーブで使用する大量のパーティクルを作成』というワークフローで作成し
ています。
○ このような『煙の Velocity を基に大量のパーティクルを放出してショックウェーブを作成』というのは
よくあるショックウェーブ作成手法です。
○ グレースケールの画像素材をベースにし、更に Cd を基準にエミッターを作成しているので、画像素
材やエミッター形状にしたい素材を差し替えるだけでバリエーションが作れるプロシージャルアセッ
トになっています。
194
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:コンポジット
○ Houdini から出力したショックウェーブ素材等を使用してコンポジットしていきます。
195
ⒸKLab inc.
PV : Breakdown
● RRRのロゴ:コンポジット
○ Houdini から出力したショックウェーブ素材等を重ねてコンポジットしていきます。
196
ⒸKLab inc.
PV : Breakdown
● 60fpsのカメラシェイクの注意点
○ テックデモ自体が60fpsなので、PVも60fpsで作成しています。
○ しかし、60fpsの映像に24fpsや30fpsの感覚でカメラシェイクを付けると、『ヌルヌルする』『ゲームっ
ぽい』或いは逆に『早すぎる』といった印象になりやすいです。
197
ⒸKLab inc.
PV : Breakdown
● 60fpsのカメラシェイクの注意点
○ 対処法として、『カメラシェイクを多層的に入れる』『レンズディストーションを極端に短尺で入れる』
『レンズフレアの横線を大きめに作り、カメラシェイクを強調する』等のテクニックを織り交ぜる事で、
『ヌルヌルする』等の映像的な違和感を取り除くことができます。当 PVではこれらのテクニックを駆
使して映像的な違和感を低減させています。
198
ⒸKLab inc.
PV : Breakdown
● 各種テキスト素材作成
○ ロゴと同様に Element3D で3Dオブジェクト化してアニメーションを付け、 Houdini でショックウェー
ブエフェクトを作成し、 AfterEffects でコンポジットしています。
199
ⒸKLab inc.
PV : Breakdown
● 各種テキスト素材作成
○ ロゴと同様に Element3D で3Dオブジェクト化してアニメーションを付け、 Houdini でショックウェー
ブエフェクトを作成し、 AfterEffects でコンポジットしています。
200
ⒸKLab inc.
PV : Breakdown
● 各種テキスト素材作成
○ ロゴと同様に Element3D で3Dオブジェクト化してアニメーションを付け、 Houdini でショックウェー
ブエフェクトを作成し、 AfterEffects でコンポジットしています。
201
ⒸKLab inc.
PV : Breakdown
● 各種テキスト素材作成
○ ロゴと同様に Element3D で3Dオブジェクト化してアニメーションを付け、 Houdini でショックウェー
ブエフェクトを作成し、 AfterEffects でコンポジットしています。
202
ⒸKLab inc.
PV : Breakdown
● イラストカットの雰囲気作り
○ Cutscene 用に作成した画像に、更にパーティクルや煙の素材を追加して空気感を演出し、シネマ
ティックに色味を調整してブラッシュアップを行いました。
203
ⒸKLab inc.
PV : Breakdown
● OKURIGAMIのロゴ
○ ロゴや各種テキストと同様に、 Houdini でショックウェーブ素材を作成し、 AfterEffects でコンポジッ
トしています。
204
ⒸKLab inc.
PV : Breakdown
● OKURIGAMIのロゴ
○ ショックウェーブの出現に合わせてロゴ素材を上手く拡散させてフェードさせる事で、気持ちの良い
消え方を演出しています。
205
ⒸKLab inc.
PV : Breakdown
● OKURIGAMIのロゴ
○ ショックウェーブの出現に合わせてロゴ素材を上手く拡散させてフェードさせる事で、気持ちの良い
消え方を演出しています。
206
ⒸKLab inc.
PV : Breakdown
● この項目の説明は以上となります。
207
ⒸKLab inc.
Appendix
208
ⒸKLab inc.
Appendix
● 1時間枠という事で、他にも紹介できそうな内容がいくつかございました。
● 折角なのでどういった候補があったかをそれぞれ簡単にご紹介致します。
209
ⒸKLab inc.
Appendix
● 講演内容候補
○ Character Creator 3 紹介
○ Mantra Rendering Tips
○ HoudiniとAfterEffectsで作るNPRエフェクト:2021年秋
○ リモートワークでの育児・仕事両立のワーキングペアレント小話
210
ⒸKLab inc.
Appendix
● Character Creator 3 紹介
○ 「名前は知っているし興味もあるけど使ったことはない」という方も多いと思うので、 Character
Creator 3 の簡単な紹介を登壇内容の候補の一つとして考えていました。
211
ⒸKLab inc.
Appendix
● Character Creator 3 紹介
○ 端的に紹介すると、 Character Creator 3 を使用すると、こういったキャラ素体として使えるモデル
が1時間足らずでサクッと作成できます。
212
ⒸKLab inc.
Appendix
● Character Creator 3 紹介
○ HEADSHOT というプラグインを使用する事で、顔写真 1枚から添付資料のようなデジタルヒューマ
ンの頭部を作成することもできます。
○ 添付動画のように、低解像度・逆光・髪で片目が隠れているような写真からでも、結構しっかりと特
徴を拾って頭部を生成してくれます。
213
ⒸKLab inc.
Appendix
● Character Creator 3 紹介
○ 元々外部ツールとの連携を意識したツールなので、 DCCツールやゲームエンジンへのエクスポート
も比較的しやすいです。
214
ⒸKLab inc.
Appendix
● Character Creator 3 紹介
○ 添付動画は試しに Unity 上で動かしてみたものです。
○ Character Creator 3 で作成したモデルは比較的容易に Unity 上で動かすことができます。
215
ⒸKLab inc.
Appendix
● Mantra Rendering Tips
○ Houdini のレンダリングは初心者にはとっつき辛い部分があるので、 Mantra を使用して添付画像
のようなものをレンダリングし、コンポジットするテクニックの紹介も候補の一つでした。
216
ⒸKLab inc.
Appendix
● Mantra Rendering Tips
○ 重いレンダリングをそのまま回すと、添付画像のようなレンダリング時間になってしまったりするの
で、オプティマイズや時間をかけるべき箇所の見極め方等々も、講演内容の候補でした。
217
ⒸKLab inc.
Appendix
● HoudiniとAfterEffectsで作るNPRエフェクト・2021年秋
○ 今年の2月に『Houdiniで作るNPRエフェクト&After Effectsでのコンポジット実践解説オンラインセミ
ナー』という題でNPRエフェクト講座を行いましたが、最近また添付 Gif のようなNPRエフェクトを趣
味で作っているので、その内容も講演候補でした。
218
ⒸKLab inc.
Appendix
● リモートワークでの育児・仕事両立のワーキングペアレント小話
○ 今年の CEDEC でも上記の内容のセッションが複数あり、世界情勢と合わせてこの話題は業界的
に一つのトレンドだと思われます。
○ 私自身、長男が生まれてすぐに COVID-19 が流行り出し、そのまま仕事がリモートワーク主体にな
り、仕事と育児を両立しつつ今に至ります。
○ そのためこの話題に関しての知見や苦労話は色々と蓄積されているので、登壇内容の候補として
考えていました。
219
ⒸKLab inc.
Appendix
● この項目の内容は以上となります。
● 機会がございましたらこれらの内容もどこかでお話しできればと思います。
220
ⒸKLab inc.
ご清聴ありがとうございました。
221
ⒸKLab inc.
Q&A
222
ⒸKLab inc.
end
223

Contenu connexe

Tendances

【CEDEC2017】Unityを使ったNintendo Switch™向けのタイトル開発・移植テクニック!!
【CEDEC2017】Unityを使ったNintendo Switch™向けのタイトル開発・移植テクニック!!【CEDEC2017】Unityを使ったNintendo Switch™向けのタイトル開発・移植テクニック!!
【CEDEC2017】Unityを使ったNintendo Switch™向けのタイトル開発・移植テクニック!!Unity Technologies Japan K.K.
 
NPRキャラクターレンダリング総結集!今こそ更なる高みを目指して | UNREAL FEST EXTREME 2020 WINTER
NPRキャラクターレンダリング総結集!今こそ更なる高みを目指して | UNREAL FEST EXTREME 2020 WINTERNPRキャラクターレンダリング総結集!今こそ更なる高みを目指して | UNREAL FEST EXTREME 2020 WINTER
NPRキャラクターレンダリング総結集!今こそ更なる高みを目指して | UNREAL FEST EXTREME 2020 WINTERエピック・ゲームズ・ジャパン Epic Games Japan
 
VRM 標準シェーダ MToon の使い方
VRM 標準シェーダ MToon の使い方VRM 標準シェーダ MToon の使い方
VRM 標準シェーダ MToon の使い方VirtualCast, Inc.
 
中級グラフィックス入門~シャドウマッピング総まとめ~
中級グラフィックス入門~シャドウマッピング総まとめ~中級グラフィックス入門~シャドウマッピング総まとめ~
中級グラフィックス入門~シャドウマッピング総まとめ~ProjectAsura
 
【Unite Tokyo 2018】ユニティちゃんトゥーンシェーダー2.0使いこなしスペシャル ~こだわりの活用法を紹介します!~
【Unite Tokyo 2018】ユニティちゃんトゥーンシェーダー2.0使いこなしスペシャル ~こだわりの活用法を紹介します!~【Unite Tokyo 2018】ユニティちゃんトゥーンシェーダー2.0使いこなしスペシャル ~こだわりの活用法を紹介します!~
【Unite Tokyo 2018】ユニティちゃんトゥーンシェーダー2.0使いこなしスペシャル ~こだわりの活用法を紹介します!~Unity Technologies Japan K.K.
 
Cinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作るCinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作るUnity Technologies Japan K.K.
 
Unity道場京都スペシャル トゥーンシェーディングとノンフォトリアリスティック風絵づくり入門_
 Unity道場京都スペシャル トゥーンシェーディングとノンフォトリアリスティック風絵づくり入門_ Unity道場京都スペシャル トゥーンシェーディングとノンフォトリアリスティック風絵づくり入門_
Unity道場京都スペシャル トゥーンシェーディングとノンフォトリアリスティック風絵づくり入門_Unity Technologies Japan K.K.
 
ネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分けネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分けモノビット エンジン
 
第一回リグナイト『リガーアニメーター座談会その①』資料
第一回リグナイト『リガーアニメーター座談会その①』資料第一回リグナイト『リガーアニメーター座談会その①』資料
第一回リグナイト『リガーアニメーター座談会その①』資料BACKBONE-studio
 
Behaviour Tree AI in Gentou Senki Griffon (幻塔戦記グリフォンでのBehaviour Treeの試み)
 Behaviour Tree AI in Gentou Senki Griffon (幻塔戦記グリフォンでのBehaviour Treeの試み) Behaviour Tree AI in Gentou Senki Griffon (幻塔戦記グリフォンでのBehaviour Treeの試み)
Behaviour Tree AI in Gentou Senki Griffon (幻塔戦記グリフォンでのBehaviour Treeの試み)Sindharta Tanuwijaya
 
SSII2014 チュートリアル資料
SSII2014 チュートリアル資料SSII2014 チュートリアル資料
SSII2014 チュートリアル資料Masayuki Tanaka
 
モバイルアプリにおけるアーティストフレンドリーな水面表現戦略
モバイルアプリにおけるアーティストフレンドリーな水面表現戦略モバイルアプリにおけるアーティストフレンドリーな水面表現戦略
モバイルアプリにおけるアーティストフレンドリーな水面表現戦略Haruki Yano
 
背景を作って苦労してみた ~Amplify Impostors~
背景を作って苦労してみた ~Amplify Impostors~背景を作って苦労してみた ~Amplify Impostors~
背景を作って苦労してみた ~Amplify Impostors~poko ponmaru
 
【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす
【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす
【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなすUnity Technologies Japan K.K.
 

Tendances (20)

【CEDEC2017】Unityを使ったNintendo Switch™向けのタイトル開発・移植テクニック!!
【CEDEC2017】Unityを使ったNintendo Switch™向けのタイトル開発・移植テクニック!!【CEDEC2017】Unityを使ったNintendo Switch™向けのタイトル開発・移植テクニック!!
【CEDEC2017】Unityを使ったNintendo Switch™向けのタイトル開発・移植テクニック!!
 
NPRキャラクターレンダリング総結集!今こそ更なる高みを目指して | UNREAL FEST EXTREME 2020 WINTER
NPRキャラクターレンダリング総結集!今こそ更なる高みを目指して | UNREAL FEST EXTREME 2020 WINTERNPRキャラクターレンダリング総結集!今こそ更なる高みを目指して | UNREAL FEST EXTREME 2020 WINTER
NPRキャラクターレンダリング総結集!今こそ更なる高みを目指して | UNREAL FEST EXTREME 2020 WINTER
 
VRM 標準シェーダ MToon の使い方
VRM 標準シェーダ MToon の使い方VRM 標準シェーダ MToon の使い方
VRM 標準シェーダ MToon の使い方
 
中級グラフィックス入門~シャドウマッピング総まとめ~
中級グラフィックス入門~シャドウマッピング総まとめ~中級グラフィックス入門~シャドウマッピング総まとめ~
中級グラフィックス入門~シャドウマッピング総まとめ~
 
【Unite Tokyo 2018】ユニティちゃんトゥーンシェーダー2.0使いこなしスペシャル ~こだわりの活用法を紹介します!~
【Unite Tokyo 2018】ユニティちゃんトゥーンシェーダー2.0使いこなしスペシャル ~こだわりの活用法を紹介します!~【Unite Tokyo 2018】ユニティちゃんトゥーンシェーダー2.0使いこなしスペシャル ~こだわりの活用法を紹介します!~
【Unite Tokyo 2018】ユニティちゃんトゥーンシェーダー2.0使いこなしスペシャル ~こだわりの活用法を紹介します!~
 
Cinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作るCinemachineで見下ろし視点のカメラを作る
Cinemachineで見下ろし視点のカメラを作る
 
UE4におけるレベル制作事例
UE4におけるレベル制作事例  UE4におけるレベル制作事例
UE4におけるレベル制作事例
 
Unity道場京都スペシャル トゥーンシェーディングとノンフォトリアリスティック風絵づくり入門_
 Unity道場京都スペシャル トゥーンシェーディングとノンフォトリアリスティック風絵づくり入門_ Unity道場京都スペシャル トゥーンシェーディングとノンフォトリアリスティック風絵づくり入門_
Unity道場京都スペシャル トゥーンシェーディングとノンフォトリアリスティック風絵づくり入門_
 
ネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分けネットワーク ゲームにおけるTCPとUDPの使い分け
ネットワーク ゲームにおけるTCPとUDPの使い分け
 
第一回リグナイト『リガーアニメーター座談会その①』資料
第一回リグナイト『リガーアニメーター座談会その①』資料第一回リグナイト『リガーアニメーター座談会その①』資料
第一回リグナイト『リガーアニメーター座談会その①』資料
 
Behaviour Tree AI in Gentou Senki Griffon (幻塔戦記グリフォンでのBehaviour Treeの試み)
 Behaviour Tree AI in Gentou Senki Griffon (幻塔戦記グリフォンでのBehaviour Treeの試み) Behaviour Tree AI in Gentou Senki Griffon (幻塔戦記グリフォンでのBehaviour Treeの試み)
Behaviour Tree AI in Gentou Senki Griffon (幻塔戦記グリフォンでのBehaviour Treeの試み)
 
SSII2014 チュートリアル資料
SSII2014 チュートリアル資料SSII2014 チュートリアル資料
SSII2014 チュートリアル資料
 
UE4の色について v1.1
 UE4の色について v1.1 UE4の色について v1.1
UE4の色について v1.1
 
モバイルアプリにおけるアーティストフレンドリーな水面表現戦略
モバイルアプリにおけるアーティストフレンドリーな水面表現戦略モバイルアプリにおけるアーティストフレンドリーな水面表現戦略
モバイルアプリにおけるアーティストフレンドリーな水面表現戦略
 
背景を作って苦労してみた ~Amplify Impostors~
背景を作って苦労してみた ~Amplify Impostors~背景を作って苦労してみた ~Amplify Impostors~
背景を作って苦労してみた ~Amplify Impostors~
 
UE4でマルチプレイヤーゲームを作ろう
UE4でマルチプレイヤーゲームを作ろうUE4でマルチプレイヤーゲームを作ろう
UE4でマルチプレイヤーゲームを作ろう
 
UE4におけるアニメーション制作事例
UE4におけるアニメーション制作事例  UE4におけるアニメーション制作事例
UE4におけるアニメーション制作事例
 
【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす
【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす
【Unity道場スペシャル 2017博多】TextMesh Pro を使いこなす
 
Unreal Engine 4を使って地球を衛る方法
Unreal Engine 4を使って地球を衛る方法Unreal Engine 4を使って地球を衛る方法
Unreal Engine 4を使って地球を衛る方法
 
アンリアルエンジン4で ノンフォトリアル描画しよう!@UNREAL FEST 2015 YOKOHAMA
アンリアルエンジン4で ノンフォトリアル描画しよう!@UNREAL FEST 2015 YOKOHAMAアンリアルエンジン4で ノンフォトリアル描画しよう!@UNREAL FEST 2015 YOKOHAMA
アンリアルエンジン4で ノンフォトリアル描画しよう!@UNREAL FEST 2015 YOKOHAMA
 

Similaire à CGWORLD 2021 クリエイティブカンファレンス

【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 後編
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 後編【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 後編
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 後編UnityTechnologiesJapan002
 
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 前編
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 前編【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 前編
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 前編UnityTechnologiesJapan002
 
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 1 モバイルゲーム はじめに
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 1 モバイルゲーム はじめにCEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 1 モバイルゲーム はじめに
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 1 モバイルゲーム はじめにKLab Inc. Creative
 
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 2 モバイルゲーム 実践
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 2 モバイルゲーム 実践CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 2 モバイルゲーム 実践
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 2 モバイルゲーム 実践KLab Inc. Creative
 
Unity名古屋セミナー [Shadowgun]
Unity名古屋セミナー [Shadowgun]Unity名古屋セミナー [Shadowgun]
Unity名古屋セミナー [Shadowgun]MakotoItoh
 
【DL輪読会】“PanopticDepth: A Unified Framework for Depth-aware Panoptic Segmenta...
【DL輪読会】“PanopticDepth: A Unified Framework for Depth-aware  Panoptic Segmenta...【DL輪読会】“PanopticDepth: A Unified Framework for Depth-aware  Panoptic Segmenta...
【DL輪読会】“PanopticDepth: A Unified Framework for Depth-aware Panoptic Segmenta...Deep Learning JP
 
LookingGlass RenderingOptimizePlan(JP)
LookingGlass RenderingOptimizePlan(JP)LookingGlass RenderingOptimizePlan(JP)
LookingGlass RenderingOptimizePlan(JP)優介 黒河
 

Similaire à CGWORLD 2021 クリエイティブカンファレンス (7)

【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 後編
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 後編【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 後編
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 後編
 
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 前編
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 前編【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 前編
【Unity道場Houdini編】UnityとHoudiniで作るRealtimeVFX実践解説 前編
 
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 1 モバイルゲーム はじめに
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 1 モバイルゲーム はじめにCEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 1 モバイルゲーム はじめに
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 1 モバイルゲーム はじめに
 
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 2 モバイルゲーム 実践
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 2 モバイルゲーム 実践CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 2 モバイルゲーム 実践
CEDEC2020 プロシージャルゲームコンテンツ制作ブートキャンプ 2020 Part 2 モバイルゲーム 実践
 
Unity名古屋セミナー [Shadowgun]
Unity名古屋セミナー [Shadowgun]Unity名古屋セミナー [Shadowgun]
Unity名古屋セミナー [Shadowgun]
 
【DL輪読会】“PanopticDepth: A Unified Framework for Depth-aware Panoptic Segmenta...
【DL輪読会】“PanopticDepth: A Unified Framework for Depth-aware  Panoptic Segmenta...【DL輪読会】“PanopticDepth: A Unified Framework for Depth-aware  Panoptic Segmenta...
【DL輪読会】“PanopticDepth: A Unified Framework for Depth-aware Panoptic Segmenta...
 
LookingGlass RenderingOptimizePlan(JP)
LookingGlass RenderingOptimizePlan(JP)LookingGlass RenderingOptimizePlan(JP)
LookingGlass RenderingOptimizePlan(JP)
 

CGWORLD 2021 クリエイティブカンファレンス

  • 1. ⒸKLab inc. TechDEMO“OKURIGAMI” : VFX Breakdown Houdini x Unity x AfterEffects Sasaki-y
  • 3. ⒸKLab inc. 自己紹介 ● 佐々木洋太 ● KLab株式会社技術統括部RRRグループ所属 ○ ※RRR = RealTime Rendering Researchの略 ● VFXシニアアーティスト 3
  • 4. ⒸKLab inc. 自己紹介 ● 来歴 ○ アニメ制作会社、3DCG制作会社で主に2D・3Dのエフェクト・コンポジット・映像制作に多数携わっ た後KLabに入社。 4
  • 5. ⒸKLab inc. ● 入社後 ○ 入社後は先端VFXの技術検証やテックデモ制作に携わりつつ、オリジナル RPGタイトルのカット シーン制作に参加。 ■ テックデモのLink ■ UnityKorea様で行ったテックデモのウェビナー Link ● 現在 ○ 現在は主に映像・エフェクトの技術・アート両分野での「新規プロジェクトへの協力・高度な VFXの技 術検証及び社内導入・制作力向上への貢献・コンセプトやスタイルガイドの構築」といった業務を 行っています。 ○ 技術検証・実践内容の一部は 2020年のCEDECや、Unity道場に登壇して紹介しています。 ■ CEDEC2020:資料 SideFX社様のCEDEC紹介ページ ■ 「Unity道場:Houdini編」:紹介ページ 前編資料 後編資料 自己紹介 5
  • 6. ⒸKLab inc. ● リアルタイム・レンダリング・リサーチグループ(RRR) ○ KLabの3Dビジュアル研究開発グループ ○ 横断活動グループとしてプロジェクトサポート及び新規開発に関与 ○ 2018年に結成 ○ 現在は7人 ■ 全員がそれぞれ違う得意分野を持っている人 ■ 全員が「楽するための苦労をしたい 」人 ● <今の仕事を仕組化・効率化し、未来を楽にする。>という、KLabの大事にしている価値観の一つでも あります。 自己紹介 6
  • 7. ⒸKLab inc. ● 現在主に使用しているツール ○ Houdini ■ プラグイン:RedshiftRender ○ AfterEffects ■ プラグイン:主要プラグインほぼ全て ○ Unity ■ 主な使用ツール:VisualEffectGraph、Timeline、Cinemachine、ShaderGraph、ParticleSystem ● サブツール及び、今まで仕事で使用してきたツール ○ 3dsmax ■ 主なプラグイン: FumeFX、AfterBurn、thinkingParticles、V-ray、Pencil+、Krakatoa、Frost、Xmesh、Rayfire ○ AfterEffects以外のAdobe製品 ■ 主なソフトウェア: Photoshop、Illustrator、Premiere Pro、Encore ○ Realflow ○ Live2D ○ UnrealEngine4 ○ Nuke ○ Maya ○ MotionBuilder 自己紹介 7
  • 8. ⒸKLab inc. ● 自主制作 ○ 仕事だけではなく趣味でもプリレンダーやリアルタイムの映像・エフェクト・モーショングラフィックス 制作をしています。 ■ 先日ボーンデジタル様主催の『 Houdiniで作るNPRエフェクト&After Effectsでのコンポジット 実践解説オンラインセミナー 』という題で、趣味の NPRエフェクトの解説セミナーを行いまし た。 ○ 本日はよろしくお願い致します。 自己紹介 8
  • 10. ⒸKLab inc. アジェンダ ● TechDemo“OKURIGAMI”について簡単に紹介 ● Breakdown Overview ● Breakdowns for each part ○ Ocean ○ SDF Particles ○ Cutscene ○ River & Waterfall ○ Splash ○ PV ● Appendix ● Q&A 10
  • 12. ⒸKLab inc. TechDemo“OKURIGAMI”について簡単に紹介 ● 概要 ○ 研究開発の一環で作られたプロジェクトです。 ○ キャラクター・アニメーション・リグ・エフェクト等の個別の研究開発は、それぞれ単独だと成果や結 果が分かり辛い事があります。そのため、テックデモという形で一つのアプリにそれらを集約する事 で、研究開発の成果や結果を分かりやすく具体化する事がこのプロジェクトの主な目的です。 12
  • 13. ⒸKLab inc. TechDemo“OKURIGAMI”について簡単に紹介 ● コンセプト ○ 物語のコンセプトや目的は、下記画像のようなシンプルなものです。 13
  • 14. ⒸKLab inc. TechDemo“OKURIGAMI”について簡単に紹介 ● 期間 ○ 企画スタートから三か月位です。 ○ 基本的には他の案件業務等と掛け持ちしながらの作業となります。 ○ コンセプトを詰めたり、必要な要素を割り出したり、各種検証期間も含んでいるので実作業期間は 最後の一か月位になります。 14
  • 15. ⒸKLab inc. TechDemo“OKURIGAMI”について簡単に紹介 ● 人員 ○ 基本的に各ポジション 1~2名です。 ■ アニメーターのみ少し多めとなっています。 15
  • 18. ⒸKLab inc. Breakdown Overview ● 概要 ○ Okurigamiの紹介及び、VFXのブレイクダウン概要をまとめた動画です。 18
  • 21. ⒸKLab inc. Ocean ● 目的 ○ Houdiniで自動生成された背景モデルに対して適応できる海素材を作成すること。 ○ 海の動きをきちんと作成すること。 ○ 波打ち際のホワイトウォーターをきちんと作成すること。 21
  • 22. ⒸKLab inc. Ocean ● 検証&作業方針 ○ Houdiniで自動生成された背景モデルに対して適応できる素材を作成すること。 ■ そのためには、自動生成に対応するルールに則った手法で各種素材を作成する必要があり ます。 ○ 海の動きをきちんと作成すること。 ■ そのためには、ディスプレイスメントマップやノーマルマップをきちんと海の動きベースで作成 する必要があります。 ○ 波打ち際のホワイトウォーターをきちんと作成すること。 ■ そのためには、オブジェクトとの接触面を Shaderで白くするとか静止画ベースやノイズで誤魔 化すのではなく、映像ベースのホワイトウォーター素材をきちんと作成する必要があります。 22
  • 23. ⒸKLab inc. Ocean ● 基本的な考え方 ○ Unity社公式のサンプルプロジェクトである「 Boat Attack」の海の作り方をベースにしています。 ○ しかし、それだけでは検証目的が達成されないので、 GDCの講演資料から海外 AAAタイトルで使 用されている手法を参考にして海のテクスチャ類を作成し、それらをハイブリッドしてアートスタイル に合わせて調整して最終的な形にしています。 23
  • 25. ⒸKLab inc. Ocean : Breakdown ● Overview ○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。 25
  • 26. ⒸKLab inc. Ocean : Breakdown ● 海面素材作成 ○ 各種テクスチャを書き出すために、まずはプリレンダーで使うような海洋素材を作成します。 26
  • 27. ⒸKLab inc. Ocean : Breakdown ● 海面素材作成 ○ 海洋素材のベースはシェルフから作成しています。 27
  • 28. ⒸKLab inc. Ocean : Breakdown ● 海面素材作成 ○ Houdiniの基本的な海洋メッシュ生成の考え方は、高精度のメッシュをそのまま使うのではなく、高 精度メッシュの海洋ノイズをディスプレイスメントマップに変換し、それを基にディテールを形作ると いうものです。 28
  • 29. ⒸKLab inc. Ocean : Breakdown ● 海面素材作成 ○ そのため、ディスプレイスメントマップ生成段階でノードをバイパスし、ディスプレイスメントマップ以 外の各種テクスチャを生成・ベイクするようなブランチを作成すれば、ゲームエンジン向けの海洋テ クスチャ生成アセットが作成できます。 29
  • 30. ⒸKLab inc. Ocean : Breakdown ● 海面素材作成 ○ そのため、ディスプレイスメントマップ生成段階でノードをバイパスし、ディスプレイスメントマップ以 外の各種テクスチャを生成・ベイクするようなブランチを作成すれば、ゲームエンジン向けの海洋テ クスチャ生成アセットが作成できます。 30
  • 31. ⒸKLab inc. Ocean : Breakdown ● 海面素材作成:Post Process ○ シェルフの海洋アセットをベースにする場合、 UVが単一のUV空間に納まっていないので、必要な アトリビュートを操作して単一の UV空間に納めます。 31
  • 32. ⒸKLab inc. Ocean : Breakdown ● 海面素材作成:Post Process ○ シェルフの海洋アセットをベースにする場合、 UVが単一のUV空間に納まっていないので、必要な アトリビュートを操作して単一の UV空間に納めます。 32
  • 33. ⒸKLab inc. Ocean : Breakdown ● 海面素材:コンポジット ○ ゲームエンジンで扱いやすいように素材を調整し、テクスチャシートに変換します。 33
  • 34. ⒸKLab inc. Ocean : Breakdown ● 海面素材紹介 ○ 最終的に使用しているテクスチャはこちらです。 34
  • 35. ⒸKLab inc. Ocean : Breakdown ● 海面素材作成:Tips ○ 元々タイリング可能な形で海洋ノイズが作られているので、特殊な変更をしない限り自然とシーム レステクスチャになります。 ○ 参考にした海外AAAタイトルの講演だと256枚のループテクスチャにしていましたが、そこまでしなく ても今回求められる要件は満たせそうだったので、当テックデモでは 48枚~64枚のループテクス チャにしています。 35
  • 36. ⒸKLab inc. Ocean : Breakdown ● 波打ち際のメッシュ作成 ○ 最終的にはメッシュの動きをディスプレイスメントマップに変換するので、ベースのアセット自体はプ リレンダーで使うような作り方と同様に作成します。 36
  • 37. ⒸKLab inc. Ocean : Breakdown ● 波打ち際のメッシュ作成 ○ 波の満ち引きを作りやすいように、コリジョン用のオブジェクトには傾斜を付けておきます。 37
  • 38. ⒸKLab inc. Ocean : Breakdown ● 波打ち際のメッシュ作成:シミュレーション ○ パーティクルもメッシュも普通にシミュレーションして問題ありません。 38
  • 39. ⒸKLab inc. Ocean : Breakdown ● 波打ち際のメッシュ作成:シミュレーション ○ ただし、後でメッシュの各種アトリビュートを使用するのでメッシュは普通のポリゴンにしておく必要 があります。 ■ 「Particle Fluid Surface」等のノードはデフォルト設定が Surface Polygon ではなく Polygon Soup になっているので注意が必要です。 39
  • 40. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーター作成 ○ ホワイトウォーターを作成します。 ○ テクスチャとしては、キャッシュをベイクしたものを使うかレンダリングしたものを使用するかなので、 基本的な制作手段はプリレンダーで作る時と同様で問題ありません。 40
  • 41. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーター作成 ○ ホワイトウォーターは SideFX社公式ドキュメントでシェルフの使用を推奨していますが、白波の動き になっているパーティクルかボリュームがあれば大丈夫なので、慣れている方は自作 Solverを使用 しても問題ありません。 41
  • 42. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーター作成 ○ ホワイトウォーターは SideFX社公式ドキュメントでシェルフの使用を推奨していますが、白波の動き になっているパーティクルかボリュームがあれば大丈夫なので、慣れている方は自作 Solverを使用 しても問題ありません。 42
  • 43. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーター作成:Post process ○ パーティクルの nage(age/life) は隠されたアトリビュートとして特に宣言しなくても生成されているの ですが、書き込み不可能の性質の性なのか参照すると思ったような挙動にならなかったので、同じ 性質のアトリビュートを作成してパーティクルの寿命に応じた拡大縮小及び色の変化の処理を行っ ています。 43
  • 44. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーター作成:Post process ○ パーティクルの nage(age/life) は隠されたアトリビュートとして特に宣言しなくても生成されているの ですが、書き込み不可能の性質の性なのか参照すると思ったような挙動にならなかったので、同じ 性質のアトリビュートを作成してパーティクルの寿命に応じた拡大縮小及び色の変化の処理を行っ ています。 44
  • 45. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーター作成:Post process ○ パーティクルの nage(age/life) は隠されたアトリビュートとして特に宣言しなくても生成されているの ですが、書き込み不可能の性質の性なのか参照すると思ったような挙動にならなかったので、同じ 性質のアトリビュートを作成してパーティクルの寿命に応じた拡大縮小及び色の変化の処理を行っ ています。 45
  • 46. ⒸKLab inc. Ocean : Breakdown ● 波打ち際メッシュのオプティマイズ ○ 波打ち際のメッシュをディスプレイスメントマップとして使うための調整を行います。 46
  • 47. ⒸKLab inc. Ocean : Breakdown ● 波打ち際メッシュのオプティマイズ ○ シミュレーションしたメッシュを正方形のグリッドに Ray Sop を使用して投影します。 ○ これにより正方形の単一の UV空間内に波の動きをベイクすることができます。 47
  • 48. ⒸKLab inc. Ocean : Breakdown ● 波打ち際メッシュのオプティマイズ ○ シミュレーションしたメッシュを正方形のグリッドに Ray Sop を使用して投影します。 ○ これにより正方形の単一の UV空間内に波の動きをベイクすることができます。 48
  • 49. ⒸKLab inc. Ocean : Breakdown ● 波打ち際メッシュのオプティマイズ ○ シミュレーションしたメッシュを正方形のグリッドに Ray Sop を使用して投影します。 ○ これにより正方形の単一の UV空間内に波の動きをベイクすることができます。 49
  • 50. ⒸKLab inc. Ocean : Breakdown ● 波打ち際メッシュのオプティマイズ ○ シミュレーションしたメッシュを正方形のグリッドに Ray Sop を使用して投影します。 ○ これにより正方形の単一の UV空間内に波の動きをベイクすることができます。 50
  • 51. ⒸKLab inc. Ocean : Breakdown ● 波打ち際メッシュのオプティマイズ ○ 位置ベースでメッシュの色分けを行います。 ○ これによりディスプレイスメントマップとして扱えるような色分けがなされます。 51
  • 52. ⒸKLab inc. Ocean : Breakdown ● 波打ち際メッシュのベイク ○ オプティマイズしたメッシュを Baker 系のノードで書き出します。 52
  • 53. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーターのベイク・レンダリング ○ ホワイトウォーターも波打ち際メッシュのようにグリッドに投影し、高速でベイクを行う事ができます。 ○ しかし、ホワイトウォーターの場合はマテリアルやレンダリング設定を調整する事で Mantra でも比 較的素早くレンダリングが可能です。 53
  • 54. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーターのベイク・レンダリング ○ ベイクの場合は頂点カラーに焼き付ける仕様上、きめ細やかなパーティクルやボリュームのディ テールは失われやすいです。そのため、ホワイトウォーターは普通にレンダリングしても問題ござい ません。 54
  • 55. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーターのベイク・レンダリング ○ 最終的にはグレースケールのテクスチャとして使用するので、ライティングの影響を受けない Glow や Constant といった定数マテリアルを使用すれば、 Mantra でも比較的綺麗且つ高速にレンダリ ングをすることができます。 55
  • 56. ⒸKLab inc. Ocean : Breakdown ● ホワイトウォーターのベイク・レンダリング ○ 最終的にはグレースケールのテクスチャとして使用するので、ライティングの影響を受けない Glow や Constant といった定数マテリアルを使用すれば、 Mantra でも比較的綺麗且つ高速にレンダリ ングをすることができます。 56
  • 57. ⒸKLab inc. Ocean : Breakdown ● Composite : COP ○ ベイクしたノーマルマップ等のデータを扱いやすいように調整します。 57
  • 58. ⒸKLab inc. Ocean : Breakdown ● Composite : COP ○ 一部のテクスチャは COP上でテクスチャシートに変換しておきます。 58
  • 59. ⒸKLab inc. Ocean : Breakdown ● Composite : AfterEffects ○ テクスチャの色味やディテールを整え、ゲームエンジンで扱いやすいように調整します。 59
  • 60. ⒸKLab inc. Ocean : Breakdown ● Composite : AfterEffects ○ 一部のテクスチャは AfterEffects 上でループ素材に変換します。 ○ SideFXLabs の Make Loop ノード等で上手にループが作成できる場合は良いのですが、今回の 波打ち際メッシュでは上手くいかなかったので、コンポジットでループ素材になるように調整していま す。 60
  • 61. ⒸKLab inc. Ocean : Breakdown ● Composite : AfterEffects ○ 一部のテクスチャは AfterEffects 上でループ素材に変換します。 ○ SideFXLabs の Make Loop ノード等で上手にループが作成できる場合は良いのですが、今回の 波打ち際メッシュでは上手くいかなかったので、コンポジットでループ素材になるように調整していま す。 61
  • 62. ⒸKLab inc. Ocean : Breakdown ● Work in Unity ○ キャラや背景、ルックに合わせて各種調整を行います。 ○ Shader は前述したように、Unity社公式のサンプルプロジェクトのものをベースにしつつ必要な改 良を施しています。 62
  • 63. ⒸKLab inc. Ocean : Breakdown ● Work in Unity ○ 背景が自動生成故にアジャイルなので、作業進捗によって形状が変化します。 ■ そのため Shader や素材は微調整がし易いように仕込み、適宜調整してブラッシュアップをし ていきました。 63
  • 64. ⒸKLab inc. Ocean : Breakdown ● Work in Unity:Tips ○ 余談ですが、 Shader は海や VFX に限らず、キャラや背景に至るまでほぼ全て Shader Graph で 作成しています。 64
  • 65. ⒸKLab inc. Ocean : Breakdown ● 注意点 ○ 今回使用している Shader Graph 10.4.0 の Flipbook ノードにはテクスチャのタイリングがずれる不 具合がございます。 ○ これはUnity社公式のフォーラムにも投稿されている既知の不具合で、最新バージョンでは修正さ れています。 ○ しかし、今回のように修正前のバージョンの Shader Graph で Flipbook ノードを使用する場合は、 ノードをカスタマイズして不具合を修正することをお奨めします。 65
  • 66. ⒸKLab inc. Ocean : Breakdown ● この項目の説明は以上となります。 66
  • 68. ⒸKLab inc. SDF Particles ● 目的 ○ Unity の GPU Particle ツールである Visual Effect Graph を様々な形で使用し、アプリとして問題 なくビルドできるかどうかを確かめること。 ○ アプリ化を目的としないリアルタイムコンテンツや映像使用目的で Visual Effect Graph が有用なの は今までの使用経験から分かっているので、今回はアプリとしてビルドした際に問題なく動作する かを焦点にしています。 68
  • 69. ⒸKLab inc. SDF Particles ● 目的 ○ Unity の GPU Particle ツールである Visual Effect Graph を様々な形で使用し、アプリとして問題 なくビルドできるかどうかを確かめること。 ○ アプリ化を目的としないリアルタイムコンテンツや映像使用目的で Visual Effect Graph が有用なの は今までの使用経験から分かっているので、今回はアプリとしてビルドした際に問題なく動作する かを焦点にしています。 ● 検証&作業方針 ○ SDF (Signed Distance Field)を使用した表現が問題なく動作するかの確認。 ○ ゲームプレイ中に Visual Effect Graph 外の要素から Visual Effect Graph の値をオーバーライドし ても問題ないかどうかの確認。 ○ Cutscene での各種使用が問題なく動作するかどうかの確認(この項目は Cutscene の説明の際 に紹介します)。 69
  • 71. ⒸKLab inc. SDF Particles : Breakdown ● Overview ○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。 71
  • 72. ⒸKLab inc. SDF Particles : Breakdown ● SDFとは ○ Signed Distance Field の略称です。 ○ Visual Effect Graph におけるSDFブロックは、端的に説明すると特定の形状に対してパーティクル が引き寄せられるor離れるような表現を行う事ができる仕組みです。 ■ この性質を用いることで、特定の形状にパーティクルの動きを沿わせるといった表現が可能 になります。 72
  • 73. ⒸKLab inc. SDF Particles : Breakdown ● Work in Houdini ○ キャラクターのFBXデータを読み込み、パーティクルの発生源となる Point Cache と SDF として用 いるための Vector Field を書き出します。 73
  • 74. ⒸKLab inc. SDF Particles : Breakdown ● Work in Houdini ○ キャラクターのFBXデータを読み込み、パーティクルの発生源となる Point Cache と SDF として用 いるための Vector Field を書き出します。 74
  • 75. ⒸKLab inc. SDF Particles : Breakdown ● Work in Houdini ○ キャラクターのFBXデータを読み込み、パーティクルの発生源となる Point Cache と SDF として用 いるための Vector Field を書き出します。 75
  • 76. ⒸKLab inc. SDF Particles : Breakdown ● Work in Houdini ○ キャラクターのFBXデータを読み込み、パーティクルの発生源となる Point Cache と、 SDF として 用いるための Vector Field を書き出します。 76
  • 77. ⒸKLab inc. SDF Particles : Breakdown ● Work in Houdini ○ PointCache と VectorField の書き出しに使用しているノードは、 Unity-Technologies の Github 上 で公開されている VFXtoolbox のものを使用しています。 77
  • 78. ⒸKLab inc. SDF Particles : Breakdown ● Work in Visual Effect Graph ○ 基本的な構成はこのような形になっています。 ○ Houdini から書き出したデータに基本的に使用するアトリビュートが格納されているので、 Visual Effect Graph のノード構成は画像のようにシンプルに形作る事ができます。 78
  • 79. ⒸKLab inc. SDF Particles : Breakdown ● Work in Visual Effect Graph ○ 基本的な構成はこのような形になっています。 ○ Houdini から書き出したデータに基本的に使用するアトリビュートが格納されているので、 Visual Effect Graph のノード構成は画像のようにシンプルに形作る事ができます。 79
  • 80. ⒸKLab inc. SDF Particles : Breakdown ● Work in Visual Effect Graph ○ 基本的な構成はこのような形になっています。 ○ Houdini から書き出したデータに基本的に使用するアトリビュートが格納されているので、 Visual Effect Graph のノード構成は画像のようにシンプルに形作る事ができます。 80
  • 81. ⒸKLab inc. SDF Particles : Breakdown ● Work in Visual Effect Graph ○ 仮シーンに配置し、調整を行って Prefab 化します。 81
  • 82. ⒸKLab inc. SDF Particles : Breakdown ● Work in Visual Effect Graph ○ 仮シーンに配置し、調整を行って Prefab 化します。 82
  • 83. ⒸKLab inc. SDF Particles : Breakdown ● Work in Unity ○ 本番用のシーンに配置し、調整を行います。 ■ 大量の発光するパーティクル故に Post Process の影響を顕著に受けるので、 本番環境で の微調整が重要です。 83
  • 84. ⒸKLab inc. SDF Particles : Breakdown ● Parameter override ○ 他のコンポーネントから Visual Effect Graph のパラメータを上書きできるかの確認や調整を行いま す。 84
  • 85. ⒸKLab inc. SDF Particles : Breakdown ● Parameter override ○ ゲームプレイ中、実際にキャラクターの接近に応じて消えていく処理が問題なく動作する事を確認し ます。 85
  • 86. ⒸKLab inc. SDF Particles : Breakdown ● Parameter override ○ 動作確認後、フェードアウトの始まる距離を調整したり、見た目を適宜微調整します。 86
  • 87. ⒸKLab inc. SDF Particles : Breakdown ● Parameter override ○ 動作確認後、フェードアウトの始まる距離を調整したり、見た目を適宜微調整します。 87
  • 88. ⒸKLab inc. SDF Particles : Breakdown ● Parameter override:Future work ○ 今回は簡単な色のフェードでしたが、 Visual Effect Graph のパラメータを外部から上書きできるこ とが確認できたので、これを応用する事で例えばキャラクターが接近したらタービュランスを強めて パーティクルが散りながら消えていくといった表現も可能だと思われます。 88
  • 89. ⒸKLab inc. SDF Particles : Breakdown ● Others ○ フィールド全域に発生させている環境パーティクルも Visual Effect Graph で作成しています。 ○ Visual Effect Graph はパーティクルの発生範囲の調整がし易く、バウンディングボックスとパーティ クルの発生範囲を個別に簡単に設定できるのでこういった用途でも便利です。 89
  • 90. ⒸKLab inc. SDF Particles : Breakdown ● この項目の説明は以上となります。 90
  • 92. ⒸKLab inc. Cutscene ● 目的 ○ ゲームやアプリであまり見かけない Alembic を使用し、ビルドして問題なく動作するかどうかの検 証。 ○ SideFXLabs Tree Generator の検証。 ○ ゲームやアプリであまり見かけない木の成長アニメーションの作成・検証。 ○ 本番環境外で基本的な Timeline を作成し、それを後からマージして問題なく動作させられるかの 検証。 ○ カットシーンカメラからインゲームカメラへのシームレスな移行を、アーティスト主体で簡単に行える かどうかの検証。 ○ カットシーン用のキャラクターアニメーション工数はほぼ取れないので、ほぼキャラクターアニメー ション無しでオープニングやエンディングを成立させる演出の構築。 92
  • 93. ⒸKLab inc. Cutscene ● 検証&作業方針 ○ 『Tree Generator』『木の成長アニメーション』『 Alembic』はまとめて検証を行うのが効果的に思える ので、これらは一括りにして検証を行うこと。 ○ Timeline やそれに付随するアセットを後から本番環境にマージするので、あまり無茶なカットシーン の作り方をしないこと。 ○ カットシーンからインゲームにシームレスに切り替わるシークエンスを作ること。 ○ キャラクターのアニメーションに依存しないようなカメラワークやカット割りでカットシーンを作成する こと。 93
  • 95. ⒸKLab inc. Cutscene : Breakdown ● Overview ○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。 95
  • 96. ⒸKLab inc. Cutscene : Breakdown ● Overview ○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。 96
  • 97. ⒸKLab inc. Cutscene : Breakdown ● Tree generator 検証:概要 ○ 始めに Houdini18.5.462 から正式に追加されたTree generator 系のノードの検証を行いました。 97
  • 98. ⒸKLab inc. Cutscene : Breakdown ● Tree generator 検証 ○ ルールに則って様々な樹木や枝葉が生成できることを検証し、充分実用的な機能だと判断して使 用を決定しました。 98
  • 99. ⒸKLab inc. Cutscene : Breakdown ● Tree generator 検証 ○ ルールに則って様々な樹木や枝葉が生成できることを検証し、充分実用的な機能だと判断して使 用を決定しました。 99
  • 100. ⒸKLab inc. Cutscene : Breakdown ● Tree generator 検証 ○ ルールに則って様々な樹木や枝葉が生成できることを検証し、充分実用的な機能だと判断して使 用を決定しました。 100
  • 101. ⒸKLab inc. Cutscene : Breakdown ● Tree generator 検証 ○ ルールに則って様々な樹木や枝葉が生成できることを検証し、充分実用的な機能だと判断して使 用を決定しました。 101
  • 102. ⒸKLab inc. Cutscene : Breakdown ● Tree generator 検証 ○ 最終的な枝葉に使うビルボード用のテクスチャも、樹木生成の仕組みを応用してプロシージャルア セットを作成し、大量のバリエーションを迅速に生成して使用しています。 102
  • 103. ⒸKLab inc. Cutscene : Breakdown ● Tree generator 検証:Tips ○ Tree generator の概要や基礎的なチュートリアルは SideFX社公式サイトの方に掲載されておりま すので、興味のある方はそちらをご覧ください。 103
  • 104. ⒸKLab inc. Cutscene : Breakdown ● Tree generator 検証:Tips ○ SideFX Labs のツールなので、 Houdini Engine のセッションシンクでも問題なく使用できます。 104
  • 105. ⒸKLab inc. Cutscene : Breakdown ● Tree animation 検証・作成:概要 ○ Tree generator の各種検証後、木の成長アニメーションの検証・作成を行いました。 105
  • 106. ⒸKLab inc. Cutscene : Breakdown ● Tree animation 検証・作成 ○ 映像制作で用いるような手法をそのまま使うと、ポリゴン数が数百万ポリゴンになったり、データサ イズが数十~数百ギガバイトになることが予想されたので、流石にテックデモとはいえ後々の業務 にコンバートし辛い手法は避けようと判断しました。 ○ そのため、まずは Tree generator の基本的な機能から外れない形でアニメーションを作り、オプ ティマイズしてポリゴン数やデータサイズが許容範囲内かどうかを確認する作業から始めました。 106
  • 107. ⒸKLab inc. Cutscene : Breakdown ● Tree animation 検証・作成 ○ Tree generator を用いて木の成長アニメーションの作成・検証を行いました。 ○ Alembic のデータサイズが800メガバイト弱、ポリゴン数も後々 VAT 等で書き出すことも可能な位 に収まりました。 ○ 検証段階ではメッシュのピクつきが多かったのでブラッシュアップし、各種調整を行ったものを最終 的なアセットとして使用しています。 107
  • 108. ⒸKLab inc. Cutscene : Breakdown ● Alembic 検証:概要 ○ 基本仕様 ■ Unity のパッケージマネージャからインストールできる公式のパッケージを使用し、各種検証 を行いました。 ■ Alembic パッケージのカスタムは特に行っておらず、標準環境のものを使用しています。 108
  • 109. ⒸKLab inc. Cutscene : Breakdown ● Alembic 検証:概要 ○ HDRP で問題なく使用できるのは今までの経験で分かっていたので、『 URPで同じように使用でき るか?』『アプリとしてビルドした時に問題ないか?』が検証の焦点でした。 109
  • 110. ⒸKLab inc. Cutscene : Breakdown ● Alembic 検証:URP ○ Tree generator で作成したモデルを Alembic で書き出して読み込み、 Vコンテを作成しながら問題 なく動作するかどうか検証しました。 ○ 結論としては、HDRP 同様に URP でも使用可能という答えに至りました。 110
  • 111. ⒸKLab inc. Cutscene : Breakdown ● Alembic 検証:ビルド ○ Windows ビルドは問題なく実行され、 アプリケーションとして正常に動作することを確認できまし た。 ■ これにより、今回のような用途での Alembic の利用は Windows 環境では問題ないという検 証結果を得る事ができました。 ○ iOS / Android は共に標準では Alembic をサポートしていないので、当たり前ではありますがその ままビルドしても Alembic のアセットは表示されませんでした。 ■ しかし、Alembic のアセットが表示されないだけで、影響している周辺のその他の要素は問 題なく動作している事を確認できました。 111
  • 112. ⒸKLab inc. Cutscene : Breakdown ● Alembic 検証:注意点1 ○ Tree generator のアトリビュート分けの問題なのか、 書き出した Alembic ファイルを Unity でアニ メーションさせると、 1番最新の世代のものしか表示されなくなるという問題がありました。 112
  • 113. ⒸKLab inc. Cutscene : Breakdown ● Alembic 検証:注意点1:Lucky break ○ Tree generator のアトリビュート分けの問題なのか、 書き出した Alembic ファイルを Unity でアニ メーションさせると、 1番最新の世代のものしか表示されなくなるという問題がありました。 ○ 原因の解明まで検証する工数はなかったので、この状況を逆手にとって、幹・枝・葉のような各世代 ごとの木の情報を別々に書き出して使用しました。 ■ 個別にアニメーションを制御できるので、却ってこの方が Timeline で細かい制御がし易くて 便利でした。 113
  • 114. ⒸKLab inc. Cutscene : Breakdown ● Alembic 検証:注意点2 ○ 集団作業で Github 等でバージョン管理を行い、自分以外の人がプロジェクトやシーン全体に関わ るようなものを更新すると、よくリンクが切れます。 ■ 解決策としては、リンクの切れた Alembic ファイルを右クリック →『Reimport』で解決します。 ■ 致命的な問題ではないので対症療法でも作業に支障は生じないのですが、気になる場合は カスタム対応をする必要があるでしょう。 114
  • 115. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:概要 ○ リアルタイムのコンポジット・編集は Unity 標準機能の Timeline エディタで行っています。 115
  • 116. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:概要 ○ Timeline 作業の要点は下記の通りです。 ■ 本番環境に後からマージしても問題ないようなシーン作りを行うこと。 ■ キャラクターのアニメーションはほぼアイドリングポーズのみで行うこと。 ● その上で、オープニングとエンディングをカットシーンとして成立させること。 ■ カットシーンカメラからインゲームカメラへの移行をアーティスト主導で行えるか検証すること。 116
  • 117. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Vコンテ ○ Alembic の検証等を行いながら、並行して Vコンテを作成します。 117
  • 118. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Vコンテ ○ この段階で、カットシーン全体の尺とおおよそのカメラワークを完成させます。 ○ また、キャラクターアニメーションがほぼ無しでも大丈夫なようなカット割りを行います。 118
  • 119. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Vコンテ ○ この段階で、カットシーン全体の尺とおおよそのカメラワークを完成させます。 ○ また、キャラクターアニメーションがほぼ無しでも大丈夫なようなカット割りを行います。 119
  • 120. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Vコンテ ○ この段階で、カットシーン全体の尺とおおよそのカメラワークを完成させます。 ○ また、キャラクターアニメーションがほぼ無しでも大丈夫なようなカット割りを行います。 120
  • 121. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Vコンテ:エフェクト ○ Vコンテの段階で、木のアニメーション以外のエフェクトも一通り仕込み、見た目やタイミングを大ま かに調整しておきます。 121
  • 122. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Vコンテ:エフェクト ○ Vコンテの段階で、木のアニメーション以外のエフェクトも一通り仕込み、見た目やタイミングを大ま かに調整しておきます。 122
  • 123. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Cinemachine ○ カメラはUnity社公式のカメラ制御ツールである Cinemachine を使用しています。 123
  • 124. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Cinemachine ○ 機能が優れている点もさることながら、ヴァーチャルカメラという性質上、シーンのカメラ設定に影響 を与えることなくカメラの追加や調整が可能な点もこのツールの強みです。 ■ これにより、本番環境の設定に影響を与えることもなく、 Github 上の差分を作る事もなくカット シーン作業で自由にカメラを追加したり調整したりすることができます。 ■ 上記と同様の理由で、 CinemachineCamera を Prefab や Package で後から本番環境に持 ち込んでも、コンフリクト等の問題を起こすことなくマージすることができます。 124
  • 125. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Cinemachine:Dolly ○ ドリーの作成・制御も容易です。 ■ そのため、背景のウォークスルーのようなショットも作りやすいです。 125
  • 126. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Cinemachine:DoF ○ Post process は URP 標準のものを使用しており、 DoF も標準のものを使用しています。 126
  • 127. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Cinemachine:DoF ○ ただし、標準環境だと Post process に Timeline 上でキーフレームを打つことができず、 DoF のオ ンオフが手軽にできません。 ○ 対処法として、カメラ毎に異なる DoF の設定を持たせ、カメラ自体の表示をオンオフすることで、疑 似的に DoF のオンオフや複数の DoF 設定を使えるようにしています。 127
  • 128. ⒸKLab inc. Cutscene : Breakdown ● Work in Timeline:Cinemachine:Seamless camera transition ○ 検証項目の一つでしたが、 Timeline 上で Cinemachine を用いる事で簡単に実現できました。 ○ ただしこの手法を使う場合は、実際にゲームプレイで使用するカメラも CinemachineCamera に設 定しておく必要があります。 128
  • 129. ⒸKLab inc. Cutscene : Breakdown ● Work in Visual Effect Graph ○ SDF Particles の応用で、木に収束・拡散するパーティクルを Visual Effect Graph で作成していま す。 129
  • 130. ⒸKLab inc. Cutscene : Breakdown ● Work in Visual Effect Graph ○ SDF Particles の応用で、木に収束・拡散するパーティクルを Visual Effect Graph で作成していま す。 130
  • 131. ⒸKLab inc. Cutscene : Breakdown ● Work in Visual Effect Graph ○ SDF Particles の応用で、木に収束・拡散するパーティクルを Visual Effect Graph で作成していま す。 131
  • 132. ⒸKLab inc. Cutscene : Breakdown ● Work in Visual Effect Graph ○ SDF Particles の応用で、木に収束・拡散するパーティクルを Visual Effect Graph で作成していま す。 132
  • 133. ⒸKLab inc. Cutscene : Breakdown ● Work in Visual Effect Graph ○ 縁取りのように使っている SDF Particles も Visual Effect Graph で作成しています。 133
  • 134. ⒸKLab inc. Cutscene : Breakdown ● Work in Visual Effect Graph ○ 画像の様に四角形の SDF 用の素材を用意する事で、様々な縦横の比率に対応したパーティクル 表現を Visual Effect Graph で行う事ができます。 134
  • 135. ⒸKLab inc. Cutscene : Breakdown ● Work in Visual Effect Graph ○ 画像の様に四角形の SDF 用の素材を用意する事で、様々な縦横の比率に対応したパーティクル 表現を Visual Effect Graph で行う事ができます 135
  • 136. ⒸKLab inc. Cutscene : Breakdown ● Work in Visual Effect Graph:ビルド ○ アプリケーションとしてビルドした際に問題ないかどうかも検証内容の一つだったので、カットシーン 中は多い時は毎秒50万パーティクル位のパーティクルを発生させています。 ○ 結果としましては、Windowsビルドは当然ではありますが問題無しで、意外なことにこのままのパー ティクル量でも iPhone12 Pro 以上の環境では iOS でも問題なく動作しました。 136
  • 137. ⒸKLab inc. Cutscene : Breakdown ● More effects:Smoke ○ 煙素材は Houdini で作成したテクスチャを Unity の Particle system で使用し、アセットを作成して います。 137
  • 138. ⒸKLab inc. Cutscene : Breakdown ● More effects:Smoke ○ Visual Effect Graph を使用していない理由ですが、 Unlit の素材を Visual Effect Graph で使用す ると、深度情報が上手く生成されないのか、 DoF を使用した際にボケのかかっている部分とそうで ない部分がパッキリと分かれてビジュアルが破綻してしまうためです。 138
  • 139. ⒸKLab inc. Cutscene : Breakdown ● More effects:Smoke ○ HDRP で Ray tracing を効かせた状態だと、 Visual Effect Graph で Unlit のものを扱っても綺麗に ボケがかけられる事が多いのですが、今回は環境が URP なので前述の問題が発生する可能性 が低い Particle system を使用しています。 139
  • 140. ⒸKLab inc. Cutscene : Breakdown ● テクスチャ調整 ○ 木に書き込まれたようなテクスチャは、線画素材を AfterEffects で加工して作成しています。 140
  • 141. ⒸKLab inc. Cutscene : Breakdown ● テクスチャ調整 ○ 木に書き込まれたようなテクスチャは、線画素材を AfterEffects で加工して作成しています。 141
  • 142. ⒸKLab inc. Cutscene : Breakdown ● この項目の説明は以上となります。 142
  • 143. ⒸKLab inc. River & Waterfall 143
  • 144. ⒸKLab inc. River & Waterfall ● 目的 ○ 背景の自動生成アセットに組み込めるような、川や滝を生成する仕組みを作成すること。 144
  • 145. ⒸKLab inc. River & Waterfall ● 目的 ○ 背景の自動生成アセットに組み込めるような、川や滝を生成する仕組みを作成すること。 ● 検証&作業方針 ○ 背景の自動生成に対応するために、ルールに則った形でメッシュや Flowmapが生成されるプロ シージャルアセットを構築すること。 145
  • 146. ⒸKLab inc. River & Waterfall ● 基本的な考え方 ○ 背景やそれに付随する要素の考え方やアプローチは、海外 AAAタイトルのBreakdown資料を参考 にしています。 ○ また、個人的にもこの分野は興味があって自分なりのアプローチを構築していたので、その手法と ハイブリッドにしてアセットを構築しています。 ■ 私の個人的な考え方は、 『Unity道場Houdini編:UnityとHoudiniで作るRealtimeVFX実践解 説』で詳しく紹介しています。 ● こちらはUnity社のYoutubeページや Unity Learning Materials にも掲載されています ので、よろしければご覧ください。 146
  • 147. ⒸKLab inc. River & Waterfall:Breakdown 147
  • 148. ⒸKLab inc. River & Waterfall : Breakdown ● Overview ○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。 148
  • 149. ⒸKLab inc. River & Waterfall : Breakdown ● Overview ○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。 149
  • 150. ⒸKLab inc. River & Waterfall : Breakdown ● Work in Houdini ○ カーブに沿ってメッシュや Flowmap を生成するようなアセットを作成します。 150
  • 151. ⒸKLab inc. River & Waterfall : Breakdown ● Work in Houdini ○ メッシュや Flowmap の詳細な生成手法は前述した 『Unity道場Houdini編:UnityとHoudiniで作る RealtimeVFX実践解説』で解説しています。 ○ 資料・動画共に一般公開されているので気になる方は併せてご覧ください。 151
  • 152. ⒸKLab inc. River & Waterfall : Breakdown ● Work in Houdini ○ 背景の自動生成の際に、 VFX作業と同じようなカーブを生成するようにして頂く事で、アセットを適 応するだけで川や滝用のメッシュや Flowmap を生成することができます。 ○ こうする事で、アジャイル進行及び本番環境を触れない状態でも、本番環境と同様の仕組みで PoC を作成することができます。 ○ ほぼ本番同様の仕組みで PoC を作成するので、調整したアセットはスムーズに本番環境に移行さ せることができます。 152
  • 153. ⒸKLab inc. River & Waterfall : Breakdown ● Work in Houdini:Tips ○ ゲームエンジンで水の深さを表現するときに、カメラからの距離や深度を用いる事があります。 ○ そういった場合は背景の制作や自動生成の段階で、多少川底を深めに作って頂くように背景担当 者とすり合わせをしておくと、ゲームエンジン上で水の見た目の調整がし易くなります。 ○ 参考にした海外AAAタイトルの資料だと、意図的に川底を深めに作ってゲームエンジン上で川が綺 麗に見えるような工夫をしていました。 153
  • 154. ⒸKLab inc. River & Waterfall : Breakdown ● Work in Houdini:Tips ○ 直瀑の滝のような直角に近いものでも、直角にカーブやメッシュを作るのではなく多少傾斜を付け ておくことをお奨めします。 154
  • 155. ⒸKLab inc. River & Waterfall : Breakdown ● Work in Houdini:Tips ○ 直瀑の滝のような直角に近いものでも、直角にカーブやメッシュを作るのではなく多少傾斜を付け ておくことをお奨めします。 ○ こうすることで法線方向をベースに Flowmap を生成しやすくなります。 ■ 感覚的に言うと、モデルのノーマルマップ生成時に直角のディテールからは上手くノーマル マップが生成できないので、傾斜を付けるのと同じような感じです。 ○ 法線方向を元から使用しない場合もあるのですが、法線方向を使用できた方がアセットの汎用性 が高まるので、事前にこういった仕込みをしておくと後々の作業が楽になります。 155
  • 156. ⒸKLab inc. River & Waterfall : Breakdown ● PDGで処理する際の工夫 ○ PDG で使わない普通のアセットの場合、メッシュや Flowmap 生成・各素材のエクスポートまでの 一連の仕組みを一つの Subnet に収めることが多いと思います。 ○ しかしこれだと PDG でのクック時に問題が起こりやすいので、素材生成とエクスポートの Subnet を分けて、二つ或いは三つの HDA にすると PDG で問題が起こり辛いです。 156
  • 157. ⒸKLab inc. River & Waterfall : Breakdown ● テクスチャ作成:ミスト ○ Houdini で煙ベースの素材を作成し、 AfterEffects で調整してループ素材にして Unity で使用して います。 ○ ミスト感をだすために、煙だけではなく煙の Velocity を参照したパーティクルを混ぜたりしてテクス チャを作成しています。 157
  • 158. ⒸKLab inc. River & Waterfall : Breakdown ● テクスチャ作成:滝 ○ Houdini で簡単に滝を模してシミュレーションした素材を AfterEffects で加工し、タイリング可能な 1 枚のテクスチャにして Unity で使用します。 ○ 元が滝を模して物理シミュレーションした素材なので、加工されて静止画になっても UVスクロール や Flowmap で動かした時に動きに説得力があります。 158
  • 159. ⒸKLab inc. River & Waterfall : Breakdown ● テクスチャ作成:滝 ○ Houdini で簡単に滝を模してシミュレーションした素材を AfterEffects で加工し、タイリング可能な 1 枚のテクスチャにして Unity で使用します。 ○ 元が滝を模して物理シミュレーションした素材なので、加工されて静止画になっても UVスクロール や Flowmap で動かした時に動きに説得力があります。 159
  • 160. ⒸKLab inc. River & Waterfall : Breakdown ● Work in Unity ○ キャラや背景、ルックに合わせて各種調整を行います。 ○ 背景が自動生成故にアジャイルなので、作業進捗によって形状が変化します。 ■ そのため各種要素は背景の生成具合に合わせて適宜調整していきました。 160
  • 161. ⒸKLab inc. River & Waterfall : Breakdown ● この項目の説明は以上となります。 161
  • 163. ⒸKLab inc. Splash ● 概要 ○ 厳密にはこの項目は検証内容ではないのですが、海や川といったプレイヤーが進入可能な水回り の要素が多くなったので、それらにプレイヤーが進入した際の水飛沫のエフェクトが必要になって 作成しました。 ○ 検証内容ではないので作業工数は最低限で行う必要がありました。 ■ そのため「Houdini でのシミュレーション・レンダリング → AfterEffects でのコンポジット・調整 → Unity での ParticleSystem 及び Shader 作成」を約1日で行っています。 163
  • 165. ⒸKLab inc. Splash : Breakdown ● Overview ○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。 165
  • 166. ⒸKLab inc. Splash : Breakdown ● Work in Houdini ○ プリレンダーで使用するような弾ける水の素材を数パターンほどシミュレーションします。 166
  • 167. ⒸKLab inc. Splash : Breakdown ● Work in Houdini ○ リング素材も簡単な白い円でも良かったのですが、せっかくなのでシミュレーションついでに少し 凝ったものを作成しました。 167
  • 168. ⒸKLab inc. Splash : Breakdown ● Lighting in Houdini ○ ライトはドームライト 1灯です。 ○ 透明な流体のビジュアル構築及びアーティファクト低減のために、 Dome Map はシンプルな見た目 のテクスチャを使用しています。 168
  • 169. ⒸKLab inc. Splash : Breakdown ● Rendering in Houdini ○ レンダリングは Redshift で行っています。 ○ Mantra の場合、水のようなオブジェクトを今回位のクオリティでレンダリングするのに 1コマ数分か かりますが、 Redshift だと1コマ数秒で終わるので、タイトなスケジュールでは重宝します。 169
  • 170. ⒸKLab inc. Splash : Breakdown ● Rendering Tips in Houdini ○ Mantra も設定次第では添付 Gif のようにレンダリング時間を短縮することができます。 ○ クオリティラインとコンポでのフォロー具合を勘案することで、 Mantra でも充分実用的な速度でレン ダリングする事が可能です。 170
  • 171. ⒸKLab inc. Splash : Breakdown ● Composite in AfterEffects ○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし てレンダリングします。 171
  • 172. ⒸKLab inc. Splash : Breakdown ● Composite in AfterEffects ○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし てレンダリングします。 172
  • 173. ⒸKLab inc. Splash : Breakdown ● Composite in AfterEffects ○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし てレンダリングします。 173
  • 174. ⒸKLab inc. Splash : Breakdown ● Composite in AfterEffects ○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし てレンダリングします。 174
  • 175. ⒸKLab inc. Splash : Breakdown ● Composite in AfterEffects ○ AfterEffects 上で、尺や動き・見た目を調整し、ゲームエンジンで使いやすいようにオプティマイズし てレンダリングします。 175
  • 176. ⒸKLab inc. Splash : Breakdown ● Work in Unity ○ Particle System や Shader の仕込みを行い、キャラクターと合わせてスケール感や抽象度を調整 します。 176
  • 177. ⒸKLab inc. Splash : Breakdown ● Work in Unity ○ Particle System や Shader の仕込みを行い、キャラクターと合わせてスケール感や抽象度を調整 します。 177
  • 178. ⒸKLab inc. Splash : Breakdown ● Work in Unity ○ 飛び散る水飛沫はテクスチャシートベースで作りましたが、拡散するリングは広がっていく速度を微 調整したかったので、 Flowmap で静止画テクスチャが広がっていくようにアセットを作りました。 178
  • 179. ⒸKLab inc. Splash : Breakdown ● How to create a Flowmap ○ Flowmap は流体シミュレーションのついでに Houdini で作成しています。 ○ 今回使用しているような Flowmap の作り方は、前述した 『Unity道場Houdini編:UnityとHoudiniで 作るRealtimeVFX実践解説』で解説しています。 ○ 資料・動画共に一般公開されているので気になる方は併せてご覧ください。 179
  • 180. ⒸKLab inc. Splash : Breakdown ● この項目の説明は以上となります。 180
  • 182. ⒸKLab inc. PV ● 概要 ○ これも厳密には検証内容ではないのですが、社内外への展開のために作成いたしました。 ○ 『 Unity からの連番書き出し』 →『 Houdini でのエフェクト作成』 →『 AfterEffects での素材作成やコ ンポジット・編集』を合わせて三日位で行っています。 182
  • 183. ⒸKLab inc. PV : Breakdown 183
  • 184. ⒸKLab inc. PV : Breakdown ● Overview ○ 大まかな内容をまとめた動画です。詳細解説は次スライド以降で行って参ります。 184
  • 185. ⒸKLab inc. PV : Breakdown ● 編集 ○ AfterEffects でコンポジットから編集まで地続きで行います。 ○ この手の映像仕事を生業にしている方からすれば自明なことではございますが、これ位の尺の映 像の場合は編集ソフトを介さずに、 AfterEffects で編集までしてしまうことは珍しくありません。 185
  • 186. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:素材&アニメーション作成 ○ ロゴ素材のパスデータを Element3D で3Dオブジェクト化してアニメーションさせています。 186
  • 187. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:素材&アニメーション作成 ○ ロゴ素材のパスデータを Element3D で3Dオブジェクト化してアニメーションさせています。 187
  • 188. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:イメージ背景素材作成 ○ イメージ背景のベース素材は Unityで作成しています。 188
  • 189. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:イメージ背景素材作成 ○ この手のボリュームフォグやライトを用いたグラデーション映像をプリレンダーで作成しようとする と、綺麗なビジュアルを作るのも大変ですしレンダリングにも時間がかかります。 ○ ゲームエンジンだとこの手のビジュアルは比較的作りやすく、レンダリングも瞬時に終わるので、個 人的にはこういったイメージ素材は最近はゲームエンジンで作る事が多いです。 189
  • 190. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:ショックウェーブ素材作成 ○ 画像素材を Houdini に読み込み、ショックウェーブエフェクトを作成します。 190
  • 191. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:ショックウェーブ素材作成 ○ 画像素材を Houdini に読み込み、ショックウェーブエフェクトを作成します。 191
  • 192. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:ショックウェーブ素材作成 ○ 画像素材を Houdini に読み込み、ショックウェーブエフェクトを作成します。 192
  • 193. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:ショックウェーブ素材作成 ○ 画像素材を Houdini に読み込み、ショックウェーブエフェクトを作成します。 193
  • 194. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:ショックウェーブ素材作成 ○ ショックウェーブ自体は『グレースケールで読み込んだ画像素材の Cd を基準に煙のエミッターとな るパーティクルを作成』 →『拡散する Velocity をエミッターに付与して煙をシミュレーション』 →『煙の Velocity を基にショックウェーブで使用する大量のパーティクルを作成』というワークフローで作成し ています。 ○ このような『煙の Velocity を基に大量のパーティクルを放出してショックウェーブを作成』というのは よくあるショックウェーブ作成手法です。 ○ グレースケールの画像素材をベースにし、更に Cd を基準にエミッターを作成しているので、画像素 材やエミッター形状にしたい素材を差し替えるだけでバリエーションが作れるプロシージャルアセッ トになっています。 194
  • 195. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:コンポジット ○ Houdini から出力したショックウェーブ素材等を使用してコンポジットしていきます。 195
  • 196. ⒸKLab inc. PV : Breakdown ● RRRのロゴ:コンポジット ○ Houdini から出力したショックウェーブ素材等を重ねてコンポジットしていきます。 196
  • 197. ⒸKLab inc. PV : Breakdown ● 60fpsのカメラシェイクの注意点 ○ テックデモ自体が60fpsなので、PVも60fpsで作成しています。 ○ しかし、60fpsの映像に24fpsや30fpsの感覚でカメラシェイクを付けると、『ヌルヌルする』『ゲームっ ぽい』或いは逆に『早すぎる』といった印象になりやすいです。 197
  • 198. ⒸKLab inc. PV : Breakdown ● 60fpsのカメラシェイクの注意点 ○ 対処法として、『カメラシェイクを多層的に入れる』『レンズディストーションを極端に短尺で入れる』 『レンズフレアの横線を大きめに作り、カメラシェイクを強調する』等のテクニックを織り交ぜる事で、 『ヌルヌルする』等の映像的な違和感を取り除くことができます。当 PVではこれらのテクニックを駆 使して映像的な違和感を低減させています。 198
  • 199. ⒸKLab inc. PV : Breakdown ● 各種テキスト素材作成 ○ ロゴと同様に Element3D で3Dオブジェクト化してアニメーションを付け、 Houdini でショックウェー ブエフェクトを作成し、 AfterEffects でコンポジットしています。 199
  • 200. ⒸKLab inc. PV : Breakdown ● 各種テキスト素材作成 ○ ロゴと同様に Element3D で3Dオブジェクト化してアニメーションを付け、 Houdini でショックウェー ブエフェクトを作成し、 AfterEffects でコンポジットしています。 200
  • 201. ⒸKLab inc. PV : Breakdown ● 各種テキスト素材作成 ○ ロゴと同様に Element3D で3Dオブジェクト化してアニメーションを付け、 Houdini でショックウェー ブエフェクトを作成し、 AfterEffects でコンポジットしています。 201
  • 202. ⒸKLab inc. PV : Breakdown ● 各種テキスト素材作成 ○ ロゴと同様に Element3D で3Dオブジェクト化してアニメーションを付け、 Houdini でショックウェー ブエフェクトを作成し、 AfterEffects でコンポジットしています。 202
  • 203. ⒸKLab inc. PV : Breakdown ● イラストカットの雰囲気作り ○ Cutscene 用に作成した画像に、更にパーティクルや煙の素材を追加して空気感を演出し、シネマ ティックに色味を調整してブラッシュアップを行いました。 203
  • 204. ⒸKLab inc. PV : Breakdown ● OKURIGAMIのロゴ ○ ロゴや各種テキストと同様に、 Houdini でショックウェーブ素材を作成し、 AfterEffects でコンポジッ トしています。 204
  • 205. ⒸKLab inc. PV : Breakdown ● OKURIGAMIのロゴ ○ ショックウェーブの出現に合わせてロゴ素材を上手く拡散させてフェードさせる事で、気持ちの良い 消え方を演出しています。 205
  • 206. ⒸKLab inc. PV : Breakdown ● OKURIGAMIのロゴ ○ ショックウェーブの出現に合わせてロゴ素材を上手く拡散させてフェードさせる事で、気持ちの良い 消え方を演出しています。 206
  • 207. ⒸKLab inc. PV : Breakdown ● この項目の説明は以上となります。 207
  • 209. ⒸKLab inc. Appendix ● 1時間枠という事で、他にも紹介できそうな内容がいくつかございました。 ● 折角なのでどういった候補があったかをそれぞれ簡単にご紹介致します。 209
  • 210. ⒸKLab inc. Appendix ● 講演内容候補 ○ Character Creator 3 紹介 ○ Mantra Rendering Tips ○ HoudiniとAfterEffectsで作るNPRエフェクト:2021年秋 ○ リモートワークでの育児・仕事両立のワーキングペアレント小話 210
  • 211. ⒸKLab inc. Appendix ● Character Creator 3 紹介 ○ 「名前は知っているし興味もあるけど使ったことはない」という方も多いと思うので、 Character Creator 3 の簡単な紹介を登壇内容の候補の一つとして考えていました。 211
  • 212. ⒸKLab inc. Appendix ● Character Creator 3 紹介 ○ 端的に紹介すると、 Character Creator 3 を使用すると、こういったキャラ素体として使えるモデル が1時間足らずでサクッと作成できます。 212
  • 213. ⒸKLab inc. Appendix ● Character Creator 3 紹介 ○ HEADSHOT というプラグインを使用する事で、顔写真 1枚から添付資料のようなデジタルヒューマ ンの頭部を作成することもできます。 ○ 添付動画のように、低解像度・逆光・髪で片目が隠れているような写真からでも、結構しっかりと特 徴を拾って頭部を生成してくれます。 213
  • 214. ⒸKLab inc. Appendix ● Character Creator 3 紹介 ○ 元々外部ツールとの連携を意識したツールなので、 DCCツールやゲームエンジンへのエクスポート も比較的しやすいです。 214
  • 215. ⒸKLab inc. Appendix ● Character Creator 3 紹介 ○ 添付動画は試しに Unity 上で動かしてみたものです。 ○ Character Creator 3 で作成したモデルは比較的容易に Unity 上で動かすことができます。 215
  • 216. ⒸKLab inc. Appendix ● Mantra Rendering Tips ○ Houdini のレンダリングは初心者にはとっつき辛い部分があるので、 Mantra を使用して添付画像 のようなものをレンダリングし、コンポジットするテクニックの紹介も候補の一つでした。 216
  • 217. ⒸKLab inc. Appendix ● Mantra Rendering Tips ○ 重いレンダリングをそのまま回すと、添付画像のようなレンダリング時間になってしまったりするの で、オプティマイズや時間をかけるべき箇所の見極め方等々も、講演内容の候補でした。 217
  • 218. ⒸKLab inc. Appendix ● HoudiniとAfterEffectsで作るNPRエフェクト・2021年秋 ○ 今年の2月に『Houdiniで作るNPRエフェクト&After Effectsでのコンポジット実践解説オンラインセミ ナー』という題でNPRエフェクト講座を行いましたが、最近また添付 Gif のようなNPRエフェクトを趣 味で作っているので、その内容も講演候補でした。 218
  • 219. ⒸKLab inc. Appendix ● リモートワークでの育児・仕事両立のワーキングペアレント小話 ○ 今年の CEDEC でも上記の内容のセッションが複数あり、世界情勢と合わせてこの話題は業界的 に一つのトレンドだと思われます。 ○ 私自身、長男が生まれてすぐに COVID-19 が流行り出し、そのまま仕事がリモートワーク主体にな り、仕事と育児を両立しつつ今に至ります。 ○ そのためこの話題に関しての知見や苦労話は色々と蓄積されているので、登壇内容の候補として 考えていました。 219
  • 220. ⒸKLab inc. Appendix ● この項目の内容は以上となります。 ● 機会がございましたらこれらの内容もどこかでお話しできればと思います。 220