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
640
軽率にVFX Graphと Compute Shaderを 組み合わせるテクニック/integrate-vfxgraph-and-compute-shader
VFX Graph LT会にてLT登壇した資料です
にー兄さん
April 20, 2024
Tweet
Share
More Decks by にー兄さん
See All by にー兄さん
XRエンジニアの視点から XRのイマと社会実装の実現について考える / thinking-about-xr-popularization
drumath2237
0
26
軽率にプログラミング言語のシンタックスについて考えてみよう / lets-think-about-programming-lang-syntax
drumath2237
0
72
エンジニアが軽率に趣味から始める、OSS貢献を軸とした個人活動 / oss-contribution-as-a-hoby-project
drumath2237
0
42
Babylon.js 8.0のアプデ情報を 軽率にキャッチアップ / catch-up-babylonjs-8
drumath2237
0
250
フォークギター with VFXの 制作を軽率に振り返ろう! / look back fork guitar with vfx
drumath2237
0
54
軽率に始まった Babylon.js勉強会運営の 1年間をふりかえって / look back babylonjs japan activity
drumath2237
0
88
利己的利他、 あるいは軽率2.0に備えよ。 / prepare-for-keisotsu-2.0
drumath2237
0
66
軽率にAndroidXRのJetpack SceneCoreを使って3Dモデルを表示してみる / androidxr-scenecore-3dmodels
drumath2237
0
150
あなたの知らないWebXR Device APIの話を軽率に / about-webxr-device-api-you-dont-know
drumath2237
0
94
Other Decks in Programming
See All in Programming
Phronetic Team with AI - Agile Japan 2025 closing
hiranabe
2
670
AIと協働し、イベントソーシングとアクターモデルで作る後悔しないアーキテクチャ Regret-Free Architecture with AI, Event Sourcing, and Actors
tomohisa
2
8k
GraalVM Native Image トラブルシューティング機能の最新状況(2025年版)
ntt_dsol_java
0
160
Rails Girls Sapporo 2ndの裏側―準備の日々から見えた、私が得たもの / SAPPORO ENGINEER BASE #11
lemonade_37
2
190
Private APIの呼び出し方
kishikawakatsumi
3
900
競馬で学ぶ機械学習の基本と実践 / Machine Learning with Horse Racing
shoheimitani
14
13k
「文字列→日付」の落とし穴 〜Ruby Date.parseの意外な挙動〜
sg4k0
0
230
AI時代もSEOを頑張っている話
shirahama_x
0
160
[SF Ruby Conf 2025] Rails X
palkan
0
340
最新のDirectX12で使えるレイトレ周りの機能追加について
projectasura
0
300
AIエージェントでのJava開発がはかどるMCPをAIを使って開発してみた / java mcp for jjug
kishida
4
760
AWS CDKの推しポイントN選
akihisaikeda
1
120
Featured
See All Featured
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
3
340
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
The Pragmatic Product Professional
lauravandoore
36
7k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
61k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
Done Done
chrislema
186
16k
Rails Girls Zürich Keynote
gr2m
95
14k
Embracing the Ebb and Flow
colly
88
4.9k
GraphQLとの向き合い方2022年版
quramy
49
14k
Into the Great Unknown - MozCon
thekraken
40
2.2k
Being A Developer After 40
akosma
91
590k
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