Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Upcoming SlideShare
What to Upload to SlideShare
What to Upload to SlideShare
Loading in …3
×
1 of 223

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

0

Share

Download to read offline

CGWORLD 2021 クリエイティブカンファレンス
TechDEMO“OKURIGAMI” : VFX Breakdown Houdini x Unity x AfterEffects

https://cgworld.jp/special/cgwcc2021/schedule/klab/

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

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

×