実戦投入事例! Niagaraで地球の風をビジュアライズ!

スライド概要

2020年9月12日に行われた「出張ヒストリア! ゲーム開発勉強会2020」にて発表させていただいたスライドです。

イベント詳細
https://historia.co.jp/archives/16322/

講演動画
https://youtu.be/674Gf3GuV00

講演者:
橘内 正貴(株式会社ヒストリア ヒストリア・エンタープライズチーム エンジニア)

講演内容:
UE4.25にて正式リリースされ、実戦投入が可能になったNiagaraVFXSystem。
ヒストリア・エンタープライズでは早速! 風や海流、波といった地球環境のビジュアライズツールをNiagara用いて製品開発を行い、今夏に放送された番組にて採用されました。
本講演では風のビジュアライズに焦点をあてて、外部データ(計測データ)を元にNiagaraでビジュアライズを行うアップローチ方法や、
Niagaraのモジュールを新たに作成し既存モジュールの不足部分を埋めた実例、その他NiagaraのTipsなど赤裸々にお話します。

profile-image

株式会社ヒストリア

@historia_Inc

作者について:

株式会社ヒストリアは、Unreal Engine専門のソフトウェア開発会社です。ゲーム事業とエンタープライズ事業、2 つの軸でソフトウェアの企画、開発を行っています。また、Unreal Engine の学習を目的とした作品制作コンテスト『UE4ぷちコン』や、『出張ヒストリア! ゲーム開発勉強会』を主催、技術ブログを毎週更新など、Unreal Engine コミュニティを盛り上げる活動も行っております。

スライド一覧
シェア
埋め込む»CMSなどでJSが使えない場合

公開日

2020-09-25 00:52:00

各ページのテキスト

1. 実戦投入事例! Niagaraで地球の風をビジュアライズ! 2020/09/12 ヒストリア・エンタープライズエンジニア 橘内 正貴 historia Inc.

2. 自己紹介 • 2019/6からヒストリア・エンタープライズにJoin 現在の肩書はエンタープライズエンジニア • ue4歴は約3年(historia以前は趣味レベル) こんなものを作ったりしてました https://www.youtube.com/watch?v=hU1vRI4E6sc historia Inc. ちなみに前職は銭湯で受付のアルバイトをしていました

3. コンテンツ紹介 Youtube:https://youtu.be/QoC4FEGD7fQ historia Inc.

4. まえおき 開発Ver:UE4.25.1 講演内容は最適解ではない部分も多々あるか と思います。参考程度に! C++やBP関連の実装に関しては割愛します historia Inc.

5. ビジュアライズってどうやったの? • Webで公開されている気象データ UE4外 「GRIB2(圧縮バイナリ)」のダウンロード • →専門の外部ツールでCSV化 • UE4C++でCSVをテキスト読み込みし、数値配列にパース UE4C++ &BP Niagara historia Inc. • →数値配列をテクスチャに変換 • →テクスチャをナイアガラへ渡す • テクスチャの色情報を使ってパーティクルの動き・色を制御

6. ビジュアライズってどうやったの? -データ(GRIB2)解説 • 風のデータは緯度経度0.25度 のグリッドでサンプリング • 緯度方向と経度方向のベクト ル量が格納されている historia Inc.

7. • Q:なんでテクスチャ化? • A:ナイアガラは配列を直接扱えないから 経度180° 緯度 +90° 経度0° 経度 +180° U0 V0 緯度 0° 緯度-90° historia Inc. V1 U1

8. historia Inc.

9. Niagaraはなにをやってるの? -モジュール構成 historia Inc.

10. Niagaraはなにをやってるの? -モジュール構成 • 1、StaticMeshLocationで地 球表面にパーティクルをス ポーン • 2、VortexVelocityで地球表面 に沿ってパーティクルを移動 • 3、Colorで透過や色付け historia Inc.

11. Niagaraはなにをやってるの? -VortexVelocityの仕事 • Velocity Amount →風速を計算してパーティクルの速度に変換 • VortexAxis →風のベクトルを3次元の回転に変換 historia Inc.

12. パーティクルとテクスチャの関係 Wikipediaより引用 XYZ→lat,lon≒UV 緯度 +90° 経度180° 経度0° 経度 +180° U0 V0 緯度 0° 緯度90° historia Inc. V1 U1

13. どうやってるの?(VertexVelocityでパーティクルを動かす) • 慣性をつけるための改造 historia Inc.

14. どうやってるの? -補助的に使っているモジュール • Facingで地球の表面にきちんと沿わせる • ScaleSpriteSizeBySpeedで速度差による表示ムラを軽減 historia Inc.

15. どうやってるの? -Rendere設定 • AlignmentをVelocityに設定、移動方向を向かせる • FacingをCustomに設定、前述のモジュールと連携する historia Inc.

16. どうやってるの? -色回り • ColorCurveを入力に使用、ベクトルの強さで色分け • 透過はベクトルの強さとLifeTimeでフェード処理 historia Inc.

17. どうやってるの?(BluePrintとナイアガラの連携Tips) • BPでテクスチャはナイアガラに受け渡し • ReinitializeSystemノードを更新したいタイミングで呼ぶ historia Inc.

18. ここがよかったよナイアガラ 風の表現の為にとにかく物量が欲しい →GPUパーティクルでバンバンだせる! モジュールが自作できる →思い通りのロジックでパーティクルが動く! シーケンサーで変数を動的に変更可能 →表現を詰めるイテレーションが早い! historia Inc.

19. Niagara 罠Tips 1 • (おそらくGPUパーティクル限定) パーティクルの後ろのオブジェクトが動くと、変なブ ラーが発生する historia Inc.

20. Niagara 罠Tips 1 Youtube:https://youtu.be/1YdmBTW5DvA historia Inc.

21. Niagara 罠Tips 1 • カメラ側が動く分には影響がなかった • →カメラを動かすことで一応対策可能 • (この現象を確認した時点で既に地球をガンガン回してシーケンサが作られていたので全て 作り直しに……その節は大変ご迷惑をおかけしました) historia Inc.

22. Niagara 罠Tips 2 • GPUパーティクルだとRibbonRendereが使えない • 風が尾を引く表現をしたかったが、どうしても直せず。 • 形状や動き、密度で風感を表現する方向にシフトした historia Inc.

23. Niagara 罠Tips 3 • StaticMeshLocationのカリングが効かない問題 historia Inc.

24. カリング範囲:0.5 スポーンレート:50,000,000 Youtube:https://youtu.be/RfZjx1f2y7w historia Inc.

25. Niagara 罠Tips 3 • StaticMeshLocationのカリングが効かない問題 • → WorldAxisConstraintでパーティクルを多く出せるよ うに制御しているはずなのに動画出力とするとなぜか 減ってしまう historia Inc.

26. Niagara 罠Tips 3 スポーンした後に減らしてる!? historia Inc.

27. Niagara 罠Tips 3 • 負荷回避のためのStaticMeshLocation改造 historia Inc.

28. カリング範囲:0.5 スポーンレート:120,000 Youtube:https://youtu.be/UZqEqrRRFjE historia Inc.

29. 実務的な豆知識:動画書き出しの自動化 • 今回は出力するカット数が多かったので、コマンドライ ンでシーケンサー書き出しを自動化するbatをつくった • 参考 https://docs.unrealengine.com/ja/Engine/Sequence r/Workflow/RenderAndExport/RenderingCmdLine/in dex.html historia Inc.

30. 実務的な豆知識:動画書き出しの自動化の罠 • 解像度をコマンド( -ResX=####・-ResY=#### )で設定で きるはずなのですが、設定してもなぜかディスプレイ解 像度にひっぱられます • UE4上のシーケンサー書き出しなら設定解像度で出力 • 恐らくフルスクリーン表示が原因っぽいですが、納期が それどころじゃなかったのでエンジニア的解決は行えず historia Inc.

31. まとめ • Niagara×データビジュアライズ、結構いける! • データをナイアガラに渡すパイプラインさえ作ればその あとの表現部分を詰めるイテレーションもかなり早い! • 嵌ろう!モジュール自作沼! historia Inc.

32. 巻末付録 プロジェクトの参考にしたサイト historia Inc.

33. CSVのテクスチャ化の際に参考にしたサイト(C++サンプル) • UE4/C++: メッシュのマテリアルやテクスチャーを C++コードで制御する方法 https://usagi.hatenablog.jp/entry/2017/07/26/115603 • Generating Procedural Textures https://www.orfeasel.com/generating-procedural-textures/ historia Inc.

34. ナイアガラを勉強するのに参考にしたサイト • Niagaraの入門 https://crabpunch.hatenablog.com/archive/categor y/Niagara • 新しいエフェクトツール、Niagaraを楽しもう! ~ Niagara作例のブレイクダウン~ https://www.slideshare.net/EpicGamesJapan/ue4fe steast2018-niagara historia Inc.