ウェブゲーム制作のための5つの基本

モバイルマーケットプレイスのダウンロードやアカウントのサインアップのような障壁なしに、プレーヤーに迅速でアクセスしやすいゲーム体験を提供することを想像してみてください。ブラウザを通じて、あるいはウェブビューを通じてネイティブアプリケーションに組み込んで、あらゆる場所でプレーヤーと出会うことができる。

最近、私たちはウェブプラットフォーム、特にモバイルにおけるプレーヤーのエンゲージメントが急上昇していることを目の当たりにしており、その傾向は衰える気配がありません。2023年、世界のブラウザゲーム市場は約150億3000万米ドルの収益を上げた。コンソールゲームとモバイルゲームのジャンルが成長しているにもかかわらず、2028年には、このセグメントの年間売上高は223億3,000万米ドルに増加すると予測されている。

この総合的な電子書籍は、クリエイターを目指す人からベテランの開発者まで、Unity Webを使用してパフォーマンスの高いWebゲームを構築するための5つの基本を掘り下げて理解するのに役立ちます。レディ・セット・クック！』や『笠間』といった人気タイトルの舞台裏も紹介されている：The Awakening、SquadBlast、Project Prismaticがウェブ上で実現した。

以下の見識をカバーしている：

1.プランニングとプロトタイピングの優先順位

2.ダイナミックなUIの構築

3.まとまりのある視聴覚体験を創造する

4.最適化する。最適化する。最適化する。

5.複数のウェブ・プラットフォームを受け入れる

1.プランニングとプロトタイピングの優先順位

ウェブプラットフォームの重要な利点のひとつは、世界中のプレーヤーとゲームを共有できるスピードです。しかし、素晴らしい体験を保証するためには、ゲームをしっかりとしたデザインの土台の上に構築する必要があります。

ビジョンを描く

明確なビジョンを設定することは、開発プロセスを通じてチームを導くのに役立つ。ストラットン・スタジオは、パフォーマンスとビジュアルフィデリティの両方の観点から、ブラウザベースのゲームで達成できることの限界を押し広げたいと考えていました。彼らの目標は、ウェブ環境の中で従来のプラットフォームに匹敵するクラス最高のプレーヤー体験を提供することだった。

「ストラットン・スタジオのマネージング・ディレクター、ジョシュ・ロヴァリッジは言う。「このビジョンは、プロトタイピングとイテレーションの間、私たちの足並みをそろえ、開発全体を通して一貫した、目的にかなった選択をする助けとなるものでした。

ゲーム制作の最初のステップは、特にターゲットとしていたミドルレベルのハードウェアの制限を考えると、確かなパフォーマンスを維持しながら、彼らが思い描く鮮やかな環境を実現できるようにすることだった。これが、その後のゲーム開発のための強力な技術的基盤となった。

「まず、描画距離を大きくとったテストシーンを作り、ゲームの美学にとって重要な、鬱蒼とした葉、変化に富んだ地形、複雑なディテールをレンダリングできるかどうかを評価しました。"新しいWebGPUグラフィックスAPIを活用して、私たちはシーンをテストし、私たちが望むようにみずみずしく見えるだけでなく、さまざまなデバイスでうまく動作することを確認しました"

最初からテスト

ULTRAHORSEチームは当初、主要なゲームプレイメカニズムの開発に注力した。彼らは、ラン＆ガンの横スクロール型マルチプレイヤーシューティングゲームという側面を、楽しく魅力的なものにするために釘付けにしたかったのだ。彼らは基本的な感触を正しく得るために、より大きなスクリーン、コンソール、PCから始めた。

「そこから選手テストに素早く移った。初期ベータ版のビルドでも、Antidoteのようなサービスや、ロンドンで開催されたWASD Expoのようなイベントでの初期ベータ版を通じて、オンラインでプレイヤーの前に公開しました。「これにより、コアとなるメカニズムを検証し、何が有効で何が有効でないかについてのフィードバックを即座に得ることができました。

PIGIAMA KASAMAチームは、ラピッドプロトタイピングとアイデアの早期テストのアイデアを支持している。笠間の誕生：The Awakening 、キャラクターを定義し、物語のアウトラインを書くことから始まった。彼らはストーリー、主人公、ゲームプレイが深くつながることを望んでいた。彼らはまずGravity Sketch VRでシンプルな3D環境を作り、それをUnityに移してメインのパズル・メカニズムを構築し、テストした。

この実践的なアプローチによって、彼らはメカニックに多くの時間を費やす前に、そのメカニックがうまく機能するかどうかを確認することができた。メカニックとストーリーに自信がついたところで、彼らはこのゲームをパズル・アドベンチャーにすることに決めた。

「チームがインタラクションが機能すると確信できるまで、テスト中に何度も反復する。コアとなるゲームプレイに釘付けになった後、コンセプトアートに移り、ゲームのストーリーと全体的な雰囲気に沿ったものにしました」とPIGIAMA KASAMAの共同設立者であるParide Stella氏は語る。

障害への適応

ゲーム開発ではよくあることだが、ストラットン・スタジオは、技術的な制約にぶつかったり、プロトタイピング中により良いアイデアを発見したりしながら、当初のビジョンを調整していった。

「最良の結果を得るために改良を重ねることは、クリエイティブなプロセスの一部である。例えば、レベルデザインに関わる重要な変更がありました」とLoveridge氏は説明する。「当初は、もっとオープンでフリーフォームな環境を想定していたのですが、作業を進めていくうちに、このアプローチでは、私たちが実装しているヘックスタイルオクルージョンカリングシステムと効率的に機能しないことが明らかになりました」。

パフォーマンスを維持するため、特にウェブベースの環境では、画面上のトポロジーを大幅に減らすことでレンダリングプロセスを最適化した。このため、彼らはレベルデザインをヘックスタイルの象限に再構築し、視認性と淘汰をよりよく管理できるようにした。これによりゲームプレイが改善され、さまざまなデバイスでゲームがスムーズに動作するようになった。この調整は、彼らのクリエイティブなビジョンと技術的なパフォーマンス要件のバランスを取る上で極めて重要だった。

優れたプランニングは、開発中に発生する課題の影響を軽減するかもしれないが、それで道のでこぼこを完全に防げるわけではないことを心に留めておくことが重要だ。

2.ダイナミックなUIの構築

ウェブはあらゆるゲーマーにリーチできる最もアクセスしやすいプラットフォームだが、すべてのブラウザが同じように作られているわけではない。画面サイズの違い、横向きと縦向きの違い、ゲームをホストするアプリのUIへの配慮などは、ゲームのUIをデザインする際に留意すべき点です。

選手の経験を最優先

コアシンクのチームが『Ready, Set, Cook！』の開発を始めると、すぐにUIに考慮しなければならないことがたくさんあることに気づいた。初期段階では、プレイヤーとそうでないビデオ通話ユーザーの両方が参加できるようにすることに気を配っていました。チームは、プレイヤーを常にオンラインに保ちながら、他のユーザーにもポジティブな観戦体験を提供するため、既存の観戦機能を改良する必要がありました。

「Coatsink 社のジュニア・デザイナー、Kamil Bazydlo 氏は、「観戦体験は、ゲームの他の側面をデザインする際にも、常に念頭に置いていました。「他のプラットフォームのゲームジャンルでは一般的な機能ではありませんが、プレイヤーはビデオ通話をしているため、ゲーム全体を通して包括的なユーザー参加を強調することが重要でした。

チームは早い段階から画面の向きにも注目していました。このゲームはもともとデスクトップ向けに作られたため、横向き画面を前提に作られています。同社がモバイルに移行したとき、横向きと縦向きの両方の表示をサポートする必要がありました。Messenger ではビデオ通話中なので、プレイヤーはスマートフォンを持つ向きに画面を向けます。そのためスマートフォンを回転させるとカメラが横向きになってしまい、理想的ではありません。「コアシンクのプログラミング責任者であるロス・ファーミッジは言う。

UIの課題を克服する

ULTRAHORSEチームが直面した最大の課題の1つは、マウスとキーボード、コントローラー、タッチスクリーンのどれを使っても同じように楽しめるゲームプレイ体験を作り上げることでした。これは、真のクロスプラットフォームゲームを構築するという彼らのビジョンにとって極めて重要なことだった。

「当初、私たちはさまざまなゲームスタイルを試してみましたが、多くの伝統的なシューティングゲームのフォーマットは、他のものより一つの入力方法を好むことがわかりました。こうして『SquadBlast』の横スクロール・シューティングというフォーマットにたどり着いたのです」とロポトフスは言う。"私たちは、2Dプレーンであれば、マウスを使った正確な照準、コントローラーを使った直感的な動き、そしてモバイル機器でのシンプルで分かりやすいタッチ操作が可能であることに気づきました。"

チームがPCからモバイル・ウェブ開発に移行する過程で、予期せぬ課題が浮上した。当初、彼らはUXにホバー・マウスの要素を取り入れた、完全に洗練されたPC体験を開発した。これにより、大画面と正確なマウス操作を生かした、リッチで詳細なインターフェイスを作成することができた。ツールチップやホバーステート、より複雑なメニュー構造を使って、プレーヤーに情報やオプションを伝えていた。

そのため、どのような情報をどのように見せるかについて難しい決断を迫られた。チームは、PCでうまく機能するホバー状態や複雑なツールチップに頼ることができないため、UIをより分かりやすくする必要があった。すべての要素が一目で理解できるものでなければならず、そのためにビジュアル言語と図像を洗練させる必要に迫られた。

スクリーンスペースに応じた調整

ULTRAHORSEチームは、タッチ入力を中心に設計する際にもハードルにぶつかった。PCでは正確なカーソルコントロールが可能だが、モバイルでは精度の低い指のタップや誤クリックの可能性を考慮しなければならない。そのため、タッチターゲットを大きくし、UI要素間の間隔に余裕を持たせ、一度に表示できる情報量をさらに減らした。

彼らはまた、スケーラブルで柔軟なUIコンポーネントの重要性も発見した。モバイル・デバイスのサイズやアスペクト比が多様であるため、UIをさまざまな画面構成やDPIにスムーズに適応させる必要があった。そのため、利用可能な画面スペースに応じて自動的に調整できる、より堅牢なUIシステムを開発することになった。このシンプル化プロセスをモバイルウェブにも活用することで、すべてのプラットフォームでSquadBlastのUIを改善することができました。

ゲームコントロールの再考

『Ready, Set, Cook!』は画面サイズやアスペクト比の異なるさまざまなデバイスでプレイできますが、Meta のビデオフィードやプラットフォームコントロールなどの要素にスペースを割り当てているため、ゲームのビューポートが画面全体に広がることはありません。これらはゲームアプリケーションの一部ではないので、開発者がゲームに取り組んでいるときに Unity エディターに表示されることはありません。

「画面に UI 要素を配置する際には、そのことを考慮しなければなりませんでした」と Bazydlo 氏は言います。「私たちは、これらのプラットフォーム要素にどれだけの画面領域が取られているかを大まかに把握し、QA チームと協力して、ターゲットとする最も狭いアスペクト比を特定しました」。

モバイルの場合、デバイス固有のコントロールは画面の下端にあります。このゲームは横向きの画面を念頭に置いて作られているため、チームは画面の下の部分を重要なゲームプレイの入力用ではなく、HUD 要素を表示するために使用しました。

このタイトルがアメリカでソフトローンチされたとき、チームはいつプレイヤーがゲームを離脱するかを割り出す重要な機能として、アプリケーションに直接アナリティクスを組み込みました。そしてチームは早い段階で、ゲームの読み込みが終わらないうちにユーザーが離れていくことに気づきました。

「ロビーにいるユーザーに、メニューの情報量がやや過多で、ゲームに入るまでのフローが長すぎると思われてしまうと、すぐに離脱されてしまうことがわかりました。ゲームに入ったとたん、大半のプレイヤーがそのままプレーを続けてくれました」と Furmidge 氏は言います。「これは私たちにとって有益なデータでした。アナリティクスは私たちの意思決定の多くに大きな影響を与えました。」

3.まとまりのある視聴覚体験を創造する

高度なグラフィックスとダイナミックオーディオを活用することで、クリエイターはブラウザに必要な最適化に関係なく、ゲーム体験を向上させることができます。言うは易く行うは難しで、一般的なボトルネックを注意深く考慮しなければならないが、技術が進化するにつれ、ウェブにおける高いビジュアルとオーディオの忠実性の可能性は、これまで以上に有望視されている。

より複雑なグラフィックを実現

ストラットン・スタジオのチームは、高いビジュアル・フィデリティと詳細な環境を備えたゲームを作ろうとしていた。これには、WebGLが提供できる以上のグラフィックパワーと柔軟性が必要だった。

「WebGLは高性能ではありますが、パフォーマンス上のボトルネックや、コンピュート・シェーダーやGPUスキニングの欠如といった制約があります。

より高度なシェーディング、ライティング効果、コンピュート・シェーダーによる複雑なテクスチャなど、はるかに高いレベルのグラフィックの複雑さを実現するために、彼らはWebGPUへの移行を決めた。これによって、高密度で緑豊かな環境をレンダリングし、ブラウザでも一貫して高いフレームレートを維持できるようになった。

デバイスのグラフィックカードをさらに活用できるWebGPUの強化された性能は、彼らが思い描くリッチで没入感のある体験を提供するために不可欠であり、プレイヤーは通常デスクトップやコンソールゲームにしかないレベルのディテールとスムーズさでゲームを楽しむことができます。

パフォーマンスとWebGPUの管理

WebGPUは、ストラットン・スタジオ・チームが必要とする高度な機能を提供する一方で、彼らの芸術的なビジョンを維持するために対処しなければならないユニークな課題も提示した。主な課題のひとつは、幅広いデバイスでパフォーマンスを最適化することだった。WebGPUはまだ比較的新しいため、一貫したパフォーマンスと互換性を確保するためにはかなりの微調整が必要で、いくつかのフェイルセーフを組み込んだ。

もうひとつの課題は、シェーダーとレンダリング技術の複雑さを管理することだった。「WebGPUは、GPUスキニングやコンピュート・シェーダーのような、より洗練されたレンダリング技術を可能にする一方で、注意深く扱わなければ、パフォーマンスのボトルネックになる可能性もある。「フレームレートの低下や、ガベージコレクション（GC）スパイクのようなその他のパフォーマンス問題を引き起こすことなく、高品質のビジュアルを提供できるようにするために、シェーダーを綿密に最適化し、効率化する必要がありました」。

WebGPUは比較的新しいため、特に一般的でないハードウェア構成では、ランダムな黒い画面やNaNピクセルのブルーム肥大化など、チームにとって予期せぬ挙動を引き起こすことがあった。これを克服するため、彼らはデバイスやブラウザを横断した厳密なテストに特別な時間を投資し、プラットフォームに関係なく、ゲームが一貫して機能し、意図したとおりに見えるようにしました。

「このような課題に対処するため、堅牢なパフォーマンス・モニタリング・システムを導入し、開発中にリアルタイムで問題を検出して対処できるようにしました」とロヴァリッジは言う。"WebGPUのおかげで芸術的なビジョンを達成することができましたが、それには慎重な管理と、ウェブテクノロジーの最先端で働くことに伴うハードルを押し切ることへのコミットメントが必要でした"

光を見つける

「良いライティングはすべての違いを生みますが、ウェブゲームで実現するのは困難です。

照明もゲームプレイのメカニクスの鍵を握っていた。チームは緊張感を演出し、プレーヤーの動きを誘導し、ゲーム内の重要なエリアやオブジェクトを強調するために使用した。ダイナミックなエフェクトが物語の重要な場面や転換を強調した。「ベイクド照明をできるだけ使いたかった。これは、通常そのような忠実度を提供しないプラットフォーム上で高品質の照明の知覚を与える方法です」と共同設立者のマッテオ・ファンチンは説明する。

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

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

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

リソースが限られているため、パフォーマンスを向上させるために芸術的な選択も行った。彼らは、要素を隠すために暗部を使用することを選択し、ポリゴン数とスキンメッシュの最適化に役立てた。「明るい部分にディテールを加えました」とファンチンは言う。

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

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

チームは、オーディオ制作を実施する前に、厳格な3段階の技術プロセスを実行した。

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

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

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

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

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

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

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

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

4.最適化する。最適化する。最適化する。

プレーヤーの離脱を防ぐには、できるだけ早くゲームに参加してもらい、最後まで素晴らしい体験をしてもらうことです。そのため、最適化し、テストし、さらに最適化することが重要です。

ファイルサイズの削減

ファイルサイズを削減するために、Coatsink チームはアセットバンドル（プラットフォーム固有のコード以外のアセットを含むアーカイブファイル）を使いました。チームはアセットバンドルを外部サーバーでホスティングし、ビルドが走ってユーザーをできるだけ早くゲームのロビーに入れるようにして、その裏でアセットバンドルをダウンロードするようにしました。

チームはオンデマンドでアセットの読み込みを行うために、Addressables アセットシステムも使いました。これにより、パッケージはゲーム内のさまざまな部分に必要なグループに分割され、ロード時間の25％短縮に大きく貢献した。

「こうすることで、ロビーに最低限必要なアセットが用意され、プレイヤーが早くロビーに入れるようになります。「HTTP/2 がどこでも使えるわけではないので、ダウンロードするファイルをできるだけ少なくすることが目標です。」

チームは、ユーザーがゲームを起動したときにモバイルかデスクトップかを検出するワークフローを作成しました。ウェブテンプレートでは、読み込み中にデバイスがモバイルかどうかを判断し、モバイルであれば、そのプラットフォームに最適化されたアセットを使用するようにデータとアセットディレクトリを変更することができる。

「私たちは独自のダブルビルドシステムを作り、一部共通の部分を持つ 2 つのバージョンを作りました。このシステムは異なるアトラスを参照することで、圧縮タイプと圧縮サイズの両方を変更します。つまり、コードベースは同じにしつつ、アセットのビューが 2 つあるということです」と Andrei M. 氏は言います。

ストラットン・スタジオは、開発プロセスを通じて、ファイルサイズとロード時間の両方を大幅に削減することができました。当初、彼らのゲームのペイロードは約400MBで、ウェブベースの体験には大きすぎた。

「アセット圧縮、コード分割、UnityのAddressable Asset Systemの活用など、一連の最適化により、当初のペイロードサイズを29MBに抑えることに成功しました」とLoveridge氏は説明する。

この大幅なロード時間の短縮は、Project Prismaticのロード時間を大幅に短縮するだけでなく、より多くのユーザーがProject Prismaticにアクセスできるようにし、初期ロードの高速化と全体的なプレイヤー体験のスムーズ化を実現しました。

ULTRAHORSEチームは、発売当初のダウンロードバンドルサイズを200MBから133MBに縮小した。そして、強制バンドル用の21MBとオンデマンドバンドル用の112MBに分けた。「CPUのロード時間は、当初に比べ3倍以上速くなりました」とロポトフスは言う。「プロファイリング、最適化、不要なバンドルの無効化はその大きな部分を占めていた。

ロード時間の最適化

ストラットン・スタジオは、ペイロードサイズの縮小、アセット配信の改善、ロード時間を最適化するための全体的な効率化に注力した。チームは、テクスチャ、オーディオ、その他のアセットのサイズを最小化するためにUnityのビルトインアセット圧縮を使用し、一般的なテクスチャアトレーシングを行いました。

必要でないアセットにはレイジーローディングを実装し、重要なコンポーネントを最初にロードし、必要に応じてAddressablesフレームワークを通じてバックグラウンドで追加コンテンツを徐々にロードするようにした。

同社はアドレッサブル・アセット・システムを使用して、オンデマンドで資産を効率的に管理し、ロードした。これにより、プレイヤーのゲーム進行に合わせて動的にアセットをロードし、必要なデータだけをいつでもロードできるようにした。

UnityのCloud Content Delivery（CCD）フレームワークは、地理的に近いサーバーからのアセット配信を支援した。アセットがバックグラウンドでロードされるため、待ち時間が短縮され、あらゆるプレーヤーのダウンロード時間が短縮された。

最初のロードの後、アセットがプレイヤーのデバイスにローカルに保存されるようにしたため、その後のロード時間が大幅に短縮された。チームはまた、コードをより小さく管理しやすい塊に分割し、最初のゲームプレイに必要なコードだけを前もってロードし、追加の機能やモジュールは非同期でロードするようにした。

テストおよびデバッグ・ツール

WebGPU使用時に遭遇したパフォーマンスの制限に対処するため、Stratton Studiosチームはフレームデバッガを使用して、高解像度テクスチャ、複雑なシェーダ、広範な描画距離など、最もリソースを消費する要素を特定しました。そこから、ビジュアルクオリティを大きく犠牲にすることなく負荷を軽減することを目的とした一連の最適化を実施した。

「テクスチャ・アトラスを利用してテクスチャのロード数を最小限に抑え、重要度の低い部分のポリ数を減らし、レンダリング・コストを節約するために遠くのトポロジーにマット・ペインティングを採用しました」とロベリッジは言う。「また、LOD（レベル・オブ・ディテール）技術を応用して、遠くのオブジェクトのレンダリングをより効率的に管理しました」。

主な課題は、パフォーマンスとビジュアルクオリティのバランスを取ることだった。「ゲームの最も負荷の高い部分を最適化することに集中し、Unityで利用可能なツールを賢く活用することで、さまざまなデバイスで優れたパフォーマンスを発揮する、視覚的にリッチな体験を提供することができました。"このアプローチによって、ハードウエアに関係なく、すべてのプレーヤーがアクセスしやすく、楽しめるゲームであることを保証しながら、芸術的な目標を達成することができました"

Project Prismaticをデバッグするために、チームはUnity Profilerを使用して、CPUとGPUの使用率、メモリ割り当て、フレームレートなどのパフォーマンス指標を追跡しました。これにより、パフォーマンスのボトルネックが特定され、特にリソースを大量に消費する部分において、ゲームのパフォーマンスが最適化された。

最後に、Unity Cloud Diagnosticsは、現場のユーザーからクラッシュレポートや例外を収集するのに役立った。それは、開発中に発見できなかったかもしれない問題についての貴重な洞察を彼らに提供した。

5.複数のウェブ・プラットフォームを受け入れる

私たちがスタジオの専門家から何度も何度も聞かされているヒントのひとつは、"選手がいる場所で出会う "ということだ。ウェブ用に開発することで、ゲーマーに簡単、迅速、かつアクセスしやすいゲーム体験を提供する機会が得られます。ハードウェアの選択肢が増え、接続速度が速くなり、これまで以上に多くのゲーマーがパワフルなデバイスを手にするようになった今、さまざまなウェブプラットフォームに展開するためのあらゆる選択肢を検討することが重要です。

プラットフォーム間の微調整

PIGIAMA KASAMAチームは、Spatial社とのマルチプラットフォーム・ウェブリリースにおけるパートナーシップにおいて、同プラットフォームが選択したパイプラインであるユニバーサル・レンダー・パイプライン（URP）を採用しました。レンダーパイプラインの柔軟性と効率性は、ウェブプラットフォームにデプロイする際にチームにとって特に重要でした。

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

Spatialのサーバーは、各プラットフォーム用に個別のビルドを作成した。プラットフォームによってターゲットとする品質が異なるのだ。「被写界深度は、WebGL上ではかなりうまく動作しますが、一部のモバイル機器ではパフォーマンスが低いことがわかりました」とファンチン氏は言う。「一方、AndroidとiOSのオーディオは、より高性能だ。フィルターやEQ（オーディオソース内の特定の周波数の音量レベルを調整できるオーディオツール）は、Androidではもっとうまく使えたのですが、WebGLではうまくいきませんでした」。

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

簡単にレンダリング

ストラットン・スタジオはまた、パフォーマンスと拡張性のバランスを取るためにURPを活用した。重要な機能は、カスタムレンダーパイプラインパスを簡単に作成できるURPの機能だった。この柔軟性により、チームは特定のニーズに合わせてレンダリングプロセスを微調整し、特定の視覚効果を最適化し、パフォーマンスを損なうことなくゲーム全体のルック＆フィールを向上させるカスタムシェーダーを実装することができました。

「特にURPのモジュール性を高く評価しています。ターゲット・プラットフォームの能力に応じて、特定の機能を有効にしたり無効にしたりすることができるのです。これにより、一貫したビジュアル体験を維持しながら、さまざまなデバイスにゲームを最適化することが容易になりました」とロベリッジ氏は言う。

マルチプラットフォーム・リリースの恩恵

複数のプラットフォームでゲームをリリースすることには多くの利点がありますが、計画時に考慮すべきワークフローの違いが生じます。

「SquadBlastをウェブやその他のプラットフォームで利用できるようにすることで、より多くの人々にリーチすることができます。プレイヤーは何もダウンロードしたりインストールしたりすることなく、簡単にゲームに飛び込むことができる。

配信はウルトラホース・チームにとっても重要な要素であり、ウェブ版があることで、そうでなければアクセスできなかったであろうまったく新しいチャネルの世界が広がる。

SquadBlastは当初、SquadBlast.comという独自のウェブポータルで立ち上げられた。これにより、素早く反復し、選手から即座にフィードバックを得て、迅速な改善を行うための絶好のテスト場ができた。そこからCrazyGamesのような大規模なウェブゲームポータルサイトに進出し、チームにとって大きな変化をもたらした。

「これらのサイトには膨大なリーチがあり、月間アクティブユーザー数は数千万人にのぼる。SquadBlastをこれらのポータルサイトに掲載することで、他の流通経路では決して到達できなかったであろう膨大な数の視聴者に、我々のゲームを知ってもらうことができました」とロポトフスは説明する。

チームはまた、メッセージングアプリやソーシャルメディアプラットフォームなど、ウェブゲームを埋め込む他のプラットフォームとの機会も見ている。ロポトフスが言うように、"ここでの潜在的なリーチは驚異的であり、Unity 6でモバイルウェブ技術の最適化が大幅に改善されたことで、ゲームを組み込むためのまったく新しい世代のプラットフォームが解放される"。

まとめ

このe-bookでは、成功するウェブゲームを作るための5つの基本を取り上げた。私たちは専門家たちに、ウェブ開発を行う際の一番の秘訣を尋ねました。

ウェブゲームの開発を検討されている方、他のプラットフォームからウェブゲームへの移植を検討されている方、あるいは単に新しい情報をお探しの方にとって、専門家の洞察が貴重で刺激的なものとなれば幸いです。

Unity 6で広がる可能性

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