
パーティクルシステムは、視覚効果の重要なコンポーネントです。 アーティストは、爆発、煙、雨などのエフェクトを作成できます。
アンリアルエンジン4には、パーティクルエフェクトを作成するためのカスケードと呼ばれる堅牢で便利なシステムがあります。 このシステムにより、モジュール効果を作成し、パーティクルの動作を簡単に制御できます。
チュートリアルのこの部分では、次のことを学習します。
- パーティクルシステムを作成する
- 速度と粒子サイズを設定する
- パーティクルの出現頻度を変更する
- 曲線を使用して経時的に粒子サイズをスケーリングする
- カスケードで粒子の色を設定する
- ブループリントを使用してパーティクルシステムをアクティブ化および非アクティブ化する
- ブループリントを使用して粒子の色を設定する
注:この記事は、Unreal Engineチュートリアルの8つのパートの1つです。
- パート1:エンジンの紹介
- パート2:ブループリント
- パート3:材料
- パート4:UI
- パート5:簡単なゲームを作成する方法
- パート6:アニメーション
- パート7:サウンド
- パート8:パーティクルシステム
- パート9:人工知能
- パート10:シンプルなFPSを作成する方法
仕事を始める
空白のプロジェクトをダウンロードして解凍します。 プロジェクトフォルダーに移動し、 SpaceshipBattle.uprojectを開きます。
[ プレイ]をクリックしてゲームを開始します。 マウスの左ボタンを押したまま 、キーW 、 A 、 S 、およびDで撮影および移動します。
GIF

このチュートリアルでは、2つのパーティクルエフェクトを作成します。 1つは船のエンジン用、もう1つは爆発用です。 それらを作成するには、 パーティクルシステムを使用します 。
「粒子システム」とは何ですか?
名前が示すように、パーティクルシステムはパーティクルを作成および管理するためのシステムです。 パーティクルは空間内の単なるポイントです。 パーティクルシステムを使用すると、パーティクルの外観と動作を制御できます。
パーティクルシステムは、 エミッタと呼ばれる1つ以上のコンポーネントで構成されています。 パーティクルを生成します。

エミッタには、 モジュールと呼ばれるコンポーネントもあります 。 モジュールは、エミッターによって作成されたパーティクルの個々のプロパティ、たとえば、マテリアルや初期パーティクル速度を制御します。 以下の例では、2つのモジュールを使用して、各粒子に赤い円とランダムな速度を与えました。

また、パーティクルの寿命にわたってパーティクルの色を変更することもできます。 この例では、粒子の色が赤から青に変わります。

これで、パーティクルシステムが何であるかがわかり、船のエンジン用に作成できます。
パーティクルシステムの作成
ParticleSystemsフォルダに移動し、 Add New \ Particle Systemをクリックします。 パーティクルシステムの名前をPS_Thrusterに変更して開きます。
カスケード:パーティクルシステムエディター
カスケードは4つのメインパネルで構成されます。
- ビューポート:このパネルには、パーティクルシステムの外観が表示されます。 マウスの右ボタンを押したまま移動すると、回転できます 。 移動するには、 マウスの右ボタンを押しながらWASDキーを押します 。
- 詳細:選択したコンポーネント(エミッター、モジュールなど)のすべてのプロパティがここに表示されます。 何も選択されていない場合、パーティクルシステムのプロパティがここに表示されます。
- エミッタ:このパネルには、エミッタのリストが左から右に表示されます。 各エミッターには、そのモジュールのリストが表示されます。
- カーブエディタ:カーブエディタを使用すると、カーブモジュールの値を視覚化および変更できます。 すべてのモジュールプロパティが曲線をサポートしているわけではありません。
これまでのところ、システムはデフォルトでパーティクルマテリアルを使用します。

最初に、パーティクルマテリアルをサークルマテリアルに置き換えます。
マテリアルをパーティクルに適用する
Emittersパネルに移動し、 Requiredモジュールを選択します。

Requiredモジュールには、パーティクルマテリアルやエミッタの持続時間などの必要なプロパティが含まれています。 各エミッタには、Requiredモジュールが必要です。
マテリアルを変更するには、詳細パネルに移動し、 マテリアルをM_Particleに設定します 。 この場合、粒子はオレンジ色の円になります。

次に、パーティクルシステムをプレイヤーの船に取り付けます。
パーティクルシステムの添付
メインエディターに戻り、 ブループリントフォルダーに移動します。 BP_Playerを開き、[コンポーネント]パネルに移動します。
パーティクルシステムを使用するには、 パーティクルシステムコンポーネントを使用できます。 作成して、名前をThrusterParticlesに変更します。 それをCollisionコンポーネントに接続します。

パーティクルシステムを設定するには、[詳細]パネルに移動し、[ パーティクル]セクションを見つけます。 テンプレートをPS_Thrusterに設定します 。
次に、 ThrusterParticlesコンポーネントの場所を(-80、0、0)に設定します。 この場合、粒子は船の後ろに配置されます。

最後に、 回転を ( 0、90、0)に設定します。 これにより、パーティクルが船から遠ざかるようにパーティクルシステムが制御されます。

[ コンパイル]をクリックして、メインエディターに戻ります。 [ 再生]をクリックして、動作中のパーティクルシステムを確認します。
GIF

パーティクルシステムは動作しますが、パーティクルの動きが遅すぎて、非常に小さくなります。 これは、初期速度と粒子サイズを設定することで修正できます。
速度と粒子サイズの設定
最初に、初期粒子速度を設定します。 PS_Thrusterを開き、 初期速度モジュールを選択します。 次に、 Start Velocity \ Distributionを展開します。
デフォルトでは、初期粒子速度は(-10、-10、50) 〜 ( 10、10、100)の範囲にあります。

粒子が船からより速く離れるようにするには、 Zに沿って速度を上げる必要があります。 最小Zを300に 、 最大Zを400に設定します。

以下に、元の速度と新しい速度の比較を示します。

次に、初期粒子サイズを設定する必要があります。
粒子サイズ設定
[ 初期サイズ]モジュールを選択し、[詳細]パネルに移動します。 次に、 「開始サイズ」\「配布」を展開します。
初期速度モジュールと同様に、初期サイズにも最小値と最大値の間隔があります。 ただし、このチュートリアルでは、一定の粒子サイズを設定します。 これを行うには、 DistributionをDistribution Vector Constantに設定します。

注:分布を使用すると、定数値、間隔内または曲線上の値を設定できます。 ブループリントを使用して値を設定することもできます。 詳細については、Unreal EngineドキュメントのDistributionsページをご覧ください。
次に、 定数値 (70、70、70)を設定します。 サイズ比較の例を次に示します。

メインエディターに戻り、[ 再生 ]をクリックします。
GIF

粒子はよく見えますが、粒子間の距離はまだ大きすぎます。 これは、パーティクルスポーンの間隔が長すぎるために発生しました。 これを修正するために、スポーンの速度を上げることができます。
パーティクルスポーン速度の増加
スポーンの速度を上げるには、 Spawnモジュールを使用する必要があります。 このモジュールは、パーティクルスポーンエミッタの速度を制御します。 Requiredと共に、各エミッタにはSpawnモジュールが必要です。
PS_Thrusterを開き、 Spawnを選択します。 [詳細]パネルに移動し、[ スポーン\レート]セクションを展開します。

定数を50に設定します。 これにより、スポーン速度が50パーティクル/秒に増加します。

メインエディターに戻り、[ 再生 ]をクリックします。
GIF

ご覧のとおり、粒子はトレースに似ています。 パーティクルをエンジン炎のように見せるために、パーティクルの寿命を短くすることができます。
粒子寿命の短縮
PS_Thrusterを開き、エミッタパネルに移動します。
パーティクルの寿命を短縮するには、 Size By Lifeモジュールを使用する必要があります。 このモジュールは、その寿命にわたって粒子サイズ係数を適用します。 エミッターの空のスペースを右クリックし、 Size \ Size By Lifeを選択して作成します。

デフォルトでは、係数は常に1であるため、これは粒子サイズに視覚的に影響しません。粒子を減らすには、サイズ係数が時間とともに減少するようにモジュラスカーブを変更する必要があります。 しかし、最初に曲線とは何かを理解する必要がありますか?
曲線とは何ですか?
曲線は点の集合です。 各ポイントには、位置と値の2つのプロパティがあります。
2つ以上のポイントがある場合、それらは線を作成します。 以下は、単純な線形曲線の例です。 ポイントAの位置と値は0です。 ポイントBの位置は2で、値は1です。

任意のポイントで線形曲線をサンプリングすると、線形補間のように機能します。 たとえば、ポイント1で曲線をサンプリングすると、値0.5が得られます。

減少曲線を作成すると、結果の値は徐々に減少します。 これは、Size By Lifeモジュールに使用する曲線です。

ここで、カスケードに上記の曲線を作成します。
モジュラス曲線の変更
[ Life By Size]を選択して、[詳細]パネルに移動します。 Life Multiplier \ Distribution \ Constant Curve \ Pointsを展開します。 以下は、 Life Multiplier曲線のポイントのリストです。

Valは、曲線上の点の位置です。 Size By Lifeの場合、値0はパーティクルの寿命の始まりを示します。 値1は、パーティクルの寿命の終わりを示します。
時間の経過とともにサイズ係数を小さくするには、 2番目のポイントのOut Valを小さくする必要があります。 ポイント1の Out Valを(0、0、0)に設定します。 これにより、粒子サイズが徐々に0になります。

カーブエディタでライフマルチプライヤカーブを視覚的に確認できます。 これを行うには 、 Size By Lifeモジュールのグラフアイコンをクリックします。

これにより、Curve EditorにLife Multiplierが追加されます。 ウィンドウに曲線を合わせるには、曲線エディターの「 フィット」をクリックします。

ご覧のとおり、サイズファクターは、パーティクルの寿命にわたって1から0に減少します。

メインエディターに戻り、[ 再生 ]をクリックします。
GIF

今、粒子は炎のようです! このパーティクルシステムに最後に追加するのは、カラーバリエーションです。
カラーバリエーションを追加する
カスケードを使用してパーティクルの色を設定するには、パーティクルに適切なマテリアルを選択する必要があります。 Materialsフォルダーに移動し、 M_Particleを開きます 。

これで、マテリアルに色が設定されました。 パーティクルシステムの色を使用するには、 ParticleColorノードを適用する必要があります。
まず、 Emissive Colorに接続されたノードを削除します。 次に、 ParticleColorノードを追加し、次のように接続します。

オプショナル
パーティクルの不透明度を制御する場合は、 乗算ノードを追加して次のように接続します。

[ 適用]をクリックしてM_Particleを閉じます。
粒子の色を設定するには、 初期色モジュールを使用できます。
初期カラーモジュール
PS_Thrusterを開き、 初期カラーモジュールを追加します。 色のカテゴリにあります。

色のバリエーションを追加するには、色の間隔を指定する必要があります。 これにはディストリビューションを使用できます。
[ 初期色]を選択して、[詳細]パネルに移動します。 [ 開始色]セクションを展開し、 [ 分布]を[ 分布ベクトル均一]に変更します。 これにより、各カラーチャンネルの間隔を指定できます。

このチュートリアルでは、色の範囲はオレンジから赤までです。 これを行うには、 最大値(1.0、0.0、0.0)および最小値(1.0、0.35、0.0)を設定します。

ビューポートを見ると、色が奇妙に振る舞うことがわかります。
GIF

これは、 Color Over Lifeモジュールが常に白色に変わるためです。 これを修正するには、 Color Over Lifeを選択してDeleteを押します。 これで、モジュールのリストは次のようになります。

PS_Thrusterを閉じて、メインエディターで[ 再生 ]をクリックします。 これらのエンジン炎を賞賛してください!
GIF

次に、船が動いているかどうかに応じてパーティクルシステムを切り替える方法を学習する必要があります。
パーティクルシステムの有効化/無効化
船が動いているかどうかを確認するために、プレイヤーが移動キーを押したかどうかを確認できます。
BP_Playerを開き、 Event Tickノードを見つけます。 ノードチェーンの最後に次の図を追加します。

この回路の機能を理解しましょう。
- MoveUpおよびMoveRight軸のバインディングをチェックします。 両方が0を返す場合、これはプレイヤーが移動キーを押さないことを意味します。
- Branchがtrueを返す(プレーヤーがモーションキーを押さない)場合、 ThrusterParticlesは非アクティブ化されます。
- Branchがfalseを返す (プレイヤーが移動キーを押す)と、 ThrusterParticlesがアクティブになります
[ コンパイル]をクリックし、 BP_Playerを閉じます 。 [ 再生]をクリックし、モーションキーを押して放して、違いを確認します。
GIF

今、最も興味深い時が来ました:爆発粒子のシステムを作成します!
爆発効果を作成する
新しいパーティクルシステムを作成する代わりに、エンジンパーティクルを複製します。 ParticleSystemsフォルダーに移動し、 PS_Thrusterを右クリックして、 複製を選択します。 複製の名前をPS_Explosionに変更して開きます。
爆発の場合、すべてのパーティクルは次々にではなく、同時にスポーンする必要があります。 この効果はパルス放出と呼ばれます。

勢いをつくる
最初に、デフォルトのスポーン動作を使用したくないため、スポーン速度をゼロに設定する必要があります。 Spawnモジュールを選択し、 Spawn \ Rate \ Distribution \ Constantを0に設定します。

次に、エミッタに運動量を作りたいことを伝える必要があります。 [ バースト]セクションまでスクロールし、[ バーストリスト]に新しいアイテムを追加します。 これは、 +アイコンをクリックして実行できます。

各要素には3つのフィールドが含まれます。
- カウント:作成されたパーティクルの数。 20の値を指定します。
- Count Low: 0以上の場合、作成されるパーティクルの数はCount LowからCountに変わります。 ここでは値-1のままにします。
- 時間:パーティクルが発生する瞬間。 値0は、エミッターの寿命の始まりを示します。 値1は、エミッターの寿命の終わりを示します。 ここでは値0.0のままにします。
注:エミッターの寿命はRequiredモジュールにあります。 [ 期間]セクションに[ エミッタ期間]としてリストされています。

これは、エミッターが寿命の開始時に 20個のパーティクルを作成することを意味します。

インパルスを爆発のように見せるために、パーティクルが飛び散る速度を追加する必要があります。
粒子散乱
ゲームには上面図があるため、XとYで速度を指定するだけです。[ 初期速度]モジュールを選択し、 [速度の開始\配布]を展開します。 Maxを値(1000、1000、0)に 、 Minを値(-1000、-1000、0)に設定します。

負の値から正の値までの間隔を示したので、粒子はエミッターから離れて飛びます。

次に、エミッタの繰り返し回数を設定する必要があります。
エミッタの繰り返しを設定する
デフォルトでは、エミッターは無限に繰り返されます。 これはそのような効果に最適です。 煙や火のようなものですが、パルスは一度だけ再生する必要があります。 これを修正するには、エミッタに一度だけ繰り返す必要があることを伝える必要があります。
必要なモジュールを選択し、 期間セクションを見つけます。 エミッタループを1に設定します。

ここで、敵の死の爆発を再現します。
敵が死んだときにパーティクルを作成する
メインエディターに戻り、 ブループリントフォルダーに移動します。 BP_Enemyを開き、 OnDeathイベントを見つけます。
パーティクルシステムをスポーンするには、ロケーションノードでエミッタをスポーンすることができます。 それを作成し、 Destroy Actorとマージします。

次に、 エミッターテンプレートをPS_Explosionに設定します 。

最後に、 GetActorLocationを作成し、 Location連絡先に接続します。

これで、敵が死亡すると、イベントは敵の場所にPS_Explosionのインスタンスを作成します。
[ コンパイル]をクリックして、メインエディターに戻ります。 [ 再生]をクリックして、敵の射撃を開始します。
GIF

見て、爆発があります! 次に、敵と同じ色を与えて、彼らをより面白くします。
爆発の色を敵の色に置き換える
色を使用するには、ブループリントからこの情報を取得する方法が必要です。 幸いなことに、Cascadeにはこれを可能にする配布タイプがあります。
PS_Explosionを開き、 Initial Colorモジュールを選択します。 開始色\分布を分布ベクトル粒子パラメータに設定します。

これにより、ブループリントを使用して変更できるパラメーターが提供されます。 パラメーター名に PrimaryColor という名前を付けます

爆発には、敵の両方の色を使用します。 2番目の色を使用するには、別のエミッタが必要です。 エミッタの空のスペースを右クリックし、[ エミッタ] \ [ エミッタの複製と共有]を選択します。 したがって、エミッタを複製します。

各モジュールに+記号が付いていることがわかります。 Duplicateの代わりにDuplicate and Share Emitterを使用することにより、モジュールをコピーしましたが、コピーしませんでした。 1つのモジュールに加えられたすべての変更は、別のエミッターの同じモジュールに反映されます。 これは、サイズなど、すべてのエミッターのプロパティを変更する場合に便利です。
変更する必要がある唯一のモジュールはInitial Colorです。 ただし、変更を加えると、両方のエミッターに影響します。 この場合、個別のパラメーター名が必要なため、モジュールを接続する必要はありません。 接続を無効にする最も簡単な方法は、複製された初期色モジュールを削除して新しいモジュールを作成することです。

注:執筆時点では、モジュール間の通信を切断するための組み込みメソッドはありません。
新しい初期色を選択し、 開始色\分布を分布ベクトル粒子パラメータに設定します。 次に、 パラメーター名をSecondaryColorに設定します。

この時点で、パーティクルシステムの準備は完了です。 PS_Explosionを閉じます 。
次に、ブループリントを使用してパラメーターを設定する必要があります。
ブループリントで粒子パラメーターを指定する
BP_Enemyを開き、位置でSpawn Emitterの後に強調表示されたノードを追加します。

これにより、 PS_Explosionの 2つのパラメーターを変更できます。
次に、パラメーターに正しい名前を付ける必要があります。 最初のSet Color Parameterのパラメーター名をPrimaryColorに 設定します 。 2番目のSet Colorパラメータのパラメータ名をSecondaryColorに 設定します

最後に、色を伝える必要があります。 作業を簡単にするために、変数PrimaryColorおよびSecondaryColorに色を既に保存しています。 各変数を対応するノードに接続します。

最終的には次のようになります。

イベントを順番に見てみましょう。
- 敵が死亡すると、その場所にPS_Explosionのインスタンスが生成されます
- PrimaryColor PS_Explosionパラメーターの値を設定します
- SecondaryColor PS_Explosionを設定します
[ コンパイル]をクリックし、 BP_Enemyを閉じます 。 [ 再生]をクリックし、敵の射撃を開始して爆発を確認します。
GIF

これらすべてのジューシーな粒子を見てください。 プレイヤーが死んだときに爆発を追加してみましょう。
内部のソリューション
- BP_Playerを開き、 OnDeathイベントを見つけます
- 場所ノードのスポーンエミッタを Then 1 シーケンスノードに接続します。 Emitter TemplateをPS_Explosionに設定します 。
- GetActorLocationを作成し、それをLocationノードのSpawn Emitterの Location連絡先に接続します
- Set Colorパラメーターを作成し、それをLocationのSpawn Emitterに接続します。 パラメーター名をPrimaryColorに設定し、 PrimaryColor変数をParamに接続します。
- 別のSet Color Parameterを作成し、それを最初のSet Color Parameterに接続します。 パラメーター名をSecondaryColorに設定し、 SecondaryColor変数をParamに接続します。

次はどこに行きますか?
完成したプロジェクトはここからダウンロードできます。
Cascadeの非常に基本的なことだけを扱ったと思いますか? 面白い効果を作成しましたが、実験できるモジュールは他にもたくさんあります 。 TypeDataモジュールについてさらに学ぶことをお勧めします。 彼らの助けを借りて、剣を振ったり、稲妻をしたり、牛から雨を降らせたりするようなエフェクトを作成できます!
トレーニングを続けたい場合は、シリーズの次の投稿を読んでください 。ここでは、人工知能の使用を開始します。