ヴィジュアルプログラマー必見。PopcornFxによる花火エフェクトの作成

2017年1月16日更新 / 株式会社ICS

PopcornFX

リアルタイムパーティクルエフェクトミドルウェア「PopcornFx」(ポップコーン FX)を使ったエフェクト作成の入門講座第1弾です。公式サンプルをお題にPopcornFxの持つパワフルな機能に触れながら、エフェクト作成に役立つテクニックを紹介します。WebGLやシェーダーを使ったVFX作成にも役に立つと思いますのでぜひご参考ください。

PopcornFxとは？

パリとモントリオールに拠点を置くPersistant Studios社が提供するリアルタイム3Dグラフィックスのソフトウェアです。エフェクトエディター（Windowsのみ対応）、マルチプラットフォーム対応のランタイムSDK(C++)、Unity, Unreal Engineのプラグインから構成されます。エディター自体は無料で利用できます。ランタイムSDK、プラグインは有料となっています。
※対応プラットフォームは、Xbox One, PS4, Xbox 360, PS3, WiiU, PSVita, Windows PC, Mac, Linux, Android, iOSなど、多岐に渡ります。

ICS MEDIAではいくつかのエフェクトエディターを紹介してきましたが、それらと比較した際の大きな特徴は、以下の3つです。

スクリプトで制御可能なパーティクルエディター：
GLSL風の独自言語「popcorn-script」で動きやビジュアルを設定することにより、数十万規模のパーティクルエフェクトでもパフォーマンスを落とすことなく作成できます。
多様な物理運動のサポート：
基本的な物理運動に加え、3Dモデルとの衝突検知、フロッキングアルゴリズム（魚や鳥などの群れの動きをAIを使って制御するアルゴリズム）を使った群衆の動きを設定できます。
豊富なサンプリング機能：
サンプリングとは、特定の値をもつ集合体からある1つの値を選択することを指します。たとえば直方体や3Dモデル空間内の点から値を抽出したり（サンプラーシェイプ）、2Dテクスチャー上の特定の色からパーティクルを発生させたり（テクスチャーサンプラー）、3Dタービュランスノイズを使った流体表現などを作成できます。

GUIとスクリプトを組み合わせて構築していくスタイルは、プログラム志向のアーティスト向きであり、シェーダーの学習としても実用的でしょう。
※ICS MEDIAでのエフェクトエディター紹介記事は記事最後にある参考サイトに掲載しています。

花火エフェクト

本記事では公式サンプルを元に重要と思われる箇所にしぼってピンポイントで解説します。PopcornFxを使ったエフェクト作成の流れをつかんでもらえればと思います。
※今回の花火エフェクトのパーティクル数は10万パーティクル前後です。

今回紹介するテクニック

パーティクルの発生と移動
尺玉から流れる火花（キラキラスパーク）をつけるには？
へびの体のようなうねった動きをつけるには？
尺玉が消えると同時に花火を爆発させるには？

打ち上がる尺玉：パーティクルの発生と移動

尺玉を1つのパーティクルとみなし、3D空間上に発生位置と移動方向（速度）を決めると、尺玉を打ち上げることができます。この方法は多くのパーティクルエディターでも同様の手法です。

発生位置は直方体のシェイプを3D空間上に定義し、そのシェイプ内の位置をサンプリング（ランダムに抽出）するという手法でスクリプトを記述します。移動速度（移動量）も同じような手法です。半球のシェイプを3D空間上に定義し、原点からその空間内へのベクトルをサンプリングすることで移動量を定義します。スクリプト定義は以下のようになっています。
※スクリプトの詳しい解説は省略します。

Position = StartPosition.samplePosition();
Velocity = StartVelocity.samplePosition() * height * 0.7;

このようにシェイプやメッシュを使ったビジュアルエディターとスクリプトを組み合わせてエフェクトを構築できる点がPopcornFxの大きな特徴の1つです。

尺玉から流れる火花（キラキラスパーク）をつけるには？

尺玉のパーティクルに合わせて「火花」と「煙」を追加してあげるとグっと本物の花火っぽくなってきます。尺玉のノードに「Spawner」と呼ばれるノードを追加します。こうすることで、流れ星から舞い散る星屑のような動きを再現できます。PopcornFxでも、ノードに親子構造を作ることでさまざまなビジュアルを作り出すことができます。VFXでの親子ノードは鉄板テクニックですね。

へびの体のようなうねった動きをつけるには？

尺玉から流れ落ちる火花は蛇行しながら空中に散っていくとリアリティーが出てきます。ここで登場するのが、タービュランスノイズを使った動きの定義です。

タービュランスノイズとは？

煙や炎のような流体の動きを表現する際によく使われるノイズ関数です。3DCGの世界では、山々を自動生成したり、テクスチャーの模様をコードで描く際にも利用されています。関数をコードで用意しておくと、ランダムな値を必要なときに好きなだけ生成できるメリットがあります。ノイズの実装方法によってさまざまなノイズ模様が展開でき、とても奥の深い世界です。

スクリプトの解説

float3    velDistort = 5.0 * Turb.samplePotential(float3(spawner.LifeRatio * 3, scene.Time * 2, 0));
Velocity = velDistort;

詳細な解説は省きますが、大雑把に解説するとこのような流れです。

Turb.samplePotential(float3 location)というコードでノイズ値（3次元ベクトル）を取得できます。引数には3次元ベクトルが必要です。
引数のXにパーティクルの年齢（生まれてから消去するまでを0～1としたときの現在時間）、Yにエフェクトシーンの現在時間、Zに0を代入して、タービュランスノイズ関数から3次元座標を取得
取得したノイズ座標を元に係数をかけて速度を決定

タービュランスノイズのパラメーターによる動きの比較

ノイズを生成するパラメーターによる比較です。パラメーターを変更すると動きに変化が出ることがわかります。

左（1つ目）：デフォルトのサンプルの状態
中央（2つ目）：ノイズの強さを5倍にした状態。横ぶれする回数は変わらず、振幅が強くなり荒々しさが強調されます。
右（3つ目）：ノイズのスケールを2倍にした状態。横ぶれする回数が減り、規則性が強調され波のような動きになります。

尺玉が消えると同時に花火を爆発させるには？

PopcornFxには「パーティクルイベント」という概念が存在します。各パーティクルノードの生成、消失、メッシュなどとの衝突イベントを取得できます。

ノードの生成 (OnSpawn)
ノードの消失 (OnDeath)
ノードの衝突 (OnCollide)

今回のサンプルでは「ノードの消失イベント」を駆使することで、尺玉の消失と同時に花火本体を爆発させるといった挙動を生み出しています。このようなインタラクティブなイベントを定義できることも、パワフルなエフェクトを生み出せる要因となっています。

シーン1：尺玉が打ち上がり、頂点まで達した所でパーティクルが消え「消失イベント」が発動します。
シーン2：尺玉が消えたポイントから放射状に花火が放出され、移動し終わったところで次の「消失イベント」が発動します。
シーン3：円周上の各ポイントから余韻用の流し花火が発生して終了です。

終わりに

PopcornFxの高機能な物理エンジン、豊富なサンプリング機能とスクリプトを組み合わせることで、ハイエンドなVFXを作り出すことができるでしょう。スクリプトと聞くとためらってしまう人もいるかもしれませんが、公式サンプルが充実しているので効率よく学習を進められると思います。PopcornFxにはサウンドと連携したビジュアライザー機能などもあり、リアルタイムのデモ作成ツールとしても用途が広がっています。次回もエフェクト作成や演出作成の記事を投稿する予定ですのでぜひお楽しみに。
※Google+の「エフェクトミドルウェアコミュニティ」でもPopcornFXの話題を取り上げていますので気になる方はぜひご参加ください。