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を使って 軽率にAudio Visualizerを作る
Search
にー兄さん
May 13, 2022
Technology
0
1.3k
VFX Graphを使って 軽率にAudio Visualizerを作る
yokohama.unity #10でLT登壇した資料です
にー兄さん
May 13, 2022
Tweet
Share
More Decks by にー兄さん
See All by にー兄さん
Jetpack XR SDKから紐解くAndroid XR開発と技術選定のヒント / about-androidxr-and-jetpack-xr-sdk
drumath2237
1
240
XRエンジニアの視点から XRのイマと社会実装の実現について考える / thinking-about-xr-popularization
drumath2237
0
38
軽率にプログラミング言語のシンタックスについて考えてみよう / lets-think-about-programming-lang-syntax
drumath2237
0
81
エンジニアが軽率に趣味から始める、OSS貢献を軸とした個人活動 / oss-contribution-as-a-hoby-project
drumath2237
0
51
Babylon.js 8.0のアプデ情報を 軽率にキャッチアップ / catch-up-babylonjs-8
drumath2237
0
300
フォークギター with VFXの 制作を軽率に振り返ろう! / look back fork guitar with vfx
drumath2237
0
66
軽率に始まった Babylon.js勉強会運営の 1年間をふりかえって / look back babylonjs japan activity
drumath2237
0
100
利己的利他、 あるいは軽率2.0に備えよ。 / prepare-for-keisotsu-2.0
drumath2237
0
73
軽率にAndroidXRのJetpack SceneCoreを使って3Dモデルを表示してみる / androidxr-scenecore-3dmodels
drumath2237
0
200
Other Decks in Technology
See All in Technology
コールドスタンバイ構成でCDは可能か
hiramax
0
130
松尾研LLM講座2025 応用編Day3「軽量化」 講義資料
aratako
15
4.9k
re:Invent2025 セッションレポ ~Spec-driven development with Kiro~
nrinetcom
PRO
2
170
研究開発部メンバーの働き⽅ / Sansan R&D Profile
sansan33
PRO
4
21k
AI with TiDD
shiraji
1
340
小さく、早く、可能性を多産する。生成AIプロジェクト / prAIrie-dog
visional_engineering_and_design
0
330
業務の煩悩を祓うAI活用術108選 / AI 108 Usages
smartbank
9
19k
会社紹介資料 / Sansan Company Profile
sansan33
PRO
11
390k
AWS re:Invent2025最新動向まとめ(NRIグループre:Cap 2025)
gamogamo
0
150
自己管理型チームと個人のセルフマネジメント 〜モチベーション編〜
kakehashi
PRO
5
2k
AWS re:Invent 2025 を振り返る
kazzpapa3
2
110
純粋なイミュータブルモデルを設計してからイベントソーシングと組み合わせるDeciderの実践方法の紹介 /Introducing Decider Pattern with Event Sourcing
tomohisa
1
620
Featured
See All Featured
BBQ
matthewcrist
89
9.9k
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.7k
A designer walks into a library…
pauljervisheath
210
24k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
inesmontani
PRO
0
120
Leo the Paperboy
mayatellez
1
1.3k
Darren the Foodie - Storyboard
khoart
PRO
1
2.1k
Marketing to machines
jonoalderson
1
4.5k
How Fast Is Fast Enough? [PerfNow 2025]
tammyeverts
3
420
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
330
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
akihiro_kokubo
PRO
65
35k
Public Speaking Without Barfing On Your Shoes - THAT 2023
reverentgeek
1
280
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
1.8k
Transcript
VFX Graphを使って 軽率にAudio Visualizerを作る にー兄さん(@ninisan_drumath) yokohama.unity#10
にー兄さん(@ninisan_drumath) - 筑波大学 情報科学類(coins18) - HoloLab inc.アルバイト - Microsoft Learn
Student Ambassadors - Iwaken Lab. 趣味はUnity、ギター、コーヒー、VTuberオタ活 愛猫→
agenda VFX Graphについて Audio Visualizerを作る おわりに
VFX Graphについて
VFX Graphとは GPUパーティクルシステム URP・HDRP上で動作する ノードベースでシステムを定義する
Property Binder 外部データをVFXGraphのプロパティに値をバインドする 例) Property Binder VFX Graph radius:float center:Vec3
position:Vec3
Audio Visualizerを作る
Audio Spectrum to AttributeMap ビルトインなProperty Binderの一種 音声データのスペクトラムを テクスチャ(AttributeMap)に変換する サンプル数とテクスチャをバインド
Audio Spectrum to AttributeMap サンプル数x1のテクスチャを生成 各ピクセルに周波数の値が書き込まれている TextureFormatはR32Floatらしい
AttributeMapのサンプリング Sample Attribute Mapノードを用いてサンプリング サンプル数とAudio Spectrumが書き込まれているテクスチャを渡す テクスチャのフォーマットに合わせてfloatで出力する
DEMO!
おわりに
まとめ - VFX Graphを使えばノーコードでAudio Visualizerが作れる - Audio Spectrumは音声をスペクトラムをAttributeMapに変換して バインドする
クレジット・参考文献 使用楽曲 Space Town (Brand New Mix) / Khaim https://dova-s.jp/bgm/play4000.html
VFX GraphビルトインのPropertyBinder https://docs.unity3d.com/ja/Packages/
[email protected]
/manual/PropertyBinders.h tml#%E3%83%93%E3%83%AB%E3%83%88%E3%82%A4%E3%83%B3-property-binder