『呪術廻戦 ファントムパレード』の「夢幻廻楼」背景演出について、サムザップが技術ブログで解説。無限に続く塔、天候の変化を表現する方法とは

サムザップは2024年6月24日（月）、『ファンパレ「夢幻廻楼」技術の裏側 ~ 天候変化編~』と題した記事を、自社エンジニアブログ「Sumzap Engineering Blog」にて公開しました。

（画像はブログ記事より引用）

同記事では、スマートフォン向けゲーム『呪術廻戦 ファントムパレード（以下、ファンパレ）』内のコンテンツ「夢幻廻楼」を主題に、Unityを用いた「無限に登れる塔×天候変化を実現する仕組み」「塔の背景だけを歪ませる表現」について解説しています。

「夢幻廻楼」は、塔の各階層で発生する戦闘をクリアし、上層を目指すコンテンツ。上層に行くほど敵が強くなり、定期的な階層追加も予定されています。

そのような要件を満たせるよう、強敵の気配を表現するために特定の階層を超えた際に天候を変える仕組みと、どこまでも登れる塔を表現する仕組みを実装したといいます。

「夢幻廻楼」ゲーム画面（画像はブログ記事より引用）

まず無限に登れる塔を表現するために、塔や空、エフェクトの一部をひとまとまりのブロックとして制作し、ブロックを積み上げれば塔になるようにしています。

各アセットは切れ目を曖昧にし、違和感なくつながるようデザインされています。

1ブロック分の塔（左）と、2ブロックを積み重ねた塔（右）（画像はブログ記事より引用）

また、パフォーマンス維持のため、ブロックは見える範囲だけ生成し、カメラの移動に合わせて適切にブロックを瞬間移動させています。

（画像はブログ記事より引用）

天候の変化は、ライトマップやカラーマップ、パーティクルなどを天候ごとに用意し、テクスチャの切り替えで表現。

特定の階層では、シームレスな天候の切り替えを行うためにブレンディングで対応しています。

記事では、ライトマップのブレンディングを「あまり一般的ではない」とし、実際に開発したカスタムシェーダーのコード例とともに紹介しています。

テクスチャの一部。天候は、夕焼け（左）と夜（右）（画像はブログ記事より引用）

「夢幻廻楼」上層では、強敵の気配を表現するため、塔の背景を歪ませる効果も追加しています。

この効果には、「NOVA Shader」のDistortion機能を一部導入して実装しています。ただし、この機能だけでは「Distortionの処理に塔の一部が巻き込まれてしまう」課題が発覚したとのこと。

塔そのものの歪みはないものの、右側のパイプのようなオブジェクトに歪みが適用されてしまっている（画像はブログ記事より引用）

この課題に対し、Distortionによるフレームバッファから塔が描かれている範囲のマスク画像を取得してぼかし、ぼかしたマスク画像をもとに塔周辺の画素の歪みの強度を下げる形で解決しています。

また、歪みの強度の調整に関しても、コード例とともに解説が行われています。

内容の詳細は、Sumzap Engineering Blogのブログ記事をご確認ください。