Developer Spotlight - WebAR体験の構築 (Visionaries777)

それでは、始めましょう。Frantzさん、Developer Spotlightへようこそ！ご自身やチーム、スタジオについて紹介いただけますか？

私の名前はFrantzで、Visionaries777の共同設立者である3名の1人です。当初は、フランス出身の2名で起業しました。私達はフランスでインタラクションデザインを学んだ後、約10年前に香港で弊社を設立しました。

現在の従業員数は約35名です。2010年以降はAR事業を展開し、弊社の主力事業となっています。
弊社が取り組んでいるのは、AR分野の中でも3DリアルタイムARや、XR各種アプリケーションです。

私とビジネスパートナーは、以前デンマークのLEGOで働いていて、当時のR&D部門でARに取り組み始めました。私達はLEGOが物理とデジタルの架け橋となり、ハイブリッドなプレイ体験を実現する手助けをしました。

その後、私達はLEGOを退職し、自分達の会社を起業しました。LEGOは私達をコンサルタントとして雇用し、しばらくの間は仕事を続けていました。初期の頃は、ARを使用したマーケティングやプロモーションイベントなどのコラボレーションを多くおこないました。

現在、私達が取り組んでいるのはもっと産業寄りのもので、自動車や高級品が対象です。ARはいまやWebGL、Web AR体験、VRなどと共に成熟した製品となっています。

ありがとうございます！なぜVisionaries777はPlayCanvasを選択したのか、教えてもらえますか？

以前は、3Dリアルタイムのプロジェクトには常にUnityを使用していました。
これは、Unityはハードウェアプラットフォーム間での互換性が非常に高いためで、とても素晴らしい特徴です。ただし、Unityに唯一かけているのはWebです。

私達は、WebGL体験の開発に最適なプラットフォームは何なのか、いろいろと探していました。その際にPlayCanvasを知り、エディターを開いてみたところ、とても使いやすい点に驚きました。
私は、PlayCanvasエディターを設計した人達はUnityを知っていて、メニューやレイアウトのインスピレーションを受けたのではと思っています。PlayCanvasはUnityの仕組みにとても似ています。
ただ、PlayCanvasはデスクトップアプリケーションではなく、Web上のエディターである点が特徴です。
ですので、私達は簡単にPlayCanvasを使い始めることができました。

これまでのところ、ローディングや軽量化など、PlayCanvasエンジンのあらゆる機能に本当に満足しています。私達にとって、PlayCanvasはWeb体験を開発するうえで最高のプラットフォームです。

すばらしいですね！当初の課題は何でしたか？また、チームはどのようにその課題をクリアしましたか？

ほとんどの課題は、モデルの最適化についてでした。
どうやってビジュアルのクオリティを最大限に保ちながら、WebGL体験を可能な限り小さくするかという点です。

私達のクライアントのほとんどは自動車または高級品ブランドなので、画面上に表示される製品にこだわります。製品の端が粗くなってしまっては、意味がありません。そのようなクオリティでは、結局気に入ってもらえないのです。
これが、私達が最初に直面した課題でした — 過度にならない範囲で十分に最適化をおこない、問題のないローディング時間を実現してバランスを保つことです。このため、バランスを保てる適切な妥協点を見出だすまで、しばらくの間は試行錯誤を繰り返しました。

今では、弊社の最新のアプローチとパイプライン内のツールにとても満足しています。その成果の1つとして、現在はCartieからの依頼で全製品をウェブサイト上に展開しています。

とても興味深いですね。Visionaries777は、複数のWeb AR体験に取り組んできました。現在 Web ARはどのくらい重要か、考えを教えていただけますか？

Web ARは非常に重要です。ただ、マーカーにトラッキングを頼っていた2010年代初頭ごろの問題に戻ってしまっています。

現在のWeb ARでは、まだまだ限界があります。画像マーカーや、ワールドターゲットのある床などが必要ですし、ネイティブのUnityアプリでAR KitやAR Coreを使用した場合のような安定性はありません。

AR KitとAR Coreを実装したスタンドアロンのUnityアプリケーションでは、驚くほどの事柄が実現できます。ドリフトはほとんどなく、非常に高精度です。一方で、Webにはまだ制約があります。トラッキングは完璧ではなく、多くのドリフトが発生します。ですから、現在の技術ではアプリケーションが限られていますし、体験も少しギミック的だと思います。

Web ARは確かに発展はしてきましたが、まだこれから成長する必要があります。

しかし結局のところ、マーケティング用途でいえば、ユーザーまたは消費者として、誰もスマートフォンにアプリをインストールしたくはありません。
十分に遊び終えて3日後にアンインストールするために、わざわざBMWのアプリをインストールする人はいないでしょう。

このようにアプリをインストールしての体験は、10年前のiPhoneならば問題なかったのですが、今では人々の意識が変化し、考え方が変わりました。アプリではなく、Webブラウザから直接アクセスする必要があるのです。アプリ内だとしても、SnapchatやInstagramのように、1つのAR体験だけではなく様々な体験ができるアプリでなくてはならないのです。

その質問から派生しますが、御社が担当するクライアントはWeb AR体験に何を求めていると思いますか？

製品を3Dで表示し、さらには製品を自宅や道路に組み込むことができるので、ARはブランドにとって常に刺激的な手法となっています。マーケティングの観点からいえば、ARはブランドにとって非常に魅力的です。そして、消費者にとっては新しくて楽しい体験です。製品をより身近に感じることができるのですから。

ここでは、負担を減らすことが重要になります。

もうインストールの必要はありません。Webブラウザにいくつかのアセットをダウンロードしますが、ストアでアプリを探し、ダウンロードするよりも明快です。

こういった理由から、各ブランドは間違いなくWeb ARに興味を持っていますので、ARは今後も成長し続けるでしょう。ARは多くの価値をもたらします。車を道路で試すことも、時計を手首で試すこともできるのです。

さらに没入感が高まれば、まさに次世代のeコマース体験が提供されるでしょう。

Web AR体験を構築する際、PlayCanvasが提供する機能のうち、最も役立ったと思うものはどれですか？

PlayCanvasの真価は、WebGLのあらゆる規格に対応し、マテリアルや圧縮率、ローディング時間などを改善しつづけている点にあると思います。また、UIも非常に使いやすいです。

モデルをインポートすると、GLB形式に変換されます。これによって、さらに軽量になり、GLBとして事前にエクスポートする必要はありません。

プログラミング面では、JavaScriptのみです。やりたいことは全てできます。軌道カメラ以外のプリセットはありませんが、あまり重要ではありません。誰でも自由に構築できます。

すばらしいですね！では、HTML5/WebGL体験の構築は、ネイティブ体験/アプリの構築とどのように異なりますか？

HTML5/WebGL体験では、常にローディングを考慮する必要があります。ウェブ体験を開発する場合、ユーザーがすぐにプレイできるよう、あるものをすばやくロードしなければならないケースがあります。その後、モデルやその他の部分が徐々にロードされます。

たとえば自動車の場合、ホイールやルーフなどに、様々なバリエーションがあるとします。これらの要素はすべて読み込む必要がありますが、一度にすべてを読み込むべきではありません。そうでないと、ダウンロードが膨大になってしまうためです。

私は、UX/UIは別として、これがネイティブアプリケーションの設計との大きな違いの1つだと思っています。Web体験ではブラウザも考慮しなければなりません。ポートレートで使用するのか、デスクトップ上なのか、iframeに組み込む必要があるのか、全画面で表示するのか？

これらは、アプリの周囲を気にする必要のない、スタンドアロン型のアプリケーションで留意すべき事項とは全く異なる内容です。

次に、さきの質問でも少し触れましたが、PlayCanvasのエディター機能についてお聞かせください。エディター機能をどのように使用しているか説明いただきましたが、PlayCanvasが提供する機能でチームのお気に入りはありますか？

私にとっては、コラボレーションが最も重要です。PlayCanvasのコラボレーション機能は非常に優れています。誰でも自分のデスクトップマシンから、ウェブ上でプロジェクトにアクセスできるのですから。

アーティストがシーンにアセットを配置するのと並行して、ディベロッパーが作業をおこなえます。また、編集せずに確認のみをおこなう品質管理の担当者も、同時に作業できます。共同作業は、PlayCanvasでの作業を効率的にしている最高の機能の1つだと思います。

フィードバックをうかがいたいのですが、PlayCanvasにどのような機能を追加してほしいですか？

Unityが多様なデバイスに提供しているのと同様に、PlayCanvasエディターにもプラットフォーム（モバイルまたはデスクトップ）ごとに、異なるテクスチャ解像度を割り当てる機能があれば嬉しいです。そうすれば、コードやタグ付などでおこなうよりも、もっと簡単に管理できるようになります。

フィードバックをいただき、ありがとうございます！別の質問に戻りますが、今後数年間でHTML5やWebの体験はどのように発展していくと思いますか？

成長すると思います。現在のところWebGL体験と、HTMLでもWebGLでもないクラウドストリーミングの2つが存在しています。ブランドによって、WebGLコンフィギュレーターまたはクラウドストリーミングコンフィギュレーターのいずれかを選択するでしょう。これらは2つの異なるアプローチです。私は、より鮮明な画像を提供するWebGLを好む傾向があります。

また、WebGLでは一旦体験が読み込まれると、コマンドへの反応が格段に良くなります。ストリーミングのレイテンシーや映像の不具合に制限されることもありません。教室での体験をする場合、私はこういった事項が気になってしまうのです。

このため、特に現在のようにメタバース関連の議論をする際や、必要なファイル転送の話をする場合に、WebGLは継続すると思います。GLTF、USDZ、USDといったファイルは、あるプラットフォームから別のプラットフォームに変換できるので、多くのポテンシャルがあると考えています。

メタバースは、クラウドストリーミングではなくWebGLで構築されるケースが多いと思っているのですが、この点については私が間違っているかもしれません。

いずれにせよ、結局は各ブランドにとって、全てのアセットのデジタル化に着手することが重要だと思います。たとえば、CartierはWebGLビューワーを選択し、全製品をGLB形式で再作成しています。私は、これは非常に賢明だと思っています。一旦作成してしまえば、Webサイトでも、メタバースでも、Snapchat ARフィルターでも、ウェブ上のあらゆる場所で再利用できるからです。

WebGLが拡大する機会は、多くあると思います。5Gがさらに普及し、圧縮形式のアルゴリズムがもっと効率化されれば、さらに軽量化が進んで、よりリッチな体験をWeb上で構築できるようになります。長期的な観点からいってポジティブな未来があると思いますし、必ずしもクラウドストリーミングがWebGLにとって代わるとは限りません。

ありがとうございます！質問は以上となります。Frantzさん、ご回答ありがとうございました！
何か宣伝したいことや、御社のウェブサイト/Twitter、求人などについてお知らせはありますか？

WebARを使用した、製品コンフィギュレーターに特化した弊社ウェブサイトはこちらです： https://vzion.vz777.com/

また、弊社のメインのウェブサイトはこちらで、これまでのプロジェクトをすべてご覧いただけます: https://www.vz777.com/

Twitterも運用しています！ぜひフォローしてください：https://twitter.com/visionaries777