Unity を検索

Unity Forma を使ってインタラクティブかつリアルタイムな 3D 製品コンフィギュレーターをモバイルウェブをはじめさまざまな場所に搭載する

2021年2月26日 カテゴリ: Industry | 6 分 で読めます
Hand holding smartphone showing a blue car
Hand holding smartphone showing a blue car
取り上げているトピック
シェア

Is this article helpful for you?

Thank you for your feedback!

デジタルマーケティングを成功させるためには、あらゆる場所でオーディエンスにリーチすることが重要です。マーケティング担当者向けの新製品 Unity Forma を使用すると、モバイルウェブをはじめとした複数のエンドポイントでリアルタイムの 3D 製品コンフィギュレーターを簡単に作成して公開することができます。この製品で出来ることをお見せするために、WebGL ベースのカーコンフィギュレーターのデモを公開しました。 

Unity Forma は Unity エディターの拡張機能で、3D 製品データを取り込み、マスターモデルを準備し、複数のマーケティングチャンネルにインタラクティブで静的なコンテンツを公開するための標準化されたフレームワークを提供します。スキルベースのコンテストである Unity Forma Challenge や、インタラクティブな 3D コンフィギュレーターの構築に関するヒントやコツの紹介やライブの質疑応答を行うウェビナーシリーズもぜひチェックしてください。

パイプラインの問題

自動車や高級品など、値段が高い商品のマーケティングを担当するマーケターにとっての大きな課題は、コンテンツ制作パイプラインが多数必要となるということです。これらのパイプラインは、製品コンフィギュレーターを多数のエンドポイント(モバイルアプリ、モバイルウェブ、デスクトップなど)で展開するために必要であり、その結果、重複した作業が発生します。これにより作成と維持にコストがかかり、製品の更新頻度が高い場合は特にコストが高くなります。そして、同じ作業が何度も繰り返され、何度も費用が発生することになります。

Unity Forma を使った品質プロファイル

3 aviera lined up together
Unity Forma を使えば、同一プロジェクト内で複数のモデル解像度、マテリアル表現、グラフィック設定を簡単に管理できる(左:HDRP プロファイル。Unity で最高のレンダリング品質を提供する。中央:URP プロファイル。右:WebGL プロファイル)。

Unity Forma では、これまで切望されていたソリューションが提供されています。Quality Profiles(品質プロファイル)と呼ばれる機能を通じて、製品コンフィギュレーターの複数のモデル解像度、マテリアル表現、グラフィック設定を管理することができます。これにより、1 つのマスターモデルから複数のエンドポイント向けの体験を作成することができます。

複数のプロジェクトを作る代わりに、これらの作業を単一のコンテンツパイプラインに集中させ、大幅な効率化を図ることができます。これにより、大幅なコスト削減、すべてのマーケティング上の顧客接点で製品の一貫性を保ち、より包括的な顧客体験への道が開かれます。

 

Aviera motion in unity

Unity では、ターゲットデバイスにおける最高の品質を実現するパフォーマンスを出せるように、スクリプタブルレンダーパイプラインを提供しています。Unity Forma は、複数のスクリプタブルレンダーパイプラインを単一のプロジェクト内で管理します。

HD レンダーパイプライン(HDRP)

Aviera with red lights

HDRP は、Unity の事前構築済みスクリプタブルレンダーパイプラインの 1 つです。PC などハイエンドのハードウェアのほか、Furioos のクラウドストリーミングサービスを使用したウェブブラウザでも、パフォーマンスの高い、忠実度の高いグラフィックを提供できます。こちらのリンクから Furioos 上で動作する HDRP コンフィギュレーターを見ることができます。HDRP は最高のレンダリング品質を提供し、リアルタイムレイトレーシング(プレビュー版)のような機能も備えています。

ユニバーサルレンダーパイプライン(URP)

Aviera with subdued red lights

URP は、モバイルデバイス(Android や iOS)や PC など、Unity でサポートされているすべてのターゲットプラットフォームにリーチできる、もう 1 つの事前構築済みスクリプタブルレンダーパイプラインです。HDRP を置き換えるものではありませんし、また、HDRP を包含するものでもありません。パフォーマンスに制約のあるプラットフォーム上で強力なグラフィックスとリアルタイムでのパフォーマンスを提供しますが、ライティングとシェーディングは HDRP と比較すると、やや抑えられたものとなっています。

WebGL

最適化されたアセットを使うことで、ユニバーサルレンダーパイプラインを使ったコンテンツを WebGL プラットフォームにデプロイして、Web ブラウザで Unity からインタラクティブな体験を実行することができます。

Unity Forma サンプルプロジェクトでは、Aviera 車両モデル(モデル提供:Genesis Design)を使ったインタラクティブなカーコンフィギュレーターを実行するための WebGL プロファイルを作成しました。このように高度に最適化されたアセットを使用すると、Unity をブラウザーで直接実行することができます。これは、他の WebGL レンダラーへエクスポートしたものではありません。モバイルデバイスでの体験は特に素晴らしいものに仕上がっています(iOS 用は、iPhone 7 以降がサポートされています)。

WebGL 版コンフィギュレーターを使ってみる

 

WebGL プロファイル:どのように構成されているか

この WebGL プロファイルを作成するために、私たちは Light & Shadows のメンバーと協力しました。そこで、今回はデータの最適化プロセスについて、Light & Shadows のメンバーから説明してもらうことになりました。Unity のパートナーである Pixyz のツールを使用して、皆さんのプロジェクトでこの作業を自動化する方法をご紹介します。ぜひこの後もお読みください。 

 

--  

Light & Shadows のチームにとって、Unity Forma は高品質なマーケティングコンテンツを作成できる直感的なツールです。実際に、仕事をより簡単に、より速く進めることができます。

Unity Forma でインタラクティブなコンテンツを作るには、3D データを可能な限り最適化した形で準備することが重要です。このプロセスにより、3D ファイル(FBX、gITF、GLB など)が軽量化され、さまざまなプラットフォームで使用できるようになります。ファイルを最適化すればするほど、プラットフォーム上での読み込みが速くなります。

Light & Shadows のチームは、エンドユーザーの受け取る体験にとって非常に重要なこのフェーズに特に注意を払っています。実際、この最適化により、サイズを小さくするだけでなく、処理能力が限られているため大きなファイルを処理できない WebGL やモバイルのプラットフォームでも、モデルファイルを使えるようになりました。

まず最初に行ったのは、レンダリング結果のビジュアル品質を損なわないよう、プロジェクトのニーズに合わせた品質で CAD ファイルをテッセレーションする(三角形の数を調整して、重い高精細なメッシュを適度に軽量化したメッシュにする)ことでした。このプロセスは、3D CAD データを作成するために広く使われているソリューション、Pixyz Studio で実行されました。これにより、すべての 3D コンテンツ作成ソフトウェア(3ds Max、Maya、Blender など)に適した高品質の FBX ファイルをエクスポートすることが可能になりました。

Black & white aviera outline
ローポリゴンメッシュ
Black & White Aviera Outline high mesh
ハイポリゴンメッシュ

次のステップは 3ds Max を使ったデータの準備です。残っている無駄なメッシュはファイルを重くするので、これをクリーンアップしました。これが済んだら、インスタンシングを適用可能なすべての要素に適用しました。これは技術的には、メッシュとそのプロパティを完全に写し取ったコピーを作成することで、ファイルの最終的なサイズを小さくするという手法です。 

例えば、エクステリアから左右対称のインスタンスを作るために、車両の長さをカットすることにしました。また、リムのメッシュは三角形の数やファイル容量の点で処理を重くする要素なので、車両のホイールもインスタンス化しました。

Red & Blue Aviera

最後に、プロジェクトは当初 HDRP で作成されたため、URP プロファイルを作る必要がありました。この作業において、Unity Forma ですべてのマテリアルを命名パターンで自動的に割り当て、プロファイル間のバリアント、ロジック、カメラを同期させました。また、iOS 上でデモを実行するために、ガンマライティングワークフローを選択しました。このために、3D アーティストはいくつかのマテリアルと環境照明を調整しました。Unity はプラットフォームごとにテクスチャの解像度を定義することができ、モバイルブラウザ用には、その制約内で実行できるよう、より低い解像度を選択しました。ポストエフェクトは無効にし、代わりにオクルージョンマップをモデルのパーツにベイクしました。

--

WebGL プロファイルは、サンプルプロジェクトを通じて、Unity Forma のお客様とトライアルユーザーに近日中に提供される予定です。それまでの間、以下の情報源から Unity Forma の情報を入手されることをおすすめします。

今すぐ Unity Forma を試す

2021年2月26日 カテゴリ: Industry | 6 分 で読めます

Is this article helpful for you?

Thank you for your feedback!

取り上げているトピック