［UEFN］『Monkey Train』開発ブログ -その2- Niagaraを用いたアニメーションを伴うスコア獲得UIの実装

こんにちは、ヒストリアUEFNチーム『SLASHH』です。

前編の記事（『Monkey Train』開発ブログ -その1-）では、『Monkey Train』での大量の破壊オブジェクトを管理する方法を解説しました。
今回はアニメーションを伴うスコア獲得UIの実装方法を紹介します。
※UEFNでエフェクトシステムとして使用されているNiagaraシステムを利用した方法です。（Niagara の概要 | Epic Developer Community (epicgames.com)）

【SLASHH：UEFNタイトル第五弾】
ウキウキッ！協力トロッコパズルアクション『Monkey Train』

https://historia.co.jp/archives/38995/

マップコード：1860-3688-7161

■Niagaraを用いたアニメーションを伴うスコア獲得UIの仕組み

『Monkey Train』では鉱石がダメージを受けるたびに得点を加算し、同時にスコア獲得UIを表示しています。

このように、UIがプレイヤーの頭上に浮き出るアニメーションは、残念ながら現時点のUEFNではなかなか実現が難しいものとなっています。そこで、今回はNiagaraシステムによる疑似的な表現でこれを代用することにしました。

これは実際にゲーム内で使用されているNiagaraアセットのひとつです。

パーティクル自体の透明度やポップする動きなどはカーブによって直接指定して作成

パーティクルは3D空間上にポップするものですが、常にカメラ方向を向くように設定されているので、UI的な見た目として見せることができます。

Sprite Renderer→Facing Modeを「Face Camera」にすることで、常にカメラ方向にパーティクルが向くようになる

開発当初はNiagara自体を直接スポーン（生成）する仕組みはなかったため、NiagaraコンポーネントをアタッチしたBuilding Propアセットを作成し、これをスポーンさせることで代用しています。

■Building Propスポーンに伴うパフォーマンス低下を抑える仕組み

Building Propを使用する手法には1つ気を付けるべき点が存在します。ゲーム内で鉱石を攻撃するたびにBuilding Propは延々スポーンさせ続けるため、その都度破棄しないとマップに残り続けてゲームのパフォーマンスに影響してしまうのです。

鉱石が攻撃された時、どのようにスポーン→破棄までの処理を行っているのか、具体的な流れを説明します。

まず、鉱石が攻撃されると小道具操作機がそれを感知し、イベントが送られてきます。
送られてきたイベントは攻撃したプレイヤーの情報を返してくれるため、どのプレイヤーが鉱石を攻撃したのかが判明します。
この情報を利用して内部的な点数の加算を行い、同時に表示されるBuilding Propをプレイヤーキャラクターの頭上の位置にスポーンさせます。

Building Propがスポーンされると、同時に破棄用の非同期処理が開始されます。これはスポーンしたBuilding Propを引数として受け取り一定時間後に破棄(Dispose)するものです。
この処理により、Building Propはマップに残されることなく破棄され、パフォーマンスが低下しづらくなっています。

開発当初、Niagaraシステムを任意にスポーンさせる方法は上記の手法しかありませんでした。しかし、現在ではアセットを指定して直接スポーンさせることができるVerse APIが追加されています。

こちらを使用すれば、わざわざBuilding Propを作成したり、非同期処理で破棄したりといった手間はなくなり、APIを1行書けば済みます。今後は基本的にこちらの方法を使う方がいいでしょう。

ただし、Building Propを使用した方法にもまだ利点は存在しています。Building PropはVerseで位置を操作できるため、「パーティクルを出したまま任意の位置や角度に変更したい」という要求を満たすことができるのです。

例えば上の動画のような動きをさせたい場合はBuilding Propによる手法が有効

Niagaraはただ単にパーティクルを大量に出すのも楽しいですが、工夫すれば意外な表現を実現できます。思うような表現ができなくて困っている時は、Niagaraの使用を考慮に入れてみるのもいいかもしれません。

■まとめ

小道具操作機の配置やBuilding Prop回収といった工夫により、『Monkey Train』は特徴のあるビジュアルを保ち、かつパフォーマンスやメモリは許容内に収まりました。

これらはUEFNで

数種類の破壊可能オブジェクトを大量に配置したい
アニメーションを伴うUI表現をしたい
しかし、パフォーマンスは確保したい

という場合に何かしらの参考になるかもしれません。

ぜひご活用ください。