PIGIAMA KASAMAはいかにしてウェブゲーム笠間の218MBを削減したか：覚醒

笠間The Awakening は、PIGIAMA KASAMAが制作したエピソード形式のストーリー主導型ウェブベースのアドベンチャーゲームである。このゲームをウェブ用に作成するために、チームは、高いビジュアル忠実度を維持しながら、デバイス間のパフォーマンスを最適化する必要がありました。彼らがどのようにビジョンを実現させたかを紹介しよう。

スタジオはどのようにしてウェブ上で視覚的に魅力的で感情移入しやすい体験を提供するのだろうか？

ピギアマ・カサマ・チームは、他のブランドのゲームを2年間制作した後、オリジナリティのある物語主導のゲームならウェブ上で観客を見つけられると確信した。笠間ながら：The Awakening VRとデスクトップの格闘ゲームとしてスタートした彼らは、ゲームをエピソード形式のパズル・アドベンチャーにアレンジすることを決めた。

Kastaniaを体験していただくために、デスクトップ・ブラウザーでお楽しみいただけるゲームを以下に埋め込みました。モバイルでは、Spatialのアプリをご覧ください。

長年Unityを開発してきたスタジオの創設者であるMatteo FanchinとParide Stellaは、創作の自由度、高いビジュアルフィデリティ、優れたプレイヤー体験、マルチプラットフォームのサポートなど、同じような優先順位を共有するプラットフォーム開発とローンチのパートナーを見つけたいと考えていました。

「私たちは、Spatialがユーザー生成コンテンツ（UGC）の究極のプラットフォームであることを発見しました。Unityのプロセス簡略化能力と、プレイヤーに与えるアクセシビリティ、そしてUnityで構築する際の柔軟性を組み合わせることで、ウェブゲームのオーディオ、ビジュアル、エクスペリエンスの限界に挑戦することができました」とファンチン氏は語る。

空間チームは、PIGIAMA KASAMAチームがコラボレーションにもたらした価値を高く評価している。ジェイク・スタイナーマンは、「我々は、クリエイターがウェブ、モバイル、VRで本当に高品質な体験を提供できるようにプラットフォームを構築した。笠間の初期ビルドを見たとき：The Awakening 、チームが行った他の仕事も含めて、われわれはそれを支援しなければならないと思っていた」。

現状への挑戦

PIGIAMA KASAMAチームには創造性、専門知識、そしてユニティとスペイシャルのサポートがあったにもかかわらず、彼らのビジョンは多くの課題をもたらした。主な障害の1つは、高いビジュアル忠実度を維持しながら、デバイス間のパフォーマンスを最適化することでした。「WebGLの制限により、グラフィックやゲームプレイの仕組み、全体的なユーザー体験の実装方法において革新的であることが求められました」とステラは説明する。

彼らのビジュアルとパフォーマンスの期待に応えるためには、品質を犠牲にすることなく、ビルドサイズを圧縮する必要があった。彼らはこれを実現するために、ユニバーサルレンダリングパイプライン（URP）、シェーダーグラフ、Unityのアニメーションシステム、ビルトインアニメーション圧縮を選択した。

成果

• ゲームのテクスチャメモリを264MBから140MBに削減。
• メッシュの頂点数を550,000から351,000に削減。
• オーディオ・メモリを86MBから9MBに削減
• UIのスプライトサイズを45MBから28MBに縮小
• ユニークな素材の使用数を75から57に削減
• ローエンドデバイスにおいて、開幕時の4fpsから最低30fpsまでパフォーマンスが向上。
• 発売から7週間で8万回以上の再生回数を記録

限られた資源を最大限に活用する

彼らのデザイン・アプローチは、当初からリソースの制限に細心の注意を払いながらも、自分たちの判断でビジュアル・フィデリティを増減できる柔軟性と帯域幅を持つことだった。コンピューティングパワーとメモリの制限が最大の課題となり、パフォーマンスを維持するために、テクスチャの解像度を下げざるを得なかった。「最高級のテクスチャーを最も目につくところに配置しました」とステラは言う。

チームは可能な限り最小限のリソースしか使わず、そのアプローチがすべてに影響した。ポリゴンを少なくし、テクスチャサイズを小さくして、マテリアルの数をできるだけ制限した。また、ジオメトリの頂点情報に対応する2次元テクスチャ座標であるUVも最適化された。

「カメラの動きは既知であり、非常に制限されているので、テクスチャリング処理の前に、すべてのジオメトリに対して積極的なオクルージョンカリングを行い、すべてのポリゴンとピクセルが最大限に使用されるようにしました」とファンチンは言う。"この処理により、Unityは、視界から完全に隠されたGameObjectのレンダリング計算を行うことができなくなります。"

アニメーションもまた、チームがサイズを削減した分野だ。彼らは、Unityのアニメーションシステムのヒューマノイドアニメーションタイプと、Mecanimアニメーションリターゲットシステムを使用しました。さらに、Unityに内蔵されたアニメーション圧縮処理により、プロジェクト内のアニメーション全体の重量を減らすことで、パフォーマンスを最適化することができました。これは特に、細かすぎて重くなりがちなキャラクターの顔の演技のモーションキャプチャー・アニメーションを減らすのに有効だった。

光を見つける

ライティングの良し悪しで、すべてが変わってくるのですが、ウェブゲームでそれを実現するのは難しいのです」とステラは言う。照明もゲームプレイのメカニクスの鍵を握っていた。チームは緊張感を演出し、プレーヤーの動きを誘導し、ゲーム内の重要なエリアやオブジェクトを強調するために使用した。ダイナミックなエフェクトが物語の重要な場面や転換を強調した。

「ベイクド照明をできるだけ使いたかった。これは、通常はそのような忠実度を提供しないプラットフォームで、高品質の照明の知覚を与える方法です」とファンチンは言う。

チームの最も複雑な課題の1つは、シーンロードなしで環境内の照明を移行させ、照明が点灯したときにダイナミックな照明の変化を作り出すことでした。彼らは、ライトマップをリアルタイムで操作するカスタムシェーダーを使い、すべてをフラットにし、ダイナミックな光のイリュージョンを与えた。そのためには、ゲームデザインと環境デザインを切り離すのではなく、全体のプロセスとして行うことが重要です」とステラは説明する。どの要素も他の要素に奉仕する必要がある。

彼らはShader Graphを使ってカスタムシェーダーを開発し、チームが "ナイトメア・シークエンス "と呼ぶシーンで特に役立った。黒い滲み液でマップを覆い、同時に照明を中和して環境を白黒にする。

「プレイヤーがライトを点灯させると、シェーダーはこの効果を反転させ、ライトが点灯しているように錯覚させ、照らされた領域から黒い滲出物を取り除きます」とファンチンは言う。

このカスタムシェーダーは、大量の栗が爆発する別の章でも非常に役に立った。栗を個々のエンティティとして扱うのは非現実的だったので、1つのメッシュとしてグループ化し、シェーダーを使って揺れと爆発を管理した。

それぞれの栗はUVグリッド上に左から右へとマッピングされ、爆発の順番に対応している。シェーダーは、あらかじめ定義された栗のグループをインデックスで選択し、別のスクリプトは、栗が爆発しそうな正確な位置にパーティクルシステムの爆発を配置する。

「このアプローチにより、大量のジオメトリと複雑なダイナミクスを効率的に管理することができ、パフォーマンスに過負荷をかけることなく、ウェブのパフォーマンス要件に準拠することができました」とステラ氏は説明する。

ビルドサイズに制限があるため、パフォーマンスを向上させるために芸術的な選択も行った。彼らは要素を隠すために暗い部分を使うことを選んだ。これにより、ポリゴン数とスキンメッシュを最適化することができた。「明るい部分にディテールを加えました」とファンチンは言う。

オーディオ制作パイプラインの管理

サウンドデザインは、ゲームプレイのテンポから環境やインタラクションのデザインに至るまで、あらゆるものに影響を与え、ストーリーへの感情的なつながりを深めながらプレイヤーを導きます。PIGIAMA KASAMA』チームは、各エピソードの雰囲気やペースに合わせたサウンドトラックを制作し、プロデュースした。彼らはまた、ナレーション・アーティストと協力し、言語を発明するために言語学者を雇った。彼らの目標は、ゲームの没入感を高める聴覚体験を作り出すことだった。

"体験や製品に悪いオーディオがあると、必ずそれを耳にする。オーディオが良ければ、それは目に見えない」とステラは言う。

彼らは、ゲームに実装する前に、オーディオ制作のための厳格な3段階の技術的プロセスを実行しました。

ステージ1：オーディオクリップの統一とミキシング／マスタリング

最初の段階では、複数のオーディオクリップ、特にアンビエントサウンドスケープやゲームのサウンドトラックのようなループサウンドを統一する必要がありました。このプロセスは、特定のワンショットのサウンドエフェクトにも及び、レイヤー化され、単一のトラックに統合された。これらの修正はミキシングとマスタリングの段階で統合され、統一されたクリップが異なる再生環境でもオーディオダイナミクスの一貫性と全体的なバランスを保つようにした。この段階は、特にゲーム内でシームレスに移行する必要があるループシーケンスにおいて、矛盾を最小限に抑え、まとまりのある聴覚体験を確保するために極めて重要だった。

ステージ2：最適化された圧縮規格へのフォーマット変換

第2段階では、オリジナルのハイファイ・オーディオ・ファイル（通常はAIFFとFLAC形式）をOGG形式に変換した。サンプル・レートは48kHz、ビット深度は16ビットで、オーディオ品質とパフォーマンス効率のバランスを保つための業界標準に準拠している。Vorbis圧縮コーデックを使用することで、知覚的な音質を損なうことなくファイルサイズを大幅に縮小することができた。

ステージ3：ユニティの実装と微調整

最終段階では、処理したオーディオファイルをUnityに統合した。これには、ゲームプレイ中のパフォーマンスを最適化するために、適切なローディング方法（例えば、長い曲のストリーミングや重要なサウンドエフェクトのプリロードなど）を細心の注意を払って選択することも含まれます。チームはVorbis圧縮の設定を微調整し、オーディオの忠実度とリソース利用のバランスを取った。

さらに、特定のオーディオファイルをモノラルで扱うかステレオで扱うかについては、サウンドデザインにおける役割やゲーム内で望まれる空間演出効果に基づいて慎重に判断されました。

最終段階で実施された厳密な最適化プロセスにより、ストレージとパフォーマンスが大幅に向上した。OGGフォーマットを活用し、圧縮設定を調整することで、オーディオ資産は合計で約10MBに圧縮された。これは、非圧縮のAIFFファイルを使用した場合の推定500MBや、MP3相当ファイルの100MBに比べ、大幅な削減となる。この結果、ゲーム全体のサイズが最小化されただけでなく、ゲームプレイ中の効率的なメモリ使用とスムーズなオーディオパフォーマンスが確保された。

複数のプラットフォームへの展開

マルチプラットフォームでのウェブリリースにおいてSpatial社と提携することで、PIGIAMA KASAMAチームは、プラットフォームが選択するパイプラインであるURPを採用した。15年のCGI経験を持つデザイナーとして、ステラは多様な目的のために多くのツールを使い、URPの能力に感銘を受けた。

「URPは素晴らしい。笠間との目的を達成するための使い方はすぐに覚えた：覚醒.私が考えていたことはほぼすべて達成できたと思う。

レンダーパイプラインの柔軟性と効率性は、ウェブプラットフォームにデプロイする際にチームにとって特に重要でした。

「また、開発者は独自のシェーダーを使用することができます。将来的にうまくいくように作られている」とスタイナーマンは説明する。"Spatialプラットフォームの観点からは、Unityの将来のバージョンをサポートし始めるにつれて、URPもサポートされることを期待しています。"

Spatialのサーバーは個別のビルドを作成し、各プラットフォームを最適化した。彼らはPIGIAMA KASAMAチームのWebGLビルドや、AndroidとネイティブiOS用のビルドを手伝ってくれた。プラットフォームによってターゲットとする品質が異なるのだ。

「被写界深度は、WebGL上ではかなりうまく動作しますが、一部のモバイル機器ではパフォーマンスが低下することがわかりました。一方、AndroidやiOSのオーディオは、より高性能です」とファンチンは言う。"フィルターやEQ（開発者がオーディオソース内の特定の周波数の音量レベルを調整できるオーディオツール）をAndroidでもっとうまく使うこともできたが、WebGLではうまくいかなかっただろう。"

ある要素については各プラットフォームに適合するようにチューニングし、他の要素については各プラットフォーム専用に調整した。「WebGLでは、一般的に画面が大きいので解像度の高いテクスチャを使い、モバイルの小さな画面では解像度の低いテクスチャを取り入れました。全体として、マルチプラットフォームのリリースはかなりシームレスでした」とステラは結論づける。

選手を旅に巻き込む

ウェブゲームを作ると決めた後、PIGIAMA KASAMAチームは、高品質のコンテンツを管理しやすい分量で開発する方法を見つける必要があった。エピソードごとにプレイヤーのフィードバックを集め、それを今後の作品に反映させることができる。また、テストと反復を非常に迅速に行うことができた。

「私たちは、選手からのフィードバックや新しい技術に基づいて開発プロセスを調整できるよう、柔軟なロードマップを確立しました」とステラは説明する。「各エピソードは将来を見据えて計画されており、物語やゲームプレイの仕組みが時間の経過とともに自然に進化するようになっている。

このリリーススケジュールを選択したことは、複数の課題をもたらした。チームは、クオリティとストーリーテリングの両面で、エピソード間の一貫性を確保する必要がある。エピソード・リリースの場合、プレイヤーを満足させるのに十分なコンテンツを提供しつつ、次回作への興味を維持させるという微妙なバランスが求められるため、プレイヤーの期待値を管理することもハードルになりうる。

全体として、チームは多くのことを学び、この知識を第2話に生かすことに興奮している。「開発者がWebGLのために構築できる体験の質の高さを紹介し続けられることを誇りに思います」とファンチンは言う。"小さなスタジオなので、Unity 6やWebGPUのような技術的な進歩で何が達成できるのか楽しみです。"

Unity 6で広がる可能性

Unity 6 は、あらゆる環境のプレイヤー向けに、ゲームを迅速かつ簡単に作成できるようにすることを目的としています。Unity Hub で Unity 6 をダウンロード。