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
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
にー兄さん
April 20, 2024
Programming
720
1
Share
軽率にVFX Graphと Compute Shaderを 組み合わせるテクニック/integrate-vfxgraph-and-compute-shader
VFX Graph LT会にてLT登壇した資料です
にー兄さん
April 20, 2024
More Decks by にー兄さん
See All by にー兄さん
『Ground Truth: How We Create Geometrically Accurate Reconstructions (Niantic Spatial Blog)』 を読む / read Ground Truth: How We Create Geometrically Accurate Reconstructions
drumath2237
0
45
この時代にOSS開発に向き合ってみる / face the oss development in this era
drumath2237
0
38
プログラマの職能が代替可能になりつつあるこの時代でプログラムと向き合う修行を積む / dedicating myself to the discipline of programming
drumath2237
0
90
個人的3D Gaussian Splattingニュースをご紹介 / sharing 3d gaussian splatting news
drumath2237
0
540
Jetpack XR SDKから紐解くAndroid XR開発と技術選定のヒント / about-androidxr-and-jetpack-xr-sdk
drumath2237
1
640
XRエンジニアの視点から XRのイマと社会実装の実現について考える / thinking-about-xr-popularization
drumath2237
0
81
軽率にプログラミング言語のシンタックスについて考えてみよう / lets-think-about-programming-lang-syntax
drumath2237
0
110
エンジニアが軽率に趣味から始める、OSS貢献を軸とした個人活動 / oss-contribution-as-a-hoby-project
drumath2237
0
88
Babylon.js 8.0のアプデ情報を 軽率にキャッチアップ / catch-up-babylonjs-8
drumath2237
0
430
Other Decks in Programming
See All in Programming
権限チェックの一貫性を型で守る TypeScript による多層防御
mnch
4
1.1k
軽量Java基盤の設計 DIコンテナに頼らない、長期保守と1秒起動の実現 JJUG CCC 2026 Spring
macha64
0
410
jQueryをバージョンアップする前に使いたいjQuery Migrate
matsuo_atsushi
0
160
ユニットテストの先へ:テスト技法で要求・仕様を整理するJava開発実践 / Beyond_Unit_Testing_Practical_Java_Development_Techniques_for_Organizing_Requirements_and_Specifications
shimashima35
0
340
Spec Driven Development | AI Summit Lisbon
danielsogl
PRO
0
120
Spec-Driven Development with AI-Agents: From High-Level Requirements to Working Software
antonarhipov
2
440
ReactとSvelteのその先、Ripple-TS / Beyond React and Svelte: Ripple-TS
ssssota
3
2k
AI駆動開発で崩れていくコードベースを立て直す
kyoko_nr_nr
1
420
ADKを使って簡単にAIエージェントを作ってみよう
k1mu21
0
140
TypeSpec で繋ぐ複数プロダクトの型安全
maroon8021
1
320
JJUG CCC 2026 Spring: JSpecify で実現する Kotlin フレンドリーな Java API 設計
ternbusty
1
130
[2026年度第1回ORセミナー] 計画最適化ベンチャーと競技プログラミング人材
terryu16
0
230
Featured
See All Featured
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
1
330
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
49
3.5k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
570
The SEO identity crisis: Don't let AI make you average
varn
0
480
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
430
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
11k
Navigating Team Friction
lara
192
16k
The Curse of the Amulet
leimatthew05
1
13k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
200
How to Grow Your eCommerce with AI & Automation
katarinadahlin
PRO
1
200
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
118
120k
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