ウェブランタイムの更新：ブラウザーを進化させよう

Unity は、Unite 2023 において、最新のウェブランタイムソリューションを発表しました。この発表には、期待の高かったモバイルブラウザーのサポートに関する詳細、デスクトップブラウザーでの高度なグラフィックスとレンダリングに関して WebGPU が実行できる処理のどこよりも早いご紹介、および Meta のパートナーとともに Facebook と Messenger のインスタントゲームプラットフォームに Unity タイトルを提供するという魅力的な発表も含まれています。ご自身の次のウェブベースのプロジェクトにどんな未来が待っているのかを深く掘り下げるために、最後までご覧ください。

Unity には、ウェブランタイムに関する長い歴史があります。2006 年、Unity Web Player は、ウェブブラウザー用のプラグインとしてデビューしました。HTML5 の登場とともに、ブラウザーはプラグインをサポートしなくなり、Unity Web Player は 2015 年に非推奨となりました。次に、Unity は WebGL を採用し、asm.js を使用してブラウザー上で直接ゲームを実行できるようにしました。Unity は、WebAssembly（WASM）の設計プロセスに最初から立ち会い、それ以来、WASM とともに進化してきました。これにより、Unity エンジンのネイティブに近いパフォーマンスがウェブ上で実現しています。Unity 2018.2 では、Unity の WebAssembly ソリューションにおいて、asm.js をデフォルトとして置き換えました。

その後しばらくの間、Unity には動きがありませんでしたが、私たちは今がウェブ上の Unity コンテンツの転換期であると見ています。

そして、技術的な進歩に加え、プラットフォームの命名スキームを更新しました。現在、WebGL は Unity Web として知られており、Unity のウェブプラットフォームから WebGL 技術を切り離しています。また、複数のレンダリング規格が存在する将来に向けて備えることも考えています。最終的には、WebGL を使用したビルド、WebGPU を使用したビルド、または両方を使用した単一のビルドを作成できるようにする予定です。

このような方法でコンテンツを提供することにより、ゲーマーはリンクをクリックするだけで、または QR コードをスキャンするだけで、デバイスに何もインストールせずに、即座にゲームにアクセスできるようになります。さらに、ブラウザーのセキュアな環境にコンテンツを取り入れることにより、別のオンラインストアに邪魔されることなく、ご自身とゲーマーを直接つなぐことができます。

ウェブには、他のプラットフォームのようなインストールの手順が存在しないため、煩雑さが少なく、すぐにエンゲージメントを得ることができます。ただし、これは、最初のロード時に、ユーザーがランタイムアセットとスターターアセットをダウンロードする必要があるということを意味します。つまり、Unity にとっても、ご自身にとっても、そしてすべてのエンドユーザーにとっても、ロード時間がすべてであるということです。ロード時間を短縮するために多くの作業が行われていますが、その点についてはこの記事の後半で詳しくご説明します。

開発者は、エンジンの深さと広さにより、他のウェブ技術と比較して、より複雑なシミュレーションやインタラクティブな要素を取り扱うことができます。とは言うものの、ユーザーがランタイムアセットとスターターアセットを前もってダウンロードしておくため、たいていの場合、少なくとも現時点では、ウェブのコンテキストではより小さいコンテンツの方が好都合です。

このようなトレードオフを考慮すると、プレイセッションのサイズが小さくメカニズムが理解しやすいカジュアルゲームやハイパーカジュアルゲームのように、ウェブ上で他のゲームよりも受け入れられやすいゲームのタイプがあることは認めざるを得ません。

さらに、例えばチュートリアルレベルなど、大きなゲームの小さな部分を取り込み、ゲームの残りの部分からは分離した、誰でも利用できる独自のウェブビルドを構築することにより、煩雑さが少ないというウェブの特質を十分に活用することができます。こうすることで、デバイスに何もインストールさせず、また煩雑さを感じさせずにプレイヤーに体験に入ってもらうことが可能になり、その後、メカニクスに興味を持ったプレイヤーが完全版のネイティブアプリを購入する行動につなぐことが可能になります。

Artemis Real-time Orbit Website（AROW）は、昨年 11 月に打ち上げられたアルテミス 1 号のミッションのインタラクティブなリアルタイムトラッカーであり、Unity で構築されています。

神話では、アルテミスはアポロの双子の妹であるため、NASA は月面に再び到達する一連のミッションをギリシャの人物にちなんで命名しました。

世界中の宇宙ファンは、オリオンカプセルの軌道上の位置や、最終的に太平洋に着水する場所をすべて、デスクトップのウェブブラウザーで追跡することができました。NASA は、このツールを将来のすべてのアルテミスミッション用に構築し、オリオンカプセルだけではなく、すべてのミッションコンポーネントを追跡できるように拡張することを計画しています。

AROW はインターンの Seth Lambert 氏によって作成され、彼はその後 NASA コミュニケーションチームのフルタイムメンバーとなりました。

Unite では、Unity 6 において、Android と iOS のブラウザーをサポートする予定であることを発表しました。近い将来、iOS や Android のブラウザーを含め、ウェブ上のあらゆる場所で Unity ゲームを実行できるようになります。また、ネイティブアプリのウェブビューにゲームを埋め込んだり、プログレッシブなウェブアプリのテンプレートを使用して、独自のショートカットやオフライン機能を備えたネイティブアプリのように、ゲームを動作させたりすることもできるようになります。モバイルでの Unity Web をターゲットにしている場合、ここ 2、3年の間にリリースされたハイエンドモバイルデバイスでも適切に動作している可能性が高いと確信していますが、コンテンツによって結果は変わっているかもしれません。Unity 6 を出荷するときまでには、モバイルでの Unity Web の最小ハードウェア要件に関して、より明確なガイダンスを作成できると考えています。

ここでは、最近の 2D サンプルプロジェクト Happy Harvest が、iPhone 15 Pro 上の Safari で動作している様子をご覧いただけます。

Safari が WebGL2 のサポートを開始したことにより、Unity Web は Android デバイスだけではなく、iOS デバイスでも動作するようになりました。モバイルネットワークのスピードと信頼性、そして CPU と GPU のパワーは絶えず向上しています。現代のオーディエンスは、煩雑さの非常に少ないインスタントな体験を切望しており、Unity では、プレイヤーは現在、ショート形式のインタラクティブなコンテンツを要求していると考えています。

Unite 基調講演で発表されたように、Unity は Meta と提携し、同社のインスタントゲームプラットフォームのサポートを構築しました。このエコシステムをクリエイター向けに開放することにより、プレイヤーは、Facebook や Messenger の会話内で即座にゲームを見つけ、プレイできるようになります。数億人のゲーマーのオーディエンスが存在するため、ご自身のコンテンツの対象範囲をまったく新しいユーザー層に拡大する絶好のチャンスです。

「Meta と Unity の緊密な協力関係は、Unity を使用して構築された HTML5 ゲームのパフォーマンスを向上するという点において、すでにいくつかの期待できる初期的な成果をもたらしています」と、Meta の Facebook Gaming 担当プロダクトリードである Andrew Mo 氏は述べています。「この勢いを来年も継続し、ゲーム開発者が Facebook と Messenger にコンテンツを提供しやすくなることを楽しみにしています」。

彼は、こう付け加えています。「特に、友人やコミュニティと一緒にプレイすることを想定したゲームの場合、ゲームに即座にアクセスできるようにすることに、大きな可能性を感じています。そして、Unity と提携し、Meta のプラットフォーム上でその可能性を引き出すことを非常に嬉しく感じています」。

「特に、友人やコミュニティと一緒にプレイすることを想定したゲームの場合、ゲームに即座にアクセスできるようにすることに、大きな可能性を感じています（中略）。Unity と提携し、Meta のプラットフォーム上でその可能性を引き出すことを非常に嬉しく感じています。」 - Andrew Mo 氏、Facebook Gaming 担当プロダクトリード、Meta

Unity Web プラットフォームチームは、このパートナーシップを促進するために、専用のビルドターゲットを含め、さまざまな作業に取り組んでいます。この取り組みの成果により、皆様はインスタントゲームに合わせた合理的なフローでゲームをテストして最適化し、公開できるようになります。今後、インスタントゲーム API とのインターフェースを提供する C# SDK や、プレイヤーが数秒でゲームに参加できるようにするための多数の新しい最適化が用意される予定です。

また、この新しいツールを検証するために、ゲームスタジオとも提携しています。ローンチパートナーには、『Ready, Set, Cook!』など、Meta のプラットフォームで数本のゲームを提供している Coatsink が含まれています。Coatsink がローンチパートナーとして契約した直後、Unity のチームは、このゲームに対して早期にいくつかの最適化を適用しましたが、その結果は非常に期待できるものでした。

ロード時間が 25% 短縮されただけで、アクティブセッション数は 50% 増加し、Click-to-Play 率は 35% から 58% に跳ね上がりました。つまり、この最適化作業の非常に早い段階で、『Ready, Set, Cook!』は、ほとんどのプレイヤーがゲームプレイを見たことがなかった状態から、大多数が友人と一緒にゲームに参加するような状態になったということです。これは最適化作業の氷山の一角に過ぎませんが、ロード時間の比較的小さな短縮が、エンゲージメントにいかに大きな違いをもたらすかがわかります。

このグラフは、Coatsink が提供したオリジナルビルドと、Unity の最新のインスタントゲーム対応ツールを適用した最適化バージョンを比較したものを示しています。見ておわかりのように、Unity は実際に、『Ready, Set, Cook!』が入力を受け付けるようになるまでの時間を 50% 超短縮しました。このテストは、特別に通信速度を 48Mbps に調整した Pixel 5 で実施しました。

上のグラフでは、テストベッドタイトルとして『Ready, Set, Cook!』を使って計測した、最適化前のロード時間と現時点で達成しているロード時間を確認できます。最初に、通信速度を 48Mbps に調整します。これは Ookla がレポートしている、世界のモバイルネットワークスピードの中央値であり、5G でさえありません。世界のブロードバンドスピードの中央値である 86Mbps ではさらに高速になります。安定した 5G 接続では 176Mbps が出てさらに高速になりましたが、ネットワーク帯域幅がもはや主要な制限要因ではなくなっているため、得られる利得も小さくなりました。

高速なロード時間を実現するためには、ウェブブラウザー内でのゲームのダウンロードと初期化のあらゆる側面に目を向ける必要があります。

ウェブビルドは、以下のようないくつかのファイルで構成されています。

• WebAssembly（.wasm）ファイル：これは、Unity エンジンとゲームロジックを含む、バイナリ実行ファイルです。
• 大規模なリソースファイル（.data）：これには、ビルドに含まれるシーンのグローバルメタデータとアセットリソースが含まれます。
• アセットバンドルまたは Addressables が含まれている場合があります。
• WebGL テンプレート（HTML と CSS）、およびすべてを動作させる Unity Framework の JavaScript ファイル。

最初に、適切なリリースビルドを作成する上で、まず従っておくべきベストプラクティスを以下に示します。

• コンパイラーとリンカーに、最適なコードサイズのビルドを作成するよう指示する
• Brotli 圧縮を使用する
• ウェブテンプレートに HTTP プリロードタグを追加して、最初のシーンに必要なアセットバンドルと Addressables をすべて前もってロードしておく

将来のインスタントゲームのビルドターゲットでは、これらをデフォルトにする予定です。

また、Unity エンジンのロード中や初期化中にスプラッシュスクリーンやアニメーションを表示することにより、プレイヤーが感じるロード時間を短縮する方法も検討してください。

ゲームによって、WebAssembly に対するアセットのサイズは変動します。

最初に、いくつかのベストプラクティスを検討します。最初のシーンのロードに要する時間は非常に重要になるため、Unity Addressables システムを使用して、各アセットを分割して個別にダウンロードできるようにすることを検討します。その後、HTTP プリロードタグを追加して、最初のシーンに必要な Addressables をプリロードします。その後のシーンでは、Addressables システムからオンデマンドでアセットをロードします。

オーディオを多用するゲームの場合は、必ず圧縮オーディオを使用し、強制的にモノラルにして音質を限界まで落とすことを検討します。

2 番目には、使用するグラフィックス設定に注目します。ETC Crunch 圧縮テクスチャを選択すると、ダウンロードサイズが最小になり、モバイルデバイスでの GPU メモリ使用量を低く抑えることができます。ASTC 圧縮テクスチャを使用する場合は、ブロックサイズを慎重に確認して、小さなテクスチャに対しては大きなブロックサイズを選択します。同様に、プロジェクトの Player Settings でシェーダーストリッピングを設定します。

WebAssembly 技術は進化し続けており、それに合わせて Unity を更新しています。Unity は、このような先進技術をサポートするうえで、ウェブ W3C コミュニティで行われている活動に大変感謝しています。ウェブゲームは、すべてのブラウザー開発者の投資とサポートなしには成立しません。特に、Google の Chrome チームと連携できたことは非常に有難かったです。Unity は、WebAssembly のゲームに関するユースケースの強化や、複雑なゲームワークロードのグラフィックスパフォーマンスの向上に取り組んできました。

Emscripten コンパイラーは、Unity の il2cpp ビルドを WebAssembly に変換します。新しい長期サポート（LTS）のリリースごとに最新バージョンの Emscripten を搭載し、開発ビルドの高速化と、より小さく最適化されたリリースビルド（ビルドに多少の時間を要する場合があります）を可能にしています。

Unity 6 では、4GB メモリのサポートを有効にすることができます。これにより、デスクトップブラウザーで利用可能な大容量メモリを活用することで、ウェブ上でより熱中できるリアルタイム 3D 体験が可能になります。将来的に、すべてのブラウザーが 64 ビットメモリのサポートを発表すれば、64 ビットメモリのサポートへの道が開けると考えられます。

現在は、ウェブビルドで例外サポートを有効にすると、try/catch をサポートするためにすべての関数にコードが追加されるなど、多少のオーバーヘッドが発生します。Unity 6 でオプションとして利用可能になる予定の WebAssembly ネイティブ例外処理では、オーバーヘッドをほとんど発生させずに、例外を利用できるようになります。

また、Unity 6 では、WebAssembly SIMD のサポートを有効にすることができます。これは、ベクトル化された命令で CPU の数値計算を高速化します。x64 デバイスと Arm デバイスの両方で動作し、ウェブページがロードされたときに、WebAssembly SIMD の命令を SSE または Arm NEON にマッピングします。ここでの改善内容は、デバイスやブラウザーによって異なりますが、注目に値するものです。

これらの機能はオプションであり、新しいバージョンのウェブブラウザーでのみ利用可能です。

新しい WebGPU バックエンドを導入することは、ウェブベースのグラフィックスアクセラレーションにとって重要な出来事となり、Unity のウェブゲームのグラフィックスレンダリングの忠実度において前例のない飛躍への道を開きます。

WebGPU は、最新の GPU 機能を活用して、ウェブに公開することを目標に設計されています。この新しいウェブ API は、使用するデスクトップデバイスに応じて、DirectX 12、Vulkan、Metal などのネイティブ GPU API を介して内部に実装される、最新のグラフィックスアクセラレーションインターフェースを提供することにより、この目標を実現します。

WebGPU は新しく非常に魅力的なレンダリング機能をサポートしており、以前のデスクトップウェブでは見たことがないレベルのグラフィックス忠実度を実現します。他の最新のグラフィックス API と同様に、レンダリングの設定と GPU の実行をより下位レベルで制御することで、新たな最適化の可能性を引き出し、CPU と GPU のオーバーヘッドを低減し、スループットと待ち時間を改善することができます。

また、WebGPU は、初めてコンピュートシェーダーをウェブに取り入れています。GPU コンピュートスキニングは、スキンメッシュキャラクターのレンダリングパフォーマンスを根本的に改善します。現在、頂点変換はすべて、GPU にオフロードされています。以下のリンクから見られるデモでは、GPU スキニングを利用して、比較的高いフレームレートを維持しながら、これらのロボットのスキンをその下のスケルトンにメッシュ処理しています。これを CPU で実行した場合は、1 桁の FPS で動作すると考えられます。

もう 1 つの例は Unity の VFX Graph です。これはコンピュートシェーダー内でジオメトリを連続的に直接生成します。下のパーティクルシミュレーションでは、50 万超のパーティクルがアニメーション化されており、それらのパーティクルはすべて GPU 上のコンピュートシェーダーを介して移動しています。

下のリンクから見られる『Boat Attack』のデモは、過去にご覧になったことがあるかもしれません。現在では、完全に WebGPU 上で動作しています。現在、WebGPU は、macOS と Windows の Google Chrome と Microsoft Edgeで有効になっています。この最新のサンプルでは、WebGPU でレンダリングされたインタラクティブな『Boat Attack』が動いています。

Unity の WebGPU 用バックエンドの開発期間中、Unity のグラフィックスエンジニアは Chrome チームと密に連携を取り、大規模なシーンや複雑なシェーダーを用いて WebGPU のストレステストを行い、素晴らしい結果を得ました。

WebGPU グラフィックスバックエンドは現在開発中であり、本番環境のユースケースでの使用は推奨していません。ただし、早期アクセス版をご利用いただけるようになっています。試してみたい方は、グラフィックスフォーラムで詳細をご確認ください。

ウェブは、煩雑さのないエンゲージメントとプレイヤーとの直接的なつながりをもたらしうる、非常に強力な場です。WASM とスターターアセットを前もってダウンロードしておくため、ロード時間の短縮は、ウェブプロジェクトにとって非常に重要です。このようなトレードオフの関係から、一般的にウェブ向けには、小さめのコンテンツが最適となります。

2024 年後半には、Facebook と Messenger 向けにインスタントゲームのビルド・デプロイを行い、まったく新しいオーディエンスにアクセスできるようになります。ご自分のインスタントゲームを成功させるためのツールやリソースにいち早くアクセスするために、Unity および Meta と直接連絡を取りたい方や、この新しいプラットフォームのサポートへの取り組みに関する最新情報を入手したい方は、今すぐご登録ください。

モバイルウェブのサポートは Unity 6 からご利用になれます。Unity 6 の詳細については、Unite 基調講演をご覧ください。

今すぐ情報が欲しいという方は、Unity 6 で採用される予定の WebGPU に関するフォーラム投稿を読み、WebGPU バックエンドへの早期アクセスの詳細についてご確認ください。さらに、Unite セッション『Instantly get your Unity game to more players on the web（Unity ゲームをウェブ上でより多くのプレイヤーに即座に提供しよう）』（下の埋め込み動画）をはじめ、現在オンデマンドで提供中の Unite 2023 セッションで、エンジンの最新動向の詳細をご確認いただけます（日本語版注：一部のセッションは日本語吹き替え版もご覧いただけます）。