Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
軽率にVFX Graphと Compute Shaderを 組み合わせるテクニック/integ...
Search
にー兄さん
April 20, 2024
Programming
1
210
軽率にVFX Graphと Compute Shaderを 組み合わせるテクニック/integrate-vfxgraph-and-compute-shader
VFX Graph LT会にてLT登壇した資料です
にー兄さん
April 20, 2024
Tweet
Share
More Decks by にー兄さん
See All by にー兄さん
UnJSを使って軽率にCLIを作ってみたらめちゃくちゃ便利だった / create CLI with UnJS
drumath2237
4
1.2k
create-babylon-appを軽率にアプデしたい / update create babylon app
drumath2237
1
1.3k
Babylon.js 7注目機能を 軽率にまとめてみる/whats-new-in-babylonjs-v7
drumath2237
1
170
軽率にVue 3で リアルタイム3Dアプリを作れる ライブラリを作ってみた/vue-with-3d-app
drumath2237
3
1.8k
軽率にBabylon.jsを C#で使う技術 / using-babylonjs-with-csharp
drumath2237
1
630
今こそ軽率に理解したい WebXR Device APIとBabylon.jsの話 / understand-webxr-device-api-and-babylonjs
drumath2237
0
110
Vue・Babylon連携ライブラリ BabyuewJSについて / about-babyuewjs
drumath2237
0
140
軽率にBabylon.jsの WebGPUエンジンを使って ComputeShaderに入門した / learn-about-babylonjs-webgpu-computeshader
drumath2237
0
590
Snapdragon Spacesを通して Unity XRプラグインフレームワーク について軽率に学ぶ / about snapdragon spaces sdk and unity xr framework
drumath2237
0
700
Other Decks in Programming
See All in Programming
CSC509 Lecture 03
javiergs
PRO
0
140
学生の時に開催したPerl入学式をきっかけにエンジニアが組織に馴染むために勉強会を主催や仲間と参加して職能間の境界を越えていく
ohmori_yusuke
1
130
2024-10-01 dev2next - Observability for Modern JVM Applications
jonatan_ivanov
0
100
MLOps in Mercari Group’s Trust and Safety ML Team
cjhj
1
110
NANIMACHI
naokiito
0
940
Cloud Adoption Frameworkにみる組織とクラウド導入戦略(縮小版)
tomokusaba
1
180
Infrastructure as Code でセキュリティを楽にしよう!
konokenj
6
1.4k
.NET Aspireのクラウド対応検証: Azureと他環境での実践
ymd65536
1
360
Applied NLP in the Age of Generative AI
inesmontani
PRO
3
1.2k
sqlcを利用してsqlに型付けを
kamiyam
0
240
Делим тесты между QA и разработчиком
mariyasaygina
0
520
個人開発で使ってるやつを紹介する回
yohfee
1
690
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
49
7.1k
Building Your Own Lightsaber
phodgson
102
6k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
167
48k
The Brand Is Dead. Long Live the Brand.
mthomps
53
38k
How GitHub Uses GitHub to Build GitHub
holman
473
290k
Documentation Writing (for coders)
carmenintech
65
4.3k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
29
1.7k
Large-scale JavaScript Application Architecture
addyosmani
509
110k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.3k
Into the Great Unknown - MozCon
thekraken
30
1.4k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
92
16k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
7
560
Transcript
軽率にVFX Graphと Compute Shaderを 組み合わせるテクニック にー兄さん(@ninisan_drumath) VFX Graph LT会
にー兄さん(@ninisan_drumath) 株式会社ホロラボ ソフトウェアエンジニア Iwaken Lab. / Babylon.js勉強会運営 お仕事ではUnityを使ったxR開発がメイン 趣味ではBabylon.jsをよく触る うちの猫たち→
本日の話 VFX GraphとComputeShaderを組み合わせることについて 何が嬉しいのか、どうやって実現するのかを紹介
最近こんなものを作りました ここで使用した、ComputeShaderとVFXGraphの連携についてご紹介
アジェンダ 1. CompuetShaderとVFXGraphを組み合わせるモチベーション 2. ComputeShaderとVFXGraphの連携方法 3. おわりに
CompuetShaderとVFXGraphを 組み合わせるモチベーション
VFX Graphで出来ることは多い VFXGraphには豊富なノードが用意されている SDFのサンプリングや Perlinノイズの生成、 Switchなどの制御もできる 最近はProbability Samplingノード 面白いなって思った
しかし限界がある ノードベースならではの悩み? VFX Graphでできないこと、苦手なこと - ループ処理 - 変数定義と格納 - バッファへの書き込み
Cutsom HLSLノードによって解決するものもあるが メンテナンス容易性などの考慮は必要 BoidsはForループによるバッファのサンプリングと書き込みが必要
一部のロジックを外部化して表現力を補う VFX Graphが苦手なロジックは他で補える
一部のロジックを外部化して表現力を補う Unityで属性計算するための選択肢はいくつかある - MonoBehaviour - Entity Component System - Compute
Shader 構成例) - C#で全てのパーティクル属性を毎フレーム計算 - VFXGraphはそれの可視化にのみ使用する
例)Boidsの場合 Boidsは他のBoidの情報を参照するものの計算順序に制約はない そのため個々のBoidの状態更新処理は並列化できる
Compute Shaderとは 汎用的な計算をGPUで行う GPGPUのための仕組み UnityではHLSL言語で記述 Kernelという単位で処理される KernelはThreadという単位でまとめて実行され、 スレッドはThread Groupという単位でまとめて実行される
ComputeShaderの使い道
ComputeShaderとVFXGraphの 連携方法
3つのシステムとデータフロー ComputeShaderとVFXGraph、 そしてそれをつなぐC# 計算結果を特定のデータ型として 橋渡しする必要がある
AttributeMap vs GraphicsBuffer VFX Graphへ連続的なデータを渡す方法は主に2種類 - AttributeMap - GraphicsBuffer AttributeMapの実態はテクスチャ Sample
AttributeMapノードがある pCacheはAttributeMap使うよね GraphicsBufferは配列ライクに扱えて手軽 2次元的なデータであればAttributeMapがいいかも
ComputeShaderの実行 Kernelの定義 #pragma kernel CSMain float num; RWStructuredBuffer<float3> buf; [numthreads(4,1,1)] void
CSMain(const uint3 id:SV_DispatchThreadID) { buf[id.x].x = num; buf[id.x].y = num; buf[id.x].z = num; } ほぼ普通の関数だが numthreadsでスレッド数を指定 #pragma kernelで関数名を指定
ComputeShaderの実行 Kernelの実行 1. Kernelを取得 2. パラメータを指定 3. スレッドグループの数を指定してDispath _csMainKernel = computeShader.FindKernel("CSMain");
computeShader.SetFloat("num", 1.0f); computeShader.SetBuffer(_csMainKernel, "buf", _graphicsBuffer); computeShader.GetKernelThreadGroupSizes(_csMainKernel, out var x, out _, out _); computeShader.Dispatch(_csMainKernel, count / (int)x, 1, 1);
VFX Graphへバッファを渡す パーティクルの属性データはGraphicsBufferとして保持 VFX GraphはGraphicsBufferの読み込みができる
tips: StructuredBufferをVFXGraphでサンプルする [VFXType(VFXTypeAttribute.Usage.GraphicsBuffer, "BoidsData")] public struct BoidsData { public Vector3
Position; public Vector3 Velocity; }
グラフはとても単純 外部にロジックを委託しているので グラフはすごいシンプル 色や形状を決定する部分は もっと作りこめるかも ここまでやると ComputeShaderの計算結果を VXFGraphに反映できた
おわりに
まとめ VFX Graphの表現力を拡張するために 属性計算ロジックを外部に委託するという選択肢がある GraphicsBufferを使ってComputeShaderの計算結果を VFXGraphへ渡すことができる
参考文献 今回のサンプルプロジェクト https://github.com/drumath2237/Boids-Unity-ComputeShader-Sandbox コンピュートシェーダー - Unityマニュアル https://docs.unity3d.com/ja/2023.2/Manual/class-ComputeShader.html ComputeShaderを触ってみる その1 ~スレッド編~
https://edom18.hateblo.jp/entry/2017/05/10/083421 GPUの力を解き放て!Unity Compute Shader入門! https://www.youtube.com/watch?v=yiPVxGO-Yg0 Class VFXTypeAttribute https://docs.unity3d.com/Packages/
[email protected]
/api/Unity Engine.VFX.VFXTypeAttribute.html