パーティクルライブを作ってみる②演出実装編
はじめに
この記事中で完成したパーティクルライブ
・この記事では、いわゆる「VRMV」や「パーティクルライブ」と言われるものを、わたくしぐっちうぱるぱが普段どのように制作をしているのかを紹介していこうと思います。
・「この通りやればパーティクルライブが作れる！」という記事ではなく、あくまで私なりのやり方をご紹介するだけの記事ですので、ヒントになりそうなところだけ持ち帰っていただいて、参考にならなそうな箇所は読み飛ばしていただく、くらいのゆるさでお付き合い頂ければと思います。
・私の制作スタイルとして、「あまり文字は用いず、パーティクルのみで表現する」「雰囲気やストーリー性ではなく、音の視覚化、音ハメの気持ち良さに重きを置く」などの特徴があります。今回の記事もそういったパーティクルライブの制作方法になりますので、歌詞や雰囲気、ストーリー性などを重視したい方にはあまり参考にならない可能性が高いです。
参考までに、よろしければ一度私のワールドにいらしてください。
・なお今回は、アバターパフォーマンスとして披露するパーティクルライブについては書きません、あくまでワールド制作の話になりますので、ご了承ください。
しかしワールドからアバターにそのまま移植することも難しくはないので、ヒントになることはあるかもしれません。
前回のおさらい
・マテリアルの作成、作業フォルダの確保
Assetsフォルダ以下に新しいフォルダを作成し、そちらでアセットや素材などを管理することにしました。
Create→Materialで新しいマテリアルを作り、Standard Unlitシェーダーを選択し設定をしました。
・スカイボックスの設定
真っ黒な背景にするための方法を書きました。
スカイボックス用の新しいマテリアルを作成、設定し、Window→Rendering→Lightingでスカイボックスを変更しました。
（シーンウィンドウの設定でSkyboxに✓するのを忘れずに）
・楽曲の導入
WindowsのエクスプローラからUnityのProjectウィンドウに音声ファイルをドラッグアンドドロップし、音源の設定を変更しました。
・ワールドの床の設定
ヒエラルキー上で床を選択してMesh Rendererをオフにしました。
ついでにTransformのScaleを変更して床を広くしました。
・ヒエラルキーの作業スペースを整理
空っぽの箱になるオブジェクトを複数作り、「ギミック用」「パーティクルライブ用」「その他オブジェクト用」などカテゴリごとで整理しました。
・ヒエラルキー上に音源を入れる
ヒエラルキー上にAudio Sourceを作り、そこに導入した音声ファイルをドラッグアンドドロップしてインスペクター上で設定変更しました。
・タイムライン、アニメーションの設定
タイムラインを作成し、タイムラインに音声トラックを追加し、新しいアニメーターコントローラーを作成して、ヒエラルキー上のオブジェクトに割り当てました。
そしてタイムライン上でアニメーショントラックを追加しました。
演出を考える
まずは楽曲の分析
今回使う楽曲の中でどんな楽器が使われているのかをリストアップします。
大きく分けて次の楽器が鳴っていることがわかりました。
・ドラムなどのリズム楽器
・ベース
・コード（和音）を奏でるシンセサイザー
取捨選択する
・ドラム、ベース、シンセサイザーが鳴っていることがわかりましたが、今回は思い切って「ベース」「シンセサイザー」は切り捨てることにしました。
なぜならドラム、ベース、シンセサイザーすべてに対応する演出を考えるのが大変だからです。
説明を簡略化するために、今回は楽曲中で最も存在感のある楽器のみに絞って演出を考え実装していきたいと思います。
さらにドラムの中でもキック、スネア、ハイハット、タム、その他パーカッションなどが鳴っていましたが、今回はシンプルに「キック」「スネア」の二つの楽器、音色のみに絞って実装していきたいと思います。
音から受けるイメージを言語化する
・キック（バスドラム）
「ドッ」という擬音
低音で楽曲全体を支えてる印象
音の長さが短い
シンプル
・スネア
何かが弾けるような瞬発力のある音
音の長さが短い
シンプル
書き出したキーワードを元にアイデアを出す
・キック（バスドラム）
低音で楽曲全体を支える→下で支えてるイメージなので、画面構成的に床に当たる部分か、それより下のエリアに配置してみようか？
音の長さが短い→パーティクルの生存時間（Lifetime)も短くする
シンプル→シンプルな演出にしてみよう
・スネア
何かが弾けるような音→花火のように弾けるパーティクルにしてみよう
音の長さが短い→パーティクルの生存時間も短くしてみよう
シンプル→シンプルな演出にしよう
アイデアを元に実装
まずはパーティクルシステムを実際に作ってみる。
前回作った空のオブジェクト「Main Animation」以下に新しく「Particles」という空のオブジェクトを作成。
「Particle」を右クリックして、Effects→Particle Systemを選択し作成
シーン上でパーティクルを見てみるとなんかパーティクルが四角いので囲まれてるので、これを消します（これは完全に好み）
右上の球体のさらに右にある▽を押して、「Selection Outline」をオフにします。
キックのパーティクル設定
Particle Systemの各項目について解説すると大変なので今回は説明なしでいきますが、こちらで解説してくれている方がいますので、各項目の設定について詳しく知りたい方はそちらをご参照ください
また、Unityの公式ドキュメントを読むのもおすすめです。
先ほど考えたアイデアを元に「キック（バスドラム）」を表現するパーティクルをインスペクター上で設定します。
①Main Moduleの「Start Size」を0.05に設定
②Emission Moduleの「Rate over Time」を０に設定
③Emission ModuleのBurstsの＋マークを押す
④Emission Module「Count」の値をとりあえず１００くらいに設定
⑤Limit Velocity over Lifetime Moduleに✓
⑥Limit Velocity over Lifetime Moduleの「Dampen」を0.5に設定、「Speed」を０に設定
⑦Main Moduleの、「Start Lifetime」を0.25くらいに設定（ここはバスドラムの音の長さに合わせて適宜調整）
⑧「Color over Lifetime」Moduleに✓
⑨Color over life time Module内の白いバーをクリックして、右上の目印をクリックして「Alpha」のスライダーをめいっぱい左にドラッグ
⑩「Trails」Moduleに✓
⑪Trails ModuleのLifetimeを0.25
⑫Trails ModuleのMinimum Vertex Distanceを0、Width over Trailを0.5~1にお好みで設定a
⑬Trails ModuleのColor over Lifetimeの右側の▽をクリックし、「Gradient」を選択
⑭Trails Moduleの白いバーをクリックして、右上のツマミをクリックして、「Alpha」を左にめいっぱいドラッグする
⑮Trails ModuleのColor over Trailも同じように設定する
⑯「Renderer」Moduleに✓
⑰Renderer Moduleの「Material」の右の◎をクリックして、前回作成したマテリアル（Default_Particle）を選択
⑱Renderer Moduleの「Trail Material」の右の◎をクリックして、前回作成したトレイル用マテリアル（Trails）を選択
⑲「Shape」Moduleを開いて、さらにその中の「Shape」を「Circle」に設定し、「Mode」を「Burst Spread」に変更
⑳シーン上で「Rotate Tool」を選択して、赤い軸を選択して、Ctrlを押しながらドラッグして９０度回転させ床に平行にパーティクルが広がるようにする
㉑インスペクター一番上の「Transform」に戻って、「Position」のZの値を20くらいにする
㉒Main Moduleの「Start Speed」を３００とかに設定しちゃう
20m先でパーティクルが波紋状に広がってるのがわかる
これで、「キック」の楽器を表現するパーティクルの設定が完了しました。
座標がずれるときの解決法
パーティクルシステムの座標がXYZ全部０になってるのになぜか空中に浮いてたり変なところにパーティクルが配置されてしまう！というときは、ヒエラルキー上で上位のオブジェクトの座標が、下位のオブジェクトの座標に影響を与えてる可能性があります。
どういうことかというと、例えば今回の場合では
ヒエラルキー上で上位に位置する「Note_World」や「Note_VRMV」の座標が０以外の数値になっていると、ヒエラルキー上でその下位に位置する、今いじっているパーティクルの座標もその分だけズレてしまうということです。
スネアのパーティクル設定
まず「キック」用に設定したパーティクルをコピーします。
あ、その前に名前を変えておきましょうか。
先ほど作ったキック用のパーティクルを「Particle System」から「Kick」へ名前変更しました。
いま「キック」用に設定したパーティクルをコピーしたわけですが、一部の設定を変更して「瞬間的に破裂する花火のようなパーティクル」を目指して作りたいと思います。
①Shape Moduleを開き、Shapeを「Sphere」にする
②Main ModuleのStart Speedを100に設定する
③TransformのPositionのYを5に設定する
これで「スネア」用のパーティクルが完成です！
アニメーションを設定
「キック」と「スネア」を表現するパーティクルは完成しました。
あとは、楽曲中の「キック」の音色が鳴るタイミングで「キック」用のパーティクルが出現するようにして、「スネア」の音色が鳴るタイミングで「スネア」用のパーティクルが出現するようにアニメーションを設定すれば、パーティクルライブ自体は完成します。
①まずはTimelineが割り当てられてるオブジェクトを選択
今回の場合は、「Note_VRMV」になります
②タイムラインウィンドウの右上にある鍵のマークでロックする
③アニメーショントラックの録画ボタン（赤い丸）を押す
④ヒエラルキー上で「Kick」と「Snare」を選択して、インスペクター左上の✓マークを外す
⑤タイムラインウィンドウのアニメーショントラック上で右クリックして、「Edit in Animation Window」をクリック
⑥タイムラインウィンドウ上のうえの方にあるメモリのところをドラッグすると、任意の時間に移動することができます。
その状態でスペースキーを押すことで、再生/一時停止を切り替えられます。
また、タイムラインウィンドウ上でマウスホイールをくるくる回すことでズームイン/ズームアウトができ音声波形の細かいところまで見ることができます。
⑦以上の機能を駆使して、「キック」の音色が鳴るところを探します。
そして、「キック」が鳴る「瞬間」の「１フレーム前」にメモリを合わせます。（マウスホイールでズームすると合わせやすいです。）
⑧シークバーを合わせた状態で、タイムラインウィンドウ上のアニメーショントラック上で右クリックして「Edit in Animation Window」を選択してアニメーションウィンドウを開き、その中の「Kick」に✓を入れます。
これで、「シークバーを置いたフレームのタイミング」で、（今回の場合は７８フレーム目）「Kick」というオブジェクト（パーティクル）がオンになるアニメーションを設定することができました。
試しに再生してみましょう
再生ボタンを押してプレイモードに入ったら、タイムラインウィンドウ上でシークバーをキックが鳴る直前までもっていって、スペースキーで再生してみます。
キックが鳴っているタイミングで、「Kick」のパーティクルシステムがオンになっているのが確認できます。
ここでズレてたらもう一度手順を見直してみましょう。
あとプレイモードに入って何も操作しないと映像と音がズレてしまうのはおそらく仕様なので、プレイモードに入ったら一度シークバーを操作してスペースキーで一時停止/再生の操作をしてください。
※重要な注意点として、プレイモード中に行った変更（主にヒエラルキー上の操作）はプレイモードを中断したら消えてしまうモノがあるので、プレイモード中に何か変更を加えたくなったら、必ずプレイモードを中断してから変更を加えるようにしてください。（プレイモードで再生しながらアニメーションキーの打ち込みは可能）
プレイモードでちゃんとキックが鳴るタイミングでパーティクルが再生されてるのを確認したら、プレイモードを中断して作業に戻ります。
キックが鳴るタイミング全てにアニメーションキーを打ち込みたいわけですが、先ほどの
①音声波形を拡大して、シークバーをキックが鳴るタイミングの１フレーム前に合わせる
②Animationウィンドウで「Kick」のゲームオブジェクトに✓を入れてONにする。
の工程に加えて
③音声波形を拡大して、シークバーをキックが鳴るタイミングの２フレーム前に合わせる
④Animationウィンドウで「Kick」のゲームオブジェクトの✓を外し、OFFにする。
工程も加えます。
ＯＮ→ＯＦＦ→ＯＮ→ＯＦＦの入力を繰り返すわけです。
またドラムは同じリズムを繰り返すことも多いので、１小節分くらいとか、ある程度ON/OFFのアニメーションキーを打ち込んだら、Animationウィンドウのアニメーションキーをドラッグで囲み、Ctrl+C→Ctrl+Vで楽をしてしまうのもおすすめです。
そんなこんなで「Kick」と「Snare」ゲームオブジェクトのアニメーションキーをぽちぽちと打ち込み、Ctrl+C→Ctrl+Vなどを駆使しながら完成しました。
ポストプロセスの設定
パーティクルを光らせて見栄えをよくするポストプロセスを設定します。
Unity画面上部のVRWorld Toolkit→Post Processing→Setup Post Processingを選択します。
パーティクルがぼんやり光っているのがわかりますね。
ヒエラルキー上に「Post Processing Volume」というゲームオブジェクトが追加されるので、これを選択して「Bloom」というエフェクトの欄をいじって光の加減を調整します。
特に重要な項目について書きます。
Intensity：光の強さ
どれだけ明るく光らせるかを調整します。
私は0.5~2の範囲で調整することが多いです。
Clamp：光の最大強度
説明が難しいですが、簡単に言えば「光が明るすぎる箇所を抑える」役割を持ちます。低い値に設定すると明るすぎる光を抑制して、高い値に設定するとその制限がなくなります。
Intensityを10くらいにしてからここの値を弄ると違いがわかりやすいです。
私は1~2の範囲で調整することが多いです。
Diffusion：光の拡散
光がどれだけの範囲に拡散するかを決めます。
高い値に設定するとぼやけた感じになり、低い値に設定するとシャープな印象になります。
私は4~8の範囲で調整することが多いです。
Color：光の色
Bloomで設定した光の色を決めます。
パーティクルそのものの色には影響しません。
雰囲気がガラッと変わるので、赤とか青とかに変えてみると面白いかもしれません。
その他の項目は良く分からないので弄ったことないです。
今回は
Intensity：2
Clamp：2
Diffusion：5
に設定しました。
スイッチの作成
ドラムとスネアのみのシンプルなパーティクルライブが完成したわけですが、このままではワールドに入った瞬間に、パーティクルライブが自動再生されてしまいます。
なのでワールドに入ってから、プレイヤーがスイッチを押すことではじめてパーティクルライブがＯＮになるギミックを実装したいと思います。
ですが、一からギミックを組むのは大変なので、Boothで配布されているこちらのスイッチギミックをお借りしたいと思います。ありがたいですね。
ダウンロードしたら、中にあるLura's SwitchのUnity Packageを実行します。
Importを押すとProjectウィンドウに導入されます。
次にヒエラルキー上の「Note_Gimmick」を右クリックしてSphereオブジェクトを作成します。
名前は「Switch」とつけておきます
「Switch」オブジェクトを選択して、インスペクター内の「Add Component」で「Luras Switch」を選択します。
「Interection Text」を「Start/reset」とし、「Is Global」にチェックをつけます。
「Target Object」をクリックし、＋マークを押します。
右の◎をクリックして、「Note_VRMV」を選択します。
続いてヒエラルキー上に戻り、「Note_VRMV」オブジェクトをOFFにします。
動作確認のためにプレイモードに入ります。
「Sphere」をクリックすると、「Note_VRMV」以下のパーティクルライブがONになり、もう一度押すとOFFになることが確認できました。
ちなみに今回お借りしたQuickBrown Design Studioさんのスイッチギミックは規約上、クレジット表記が必要なので、ワールドを公開する際には忘れないように！
後は「VRChat SDK」のコントロールパネルを開き、名前を決めて説明文を書いてサムネイルを設定して、ValidationsのAutofixボタンをぽちぽち押してアップロードすれば完了です！（雑）
あとがき
今回の内容を軽くおさらい！
①演出を考える
楽曲を分析し、音色/楽器のイメージを言語化し、キーワードを元にアイデアを固める。
②演出を元にパーティクルシステムの設定をする
アイデアを実際のパーティクルの動きに反映するように各項目を設定する。
③タイムラインで波形を見ながらアニメーションキーを打ち込む
シークバーを音が鳴るタイミングに合わせて、ON/OFFのアニメーションキーを打ち込む。
④ポストプロセスを設定する
VRWorld Tool Kitを利用して、ワンボタンでポストプロセス（Bloom）の設定をする。
⑤スイッチを作成する
既存のスイッチギミックをお借りして、パーティクルライブをON/OFFするギミックを実装する。
書き終わってみると表面的な説明が多く「なぜそれをするのか」の説明があまりできなかったことが少し心残りですが、書いているうちに「ポストプロセスってワンボタンで設定できたんだ・・・」「アニメーションの設定ぜんぜんうろ覚えやんけ！」など新しい発見が多々あり、自分の手順を見直すきっかけにはなったので書いてよかったなと思います。
というわけで、ここまでお付き合いいただきありがとうございました！
皆さんのVRChat、Unityライフのお役に立てたとしたら幸いでございます。