---
title: VFX Graphを活用したコスパ重視のグラフィック作り
tags: 
author: [nuskey](https://convert.docswell.com/user/nuskey)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/KJ4MY8MZE1.jpg?width=480
description: u1w共有回 #20の登壇資料です。
published: January 24, 26
canonical: https://convert.docswell.com/s/nuskey/KQX6W7-u1w-onemore
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/KJ4MY8MZE1.jpg)

VFX Graphを活用したコスパ重視の
グラフィック作り
&gt; unityroom/games/onemore_snake
2026/01/24 @YouTube
unity1week online共有会 #20
#u1w共有会
1


# Page. 2

![Page Image](https://bcdn.docswell.com/page/LE18628D7G.jpg)

- @annulusgamesまたは@nuskey8
- 最近は@nuskey8の方がメインかも
- 情報工学系の大学に通ってます
- 最近はRustで言語処理系を作ってます(Unity…?)
- 時々VJもやります
#u1w共有会
#
#
自己紹介
2


# Page. 3

![Page Image](https://bcdn.docswell.com/page/GEWZWRZ8E2.jpg)

- 『ONE MORE』
- 全方位STG + スネークゲーム
- VJやデモシーンっぽい雰囲気の
グラフィック
- 制作期間は3日ほど
#u1w共有会
#
#
作ったゲーム
3


# Page. 4

![Page Image](https://bcdn.docswell.com/page/47Z15R19J3.jpg)

- VFX Graphの紹介
- 基本的な使い方や、Particle Systemとの比較も
- ONE MOREにおけるVFX Graphの利用例
- 軽い紹介程度なので、難しい話はありません。気楽に聞いてね
#u1w共有会
#
#
このLTの内容
4


# Page. 5

![Page Image](https://bcdn.docswell.com/page/YJ6L9RLDEV.jpg)

# VFX Graphとは？
#u1w共有会
5


# Page. 6

![Page Image](https://bcdn.docswell.com/page/GJ51N81874.jpg)

- ノードベースでビジュアルエフェクトを作れるUnityの機能
- 高機能、高い拡張性、GPUを活用したハイパフォーマンスな描画、etc…
- 実質的にParticle Systemの上位互換 (衝突だけはちょっと難しい)
#u1w共有会
#
#
VFX Graphとは？
6


# Page. 7

![Page Image](https://bcdn.docswell.com/page/9E215K1VJR.jpg)

- WebGLでは非対応なため、長らくWebで
使えないことが欠点だった
- Unity6で正式にWebGPU対応が行われ
Webでも動かせるように
- WebGPUは一応experimentalなため
PlayerSettingsで明示的に有効化が必要
#u1w共有会
#
#
Web対応
7


# Page. 8

![Page Image](https://bcdn.docswell.com/page/D7YZKNZQJM.jpg)

# VFX Graphの使い方
#u1w共有会
8


# Page. 9

![Page Image](https://bcdn.docswell.com/page/VEN3RX32E8.jpg)

- Visual Effect Assetと
Visual Effectコンポーネントから成る
- Visual Effect Assetではノードベースで
パーティクルを構成
- Visual Effectコンポーネントをアタッチした
GameObjectにAssetを割り当てて使う
#u1w共有会
#
#
Visual Effect
9


# Page. 10

![Page Image](https://bcdn.docswell.com/page/Y799M89D73.jpg)

- 4つのContextノードが存在する
- その中にブロックを追加したり、ノードを
繋いだりすることでパーティクルを制御
- Spawn
- Initialize Particle
- Update Particle
- Output Particle
#u1w共有会
#
#
VFX Graphの基本
10


# Page. 11

![Page Image](https://bcdn.docswell.com/page/G789L895JD.jpg)

- 圧倒的な自由度
- ノードベースでほとんど何でもできる
- 複雑なイベント制御やプロパティの設定なども
- Shader Graphとの連携にも対応
- パフォーマンス
- Particle SystemはCPU上で動作するが、VFX GraphはGPU上で動作
- 大量にパーティクルを出しても軽い
- 衝突周りはParticle Systemの方が得意
(シーン上のオブジェクトとの衝突処理が難しい)
#u1w共有会
#
#
vs Particle System
11


# Page. 12

![Page Image](https://bcdn.docswell.com/page/L7LWLRW3ER.jpg)

# 利用例 (ONE MORE)
#u1w共有会
12


# Page. 13

![Page Image](https://bcdn.docswell.com/page/4EM9MR9M7W.jpg)

敵オブジェクト
背景のアニメーション
#u1w共有会
#
#
使ったところ
(映ってないけど)破壊時のエフェクト
13


# Page. 14

![Page Image](https://bcdn.docswell.com/page/PERGVRGL79.jpg)

- 敵のグラフィック
- 複数の球体が蠢いているような
見た目をパーティクルで表現
- ワイヤーフレーム部分は別の
シェーダーで描画している
#u1w共有会
#
#
使ったところ (1)
14


# Page. 15

![Page Image](https://bcdn.docswell.com/page/P7XXZRQ67X.jpg)

- 撃破時のエフェクト
- 瞬間的に白く光る部分と、赤色の
周囲に散るパーティクルに分かれる
- Particle Systemだと複数の
GameObjectが必要だが…
- VFX Graphならノードの
組み合わせのみで表現できる
- シーンに1つ存在するVisual Effectを
スクリプトから制御している
(GameObjectを都度生成しない)
#u1w共有会
#
#
使ったところ (2)
15


# Page. 16

![Page Image](https://bcdn.docswell.com/page/37KW8R9G7D.jpg)

- 背景のアニメーション
- 雑に四角いフレームのSpriteを
アニメーションさせるだけ
- 太さが一定にならないので
ちゃんとやるならシェーダーを書くべき…
- それっぽいもので良いならこれでも十分
#u1w共有会
#
#
使ったところ (3)
16


# Page. 17

![Page Image](https://bcdn.docswell.com/page/LJ3128W5E5.jpg)

- とっつきづらそうに見えて意外と手軽
- 一度理解すればParticle Systemよりもカジュアルに組める
- 再利用性の高さ
- プロパティを作成して、色違いやサイズ違いのエフェクトなども簡単に作れる
- Particle SystemだとPrefab Variantで実現できるが、それよりも直感的
- ノードのまとまりはSubGraphとして使いまわせる
- 複雑な計算などはSubGraphにまとめておくと見やすくて良い
- それっぽい絵が簡単に作れる！！
#u1w共有会
#
#
VFX Graphのいいところ
17


# Page. 18

![Page Image](https://bcdn.docswell.com/page/8JDXZMKY7G.jpg)

# まとめ
#u1w共有会
18


# Page. 19

![Page Image](https://bcdn.docswell.com/page/VEPPDRK2E8.jpg)

- VFX Graphならノードベースでなんでもできる！
- WebGPUでちゃんと動く
- WebGLのためにParticle Systemを使う必要なし！
- VFX Graphはいいぞ！！
#u1w共有会
#
#
まとめ
19


# Page. 20

![Page Image](https://bcdn.docswell.com/page/27V21RVX7Q.jpg)

# Thank you for listening!
#u1w共有会
20


