Zenn
👨‍🎓

コリジョンとデカールでエフェクトを作る

2025/03/05に公開

開発部 デザインニ課 のT.Kです。
普段の業務はAfterEffectsを使用して、遊技機のエフェクト制作や実装作業を主に行っています。

社内学習の一環でUnrealEngineを勉強しており、
今回は最近学んだNiagaraシステム上のコリジョンとデカールを使って
エフェクトを作ってみようと思います。

壁にインクが飛び散ったり、銃弾の痕をつけたりと、色々な場面に活用できると思います。

Niagaraのコリジョン設定

まずは壁に当てるための弾となるエフェクトを作ります。
静止画でも軌跡が見やすいようにビーム状の見た目にしようと思います。

適当にAddVelocityでパーティクルをX方向に飛ばしましょう。
Local Spaceのチェックは外します。その後パーティクルの更新に『Collision』を適用します。
 
Restitutionの値は、特に反発してほしいわけではないので0にしたいところですが
0だとなぜかデカールの出現が上手くいかないので0.1とかにしておきます。

Friction During a Bounceは大きめに設定しておかないと、滑ってパーティクルの向きが
変わってしまうのか、デカールが正しい向きに出現してくれなくなりました。
10が有効な数字か分かりませんが1以上にはしたいですね。

Advance Age Rateを100にして、壁に当たった瞬間ビームが消えるようにします。

パーティクルの情報をブループリントに送るために…

Export Particle Data to Blueprintを適用します。

・コリジョン
・パーティクルの位置
・パーティクルの向き
の情報をブループリントに送ることができるようになります。
画像の赤線と緑線の部分に各種パラメータをあてがいましょう。

Callback Hndler ParameterにはObjectタイプのユーザーパラメータを設定します。
名前は何でもいいので、今回はシンプルにObjectにしてます。
この名前は後で使うので覚えておきましょう。

デカールの向きについて

デカールを出現させるエミッタを設定するのですがその前に向きについて考えたいと思います。

デカールはデフォルトだとなんだか上を向いているんですよね。
板で表現するとわかりやすいですが、壁に当たった時もデカールの見せたい面は
上を向いてしまい正しい見た目に表示されなくなります。

つまりパーティクルを回転させて面をエミッタ側に向けてやれば
正しい向きでデカールは壁に張り付いてくれるはず。
板の場合はInitial Mesh Orientationを使い、Yの値に0.25を入れて回転させると
正面を向いてくれるようになりました。

なのでデカールもYに0.25の値を入れてやれば同じ向きになりますね。
この値を覚えておきましょう。

デカール用エミッタの設定

新しいNiagaraシステムとエミッタを用意し、
レンダリングの項目にはDecal Rendererを設定します。

次にパーティクルのスポーンに Initial Decal Orientation と Decal Sizeを適用しましょう。
(Decal Sizeが見つからないときはパラメータのパーティクル属性の中から検索すれば出てきます)

ここでデカールの大きさと向きを決定しましょう。向きは先ほどの説明した通り、
Yに0.25の値を入れておきます。

こちらはLocal Spaceのチェックを入れておきます。

デカールのマテリアルを用意する

デカールのマテリアルを作ります

Material Domein の項目を Deferred Decal に Blend Mode の項目を、
Translucentに設定します。
ベースカラーには Decal Colorを繋ぎます。

後はオパシティに適当なテクスチャを繋いで完了。
今回はとりあえず表示できればいいので結構シンプルな構成になってます。

Niagaraに戻ってこのマテリアルを適用しましょう。

これでNiagaraシステムの一通りの作業が終わりました。

ブループリントの設定

先ほどNiagaraで設定した、コリジョン、向き、位置を参照する設定を施しています。

Spawn System at Locationを出して、ビームエフェクトのNiagaraシステムを設定します。
その後、Set Niagara Variable By String(Object) を出して繋げます。
In Variable Name の所には先ほど作ったユーザーパラメータの名前を正確に入力します。

次に実装インターフェースの『追加』を押しNiagara Particle Callback Handlerを選びます。
マイブループリントのタブの中にReceive Particle Dataという項目ができるので、
それをダブルクリックすると専用のイベントノードが出てきます。

Spawn System at Locationをもう一つ出して、Receive Particle Dataのイベントノードと
繋がるようにしましょう。これでパーティクルのコリジョンに反応してデカールが
出現するようになりました。

後は画像のようにノードを色々つなぎ合わせてビームエフェクトの出すパーティクルの向きと
デカールの向きが合致するようにしていきます。

これで一通り完成。マップにブループリントを配置してみましょう。

結果は…

上で制作したブループリントをマップに配置しました。角度を変えても問題なく
ビームが当たった場所にデカールが出現していますね。これにて完成です。

マテリアル次第で様々な応用が利くと思います。是非、色々と試してみてください。

https://youtu.be/STN04_BdcYM

Discussion

ログインするとコメントできます