HoverFit: WebXRでのフィットネスのゲーミフィケーション - パート1: 技術
The Fitness ResortがどのようにWonderland Engineを活用してHoverFitを開発し、UnityのWebパフォーマンスの限界を克服したかを発見してください。
Unity Webでの技術的課題
WebXRアプリケーションは高性能なレンダリング、低遅延、シームレスなインタラクティビティを求めていますが、既存のウェブエンジンはこれらの優先事項を念頭に置いて作られていませんでした。
Unity Webのパフォーマンス
The Fitness ResortチームがUnityのHTML5(ウェブ)エクスポートでVRスキー用トレーナーの開発を始めたとき、すぐに大きなパフォーマンスとワークフローボトルネックに直面しました:
-
長い反復時間 – ブラウザでテストするために、15分以上待たなければならず、開発のワークフローが非常に非効率になりました。なぜなら、UnityのHTML5プラットフォームではJavaScriptコードを実行できなかったからです。
-
遅いWebGLのパフォーマンス – 多くの手動での最適化を行っても、UnityのWebGLビルドはすべての重要なゲーム機能を実現するために十分なパフォーマンスを発揮できませんでした。低パフォーマンスのためにアンチエイリアシングを有効にできず、VRでは小さな頭の動きでもエイリアスのラインが目立つことがあります。Unityはスキーの体験の最小限のプロトタイプを実現するための処理能力を提供できませんでした。
-
制限されたシェーダーとライティング能力 – 高品質なビジュアルにはリアルタイムライティングと複雑なシェーダーが必要ですが、Unityのウェブエクスポートはそれを効率的に処理できませんでした。
-
巨大なファイルサイズと長いロード時間 – Unityのウェブビルドは非常に大きなファイルサイズを生み出し、空のスタートプロジェクトでさえ25MB以上のダウンロードが必要でした。UnityはSteam、コンソール、またはApp Storesのようなネイティブプラットフォーム向けに設計されており、ユーザーはアプリのインストール時に完全にプリロードすることに慣れています。しかし、ウェブでは、ユーザーがアプリをオンデマンドでストリーミングすることを期待しています。
アイデアから現実へ:ウェブベースのVRフィットネスプラットフォームの構築
Hoverfitの創設者Tim Dudgeon。
VRフィットネスは急速に進化していますが、完全にウェブ上で動作するVRフィットネスプラットフォームを構築することは未知の領域でした。
2020年、The Fitness Resortの創設者Yin-Chien “Yinch” Yeapと元オリンピックスキーヤーのTim Dudgeonは、WebXRの可能性を探求するために出発しました。彼らのビジョンは大胆で、ブラウザで完全に動作し、ネイティブのXRアプリケーションと同様のパフォーマンスとビジュアルを提供するVRスキー用トレーナーを開発することでした。
Wonderland Engineを使用してSki Fit 365を成功裏に開発した後、彼らはスキーを超える可能性を感じました。Timにとって、このビジョンは非常に個人的なものでした。プロスポーツ選手として、従来のジムでのトレーニングの退屈さを知っていました。彼らは次のレベルに進むことを決意し、HoverFitという次世代WebXRフィットネスプラットフォームを開発することにしました。マルチプレイヤーサポート、多様なバーチャルワールド、統合された健康追跡を備えたHoverFitは、フィットネスをゲーム化し、人々が本当に楽しむことのできる体験に変えています。
なぜウェブなのか?自由、柔軟性、将来のための準備
Hoverfitの創設者Yin-Chien “Yinch” Yeap。
私は大局的な開発者だと自認しています。その観点から、XRが成長するエコシステムとして真に進化するためには、オープンスタンダードとオープンプラットフォームによって駆動されるウェブが必要だと強く信じています。
--- Yin-Chien Yeap
ベストプラクティスがまだ形成途中であるXRのような分野では、開発者が迅速に繰り返し実験し、制約なしにイノベーションを進めることが重要です。閉じたプラットフォームは高コストと人工的な壁を導入し、イノベーションを難しくします。ウェブは、Yinchと彼のチームがすぐに実行可能で、自由にアップデートでき、クリエイティブなコントロールを完全に持ち続けることを可能にしました。大企業の承認プロセスに邪魔されることなく、です。
将来に向けた準備も重要な要素でした。新しいVRハードウェアが常にリリースされています。ネイティブのアプリケーションでは、新しいヘッドセットごとに新たなSDKを統合し、互換性を維持する必要があります。それに対して、WebXRアプリケーションはブラウザをサポートする限り、新しいデバイス上で即座にアクセス可能です。
これを示す良い例がAndroid XRです。MetaとGoogleがAndroid XRのサポートを発表したとき、多くのネイティブ開発者はすぐにこの新しいエコシステムへのアプリ移植の質問に直面しました。
この新しいエコシステムに私たちのアプリをどう移植するのか?
WebXRの開発者にとっては、対応は非常にシンプルでした:
ブラウザを提供してください、準備完了です!
このような自由、柔軟性、将来への準備がYinchとTimがWebXRをネイティブアプローチに対して選んだ理由です。
パフォーマンスボトルネックを克服:UnityからWonderland Engineへの切り替え

Unityの開発者であるYinchは、自然とSki Fit 365の開発にUnityを選びましたが、すぐに重要なパフォーマンスのボトルネックに直面しました。Unityのウェブエクスポートパイプラインは、彼らのパフォーマンス要件を満たすのに苦労し、多大な最適化努力を経ても、目標に到達することができず、他のソリューションを検討せざるを得ない状況に追い込まれました。
解決策を探し、WebXR Discordサーバーで課題を話し合っているとき、Wonderland EngineのJonathan Haleから、彼らがちょうどこれらの問題を解決するために設計されたWonderland Engineを試すよう提案されました。
最初は、Yinchは躊躇しました - Unityには慣れており、エンジンを変更することはゼロからやり直すことを意味しました。しかし、パフォーマンスの問題が続く中で、Unityでは彼らのニーズを満たすことができないことが明白になりました。

彼らは切り替えを決断しました。SkiFit 365をWonderland Engineで再構築することによって劇的なパフォーマンスの向上が見られ、技術的ボトルネックに直面することなく、高品質のWebXR体験を提供することが可能になりました。
ウェブに最適化された唯一の3Dエンジン
Unityだけでなく、YinchはA-FrameやPlayCanvasも試しました。PlayCanvasが特定のユースケースでは堅実なWebGLフレームワークだと思っていますが、WebXRファーストエンジンというよりもWebGLエディタだと考えています。プロジェクトの要件を洗練する中で、この違いはますます重要になりました:
WebXRのフレームワークはWebGLの上に構築されており、WebXRの機能はしばしば後から追加されたものであり、エンジンの優先事項ではありません。WebGLを最適化するのではなく、WebGLは制約と見なされています。Wonderland Engineは違います - ブラウザベースの3Dレンダリングのためにゼロから構築されています。このアプローチにより、Wonderland Engineは高いレンダリング要求を持つ大規模な3D WebおよびWebXRプロジェクトのために真に最適化された唯一のゲームエンジンとなっています。
-
迅速な反復時間 – エンジンがブラウザに1秒以内に直接パッケージされるとき、パッケージ化されたアプリケーションそのものがプレビューとなり、すべてのコードが直接ブラウザで実行されます。それにより、パフォーマンス、ビジュアル、JavaScriptの実行時の違いが排除されます。
-
最適化されたWebGLパフォーマンス – Wonderland EngineのWebGLレンダラーはウェブのパフォーマンス特性に合わせてカスタマイズされており、多くの動的オブジェクトをシェーダータイプごとに単一のドローコールにまとめ、シーンあたりのドローコールをわずかにします。
-
ダイナミックライティング – ラディカルなドローコールの最適化により、Wonderland Engineはリアルタイムシャドウ付きで多くの動的ライトをWebXRでレンダリングすることができます。
-
高速な読み込み時間 – 独自に設計されたバイナリファイル形式により、ウェブを介してストリーミング可能で、お気に入りのストリーミングプラットフォームでビデオライブラリ全体を事前に読み込まないようにするのと同様に、Wonderland Engineは複雑なシーンであっても数秒で読み込みます。これにより、テキストベースの形式(JSONやXML)を解析する代わりに、ファイルをWebAssemblyメモリに直接マッピングします。アニメーション、テクスチャ、メッシュなどのリソースはデフォルトでウェブ伝送のために圧縮されています。
HoverFitの要件すべてを満たすために、Wonderland Engineは唯一の開発ツールでした:
- Meta Questでのリアルタイムでの100万以上の三角形のレンダリング
- ダイナミックなリアルタイムライティング
- Quest 2で最低60 fps、Quest 3/Quest 3sで72 fps
- 高品質のシェーダー
- 完全にスキン可能でカスタマイズ可能なアバター
- マルチプレイヤーサポート
- ボイスチャット統合