Scene Viewer は、ウェブサイトまたは Android アプリから 3D および AR エクスペリエンスを実現する没入型ビューアです。Android モバイル デバイスのユーザーは、ウェブホストされた 3D モデルを自分の環境で簡単にプレビュー、配置、表示、操作できます。
ほとんどの Android ブラウザは Scene Viewer をサポートしています。Scene Viewer は多くの Google パートナーによって実装され、3D および AR エクスペリエンスを確実にサポートしています。Google 検索のエクスペリエンスも強化されています。
導入は簡単:
ウェブベースのエクスペリエンスでは、ウェブページ上に適切な形式のリンクのみが必要です。
数行の Java コードを統合するだけでアプリベースのエクスペリエンスを実現できます。
Scene Viewer のランタイム要件
Scene Viewer で AR を体験するには、次のものが必要です。
- Android 7.0 Nougat（API レベル 24）以降を搭載し、ARCore 対応デバイスであること。
- 最新（最新の）バージョンの AR 用 Google Play 開発者サービス。このサービスは、ARCore に対応しているほとんどのデバイスに自動でインストールされ、最新の状態に保たれます。
- Google アプリの最新バージョン。このアプリはプリインストールされており、ARCore 対応デバイスの大半では自動的に最新の状態に保たれます。
AR 用 Google Play 開発者サービスまたは Google アプリが存在しない場合、またはインストール済みのバージョンが古すぎる場合に備えて、代替エクスペリエンス（ウェブページ、エラー メッセージ、作成済みのフォールバック エクスペリエンスなど）を起動する代替 URL を指定できます。
サポートされるユースケース
| 想定するユースケース | 推奨されるアプリケーション | 利点 |
|---|---|---|
|
ウェブサイトまたは Android アプリのボタンまたはリンクから、3D モデルのネイティブ AR ビューを起動します。
AR 用 Google Play 開発者サービスがデバイスに存在しない場合は、フォールバックして、Scene Viewer を利用した 3D モードでモデルを表示します。 |
Google 検索パッケージへの明示的インテントを使用して Scene Viewer を起動し、3D モデルを表示するための適切な mode 設定を選択します。
|
|
|
ウェブサイトまたは Android アプリのボタンまたはリンクから、3D モデルのネイティブ AR ビューを起動します。
デバイスに AR 用 Google Play 開発者サービスが存在しない場合は、フォールバック動作を制御します。 |
明示的インテントを使用して Google Play 開発者サービス（ARCore）への Scene Viewer を起動し、3D モデルを表示するための適切な mode 設定を選択します。
|
AR 以外のユースケースには、独自の 3D モデルビューアを使用するか、独自のデザインの別のフォールバック レスポンスを提供します。 |
| ウェブサイトで 3D モデルのインライン ビューをホストし、ユーザーが手動で全画面のネイティブ AR モードに移行できるようにします。 | AR で 3D モデルをネイティブに表示する Scene Viewer を起動するには、<model-viewer> またはその他のウェブベースの 3D ビューアを使用します。 |
|
明示的インテント（3D または AR）を使用して Scene Viewer を起動する
最も幅広い Android デバイスをサポートするには、明示的な Android インテントを使用して Scene Viewer を起動します。明示的インテントは、HTML ページまたはネイティブの Android アプリからトリガーできます。このインテントは、ARCore に対応している Android デバイスにプリインストールされている Google アプリによって処理されます。
設定されたインテント パラメータとデバイスの機能に応じて、インタラクティブな 3D モデルをユーザーの環境に配置したり、フォールバックして 3D ビューアで表示したりできます。
AR 用 Google Play 開発者サービスがデバイスに存在し、最新の状態である場合、Scene Viewer のモデルは AR ネイティブ ビューまたは 3D ビューで表示されます。
Google Play 開発者サービス（AR）が存在しない場合、または最新ではない場合、Scene Viewer は適切に 3D ビューでのモデルの表示にフォールバックします。
Google アプリがインストールされていない、または古いバージョンであるなどの理由で 3D モデルを表示できない場合、代わりに
S.browser_fallback_urlパラメータを使用して、代替ウェブページを表示します。
HTML または Java から Scene Viewer を起動する
HTML
HTML から明示的インテントをトリガーするには、次の構文を使用します。
<a href="intent://arvr.google.com/scene-viewer/1.0?file=https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/Avocado/glTF/Avocado.gltf#Intent;scheme=https;package=com.google.android.googlequicksearchbox;action=android.intent.action.VIEW;S.browser_fallback_url=https://developers.google.com/ar;end;">Avocado</a>
Java
Java から明示的インテントをトリガーするには、次のコードを使用します。
Intent sceneViewerIntent = new Intent(Intent.ACTION_VIEW);
sceneViewerIntent.setData(Uri.parse("https://arvr.google.com/scene-viewer/1.0?file=https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/Avocado/glTF/Avocado.gltf"));
sceneViewerIntent.setPackage("com.google.android.googlequicksearchbox");
startActivity(sceneViewerIntent);
インテントのバージョニング
インテント バージョンは、arvr.google.com/scene-viewer の後に続くバージョン番号で示されます。たとえば、初期リリースではバージョン 1.0 が使用されていました。新しい Scene Viewer 機能が必要な場合は、その機能に対応する上位インテント バージョンで Scene Viewer を起動できます。
インテント バージョン 1.1 で、URL ではなく Android アプリに直接起動できる intent:// リンクのサポートが追加されました。Scene Viewer に、起動時にこの機能が利用できることを保証し、それ以外で起動しない場合は、intent://arvr.google.com/scene-viewer/1.1 インテントを使用してシーンビューアを起動します。
サポートされているインテント パラメータ
Google 検索パッケージへの明示的インテントでは、次のパラメータがサポートされています。
| インテントのパラメータ | 使用できる値 | コメント |
|---|---|---|
file（必須） |
有効な URL | この URL は、Scene Viewer に読み込む glTF または glb ファイルを指定します。URL エスケープする必要があります。 |
S.browser_fallback_url（HTML ベースのインテントの場合は必須） |
有効な URL | これは、ウェブベースの実装でのみサポートされている Google Chrome の機能です。 Google アプリがデバイスに存在しない場合は、Google Chrome の移動先の URL です。 |
mode（任意） |
3d_preferred（デフォルト） |
Scene Viewer に [View in your space] ボタンによってモデルが 3D モードで表示されます。
デバイスに AR 用 Google Play 開発者サービスが存在しない場合、[スペースで表示] ボタンは表示されません。 
|
3d_only |
Scene Viewer は、Google Play 開発者サービス（AR）がデバイスに存在する場合でも、3D モードで表示されたモデルで起動します。
[自分のスペースで表示] ボタンは表示されません。
|
|
ar_preferred |
Scene Viewer がエントリ モードとして AR ネイティブ モードで起動します。AR モードと 3D モードを切り替えるには、[View in your space] ボタンと [View in 3D] ボタンを使用できます。
Google Play 開発者サービス（AR）が存在しない場合、Scene Viewer はエントリ モードである 3D モードに正常にフォールバックします。
|
|
ar_only |
この値を使用する場合は、明示的な Android インテントを介して com.google.ar.core に対して起動する必要があります。注: 明示的な Android インテントを介して Google アプリに起動する場合は、 ar_only モードを使用しないでください。
|
|
link（任意） |
有効な URL |
外部ウェブページの URL。存在する場合は、クリックされたときにこの URL に対するインテントを作成するボタンが UI に表示されます。
|
title（任意） |
有効な文字列 |
モデルの名前。存在する場合は UI に表示されます。名前は、60 文字より後の省略記号で切り捨てられます。
|
| サウンド（省略可） | 有効な URL | glTF ファイルに埋め込まれた最初のアニメーションと同期されるループ音声トラックの URL。長さが一致するアニメーションを含む glTF とともに提供されます。存在する場合、モデルが読み込まれた後にサウンドがループされます。URL エスケープする必要があります。 |
resizable（任意） |
true（デフォルト）
|
false に設定した場合、ユーザーは AR エクスペリエンスでモデルをスケーリングできません。スケーリングは 3D エクスペリエンスで通常どおりに機能します。 |
enable_vertical_placement（任意） |
false（デフォルト）
|
true に設定すると、ユーザーはモデルを垂直面に配置できるようになります。 |
UX ガイダンス
ユーザーに可能な限り最高の UX を提供するために、行動を促すフレーズを目に見える形で表示することで、ユーザーが没入型環境に入ることを示すことをおすすめします。
3D ビューアの場合は、次のいずれかの画像のような [3D 表示] というラベルが付いた行動を促すフレーズを使用することをおすすめします。
明示的インテントを使用して Scene Viewer を起動する（AR 用 Google Play 開発者サービス）（AR モードのみ）
Scene Viewer の AR モードは Google Play 開発者サービス（AR）を利用しています。
Scene Viewer で AR を利用できるようにするには、ウェブサイトまたはネイティブの Android アプリから明示的な Android インテントを使用して、com.google.ar.core package を介して Scene Viewer を起動し、browser_fallback_url を提供します。これにより、すべてのユーザーに Scene Viewer を介したネイティブ AR エクスペリエンス、または独自に作成したフォールバック エクスペリエンスを実現できます。たとえば、独自の 3D ビューアやグレースフル エラー メッセージなどのフォールバック エクスペリエンスを構築できます。
HTML から明示的インテントをトリガーするには、次の構文を使用します。
<a href="intent://arvr.google.com/scene-viewer/1.0?file=https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/Avocado/glTF/Avocado.gltf&mode=ar_only#Intent;scheme=https;package=com.google.ar.core;action=android.intent.action.VIEW;S.browser_fallback_url=https://developers.google.com/ar;end;">Avocado</a>;
Java から明示的インテントをトリガーするには、次のコードを使用します。
Intent sceneViewerIntent = new Intent(Intent.ACTION_VIEW);
Uri intentUri =
Uri.parse("https://arvr.google.com/scene-viewer/1.0").buildUpon()
.appendQueryParameter("file", "https://raw.githubusercontent.com/KhronosGroup/glTF-Sample-Models/master/2.0/Avocado/glTF/Avocado.gltf")
.appendQueryParameter("mode", "ar_only")
.build();
sceneViewerIntent.setData(intentUri);
sceneViewerIntent.setPackage("com.google.ar.core");
startActivity(sceneViewerIntent);
サポートされているインテント パラメータ
AR パッケージ用 Google Play 開発者サービスに対する明示的インテントでは、次のパラメータがサポートされています。
| インテントのパラメータ | 使用できる値 | コメント |
|---|---|---|
browser_fallback_url（HTML ベースのインテントの場合は必須） |
有効な URL | ウェブベースの実装でのみサポートされています。 AR 用 Google Play 開発者サービスがデバイスに存在しないか最新ではない場合は、移動先の URL です。 |
mode（任意） |
ar_only |
Scene Viewer は常にネイティブ AR ビューで 3D モデルを起動し、Scene Viewer の 3D ビューアに切り替える UI はすべて非表示になります。 AR 用 Google Play 開発者サービスが存在しない場合、Scene Viewer は、ウェブベースのエクスペリエンス用に browser_fallback_url で設定した URL を起動します。
アプリベースのエクスペリエンスの場合、Scene Viewer は、エラー メッセージや自分で作成した別のエクスペリエンスなど、代替エクスペリエンスにフォールバックします。
|
ar_preferred |
Scene Viewer がエントリ モードとして AR ネイティブ モードで起動され、[View in your space] ボタンと [View in 3D] ボタンを使って AR モードと 3D モードを切り替えるオプションがユーザーに表示されます。 AR 用 Google Play 開発者サービスが存在しない場合、Scene Viewer は、ウェブベースのエクスペリエンス用に browser_fallback_url で設定した URL を起動します。
アプリベースのエクスペリエンスの場合、Scene Viewer は、エラー メッセージや自分で作成した別のエクスペリエンスなど、代替エクスペリエンスにフォールバックします。
|
|
link（任意） |
有効な URL |
外部ウェブページの URL。存在する場合は、クリックされたときにこの URL に対するインテントを作成するボタンが UI に表示されます。
バージョン 1.1 では、Scene Viewer の訪問ボタンを他のアプリに直接トリガーできるように、Scene Viewer の intent:// リンクのサポートが追加されました。これは慎重に使用する必要があり、特定のインテントに対してインテント ハンドラが存在することが確実な場合にのみ指定します。 |
title（任意） |
有効な文字列 |
モデルの名前。存在する場合は UI に表示されます。名前は、60 文字より後の省略記号で切り捨てられます。
バージョン 1.1 では、タイトル コンテンツの HTML スタイル設定のサポートが追加されました。テキストの量は任意になりました。タイトルは URL エスケープする必要があります。 |
sound（任意） |
有効な URL | glTF ファイルに埋め込まれた最初のアニメーションと同期されるループ音声トラックへの URL。長さが一致するアニメーションを含む glTF とともに提供されます。存在する場合、モデルが読み込まれた後にサウンドがループされます。 |
resizable（任意） |
true（デフォルト）
|
false に設定した場合、ユーザーは AR エクスペリエンスでモデルをスケーリングできません。スケーリングは 3D エクスペリエンスで通常どおりに機能します。 |
disable_occlusion（任意） |
false（デフォルト）
|
true に設定した場合、シーンに配置されたオブジェクトは常にシーン内の現実世界のオブジェクトの前に表示されます。詳細については、[オクルージョンを有効にする](/ar/develop/depth#enable_occlusion)をご覧ください。 |
UX ガイダンス
ユーザーに最良の UX を提供するために、以下のガイドラインを遵守することをおすすめします。
AR 体験の場合は、行動を促すフレーズを表示することで、ユーザーが没入型環境に入ることを示す必要があります。「自分のスペースで表示」の行動を促すフレーズを使用することをおすすめします。
ユーザーのデバイスに Google Play 開発者サービス（AR）がインストールされていない可能性があります。
<model-viewer>がフォールバックをどのように処理するかを次に示します。この部分は出発点として自由にお使いいただけます。// Check whether this is an Android device. const isAndroid = /android/i.test(navigator.userAgent); // This fallback URL is used if the Google app is not installed and up to date. const fallbackUrl = 'https://arvr.google.com/scene-viewer?file=https%3A%2F%2Fstorage.googleapis.com%2Far-answers-in-search-models%2Fstatic%2FTiger%2Fmodel.glb&link=https%3A%2F%2Fgoogle.com&title=Tiger'; // This intent URL triggers Scene Viewer on Android and falls back to // fallbackUrl if the Google app is not installed and up to date. const sceneViewerUrl = 'intent://arvr.google.com/scene-viewer/1.0?file=https://storage.googleapis.com/ar-answers-in-search-models/static/Tiger/model.glb&title=Tiger#Intent;scheme=https;package=com.google.android.googlequicksearchbox;action=android.intent.action.VIEW;S.browser_fallback_url=' + fallbackUrl + ';end;'; // Create a link. var a = document.createElement('a'); a.appendChild(document.createTextNode('Tiger')); // Set the href to the intent URL on Android and the fallback URL // everywhere else. a.href = isAndroid ? sceneViewerUrl : fallbackUrl; // Add the link to the page. document.body.appendChild(a);
<model-viewer> を使用して Scene Viewer を起動する
ウェブサイトから Scene Viewer を有効にするには、ar 属性を使用して <model-viewer> ウェブ コンポーネントを含めます。
<model-viewer ar
ar-modes="scene-viewer webxr quick-look"
alt="A 3D model of an astronaut."
src="Astronaut.gltf"></model-viewer>
ARCore 対応の Android デバイスで表示すると、ar 属性を持つ <model-viewer> コンポーネントを含むウェブサイトには、次の例のようなボタンが表示されます。
ar-modes で scene-viewer モードが使用されている場合、ネイティブ AR ビューに切り替わり、Scene Viewer を使用してユーザーにモデルを配置するよう促します。
AR 対応の Google Play 開発者サービスが存在しない場合、このボタンをタップすると、<model-viewer> の 3D ビューアにモデルが表示されます。
<model-viewer> の使用を開始する方法について詳しくは、<model-viewer> のドキュメントをご覧ください。
モデルのファイル要件
Scene Viewer には、モデルに対する次のサポートと制限事項があります。
| ファイル形式のサポート | glTF 2.0/glb、次の拡張機能を使用:
|
| アニメーション |
glTF ファイルに複数のアニメーションが含まれている場合、Scene Viewer は最初のアニメーションのみを再生します。 |
| 推奨される上限 |
アセットの全体的なパフォーマンスは、制約の設定と、頂点、マテリアル、テクスチャ解像度、マテリアルあたりのメッシュなどのトレードオフによって決まります。次のガイドラインに沿ってアセットを最適化してください。
|
| シャドウ サポート | ハード シャドウは、オブジェクトを配置するときに Scene Viewer によって自動的にレンダリングされるため、モデルにシャドウをベイクすることはおすすめしません。 |
| テクスチャのサポート |
|
| 素材 | PBR |
| ファイルの読み込み | HTTPS |
| シーン |
|
プレビューア ツールを使用して 3D モデルを検証する
3D モデルファイルが Scene Viewer で適切に表示されるようにするには、オンライン プレビュー ツールを使用して、PC 上のファイルを検証します。
3D モデルを検証する
モデルを検証するには、プレビュー ツールに glb または glTF ファイル、関連する画像ファイルと bin ファイル、オプションの音声ファイルが必要です。音声ファイルはアニメーション 0 でループします。
個々のファイルを複数選択することも、glb または glTF とその関連ファイルを ZIP ファイルに格納することもできます。（zip ファイル方式は音声ファイルに対応していません）。
3D モデルを検証するには:
ブラウザでオンライン プレビュー ツールを開きます。
次のいずれかの方法で、プレビューア ツールにファイルを追加します。
ドラッグ&ドロップ。glb または glTF ファイルと、それに関連するすべてのファイル（またはそれらのファイルを含む zip ファイル）を選択し、選択したファイルまたは zip ファイルをプレビューア ツールにドラッグします。
プレビュー ツールから。プレビューツールで、[Scene Viewer] > [Load File] を選択します。glb または glTF ファイルを選択し、関連するすべてのファイル（またはこれらのファイルを含む zip ファイル）を選択し、[Open] をクリックします。
3D モデルで構成されるファイルをプレビューア ツールに読み込むと、エラー メッセージを含む結果がブラウザの下部にあるコンソールに表示されます。
検証用の 3D モデルの追加
3D モデルを検証するには、3D モデルを構成するファイルをモデルエディタ ツールに追加します。
モデルを検証するには、プレビューアにモデルの glb または glTF ファイル、関連する画像ファイルと bin ファイル、オプションの音声ファイルが必要です。個々のファイルを複数選択することも、単一の zip ファイルを追加することもできます。
zip ファイルを追加する際、プレビューアは、最初に検出した glb または glTF に加え、その zip ファイル内の関連する画像ファイルと bin ファイルを読み込みます。
ブラウザで Model Editor ツールを開きます。
次のいずれかの方法で、プレビューア ツールにファイルを追加します。
検証するファイルをドラッグ&ドロップするには、glb または glTF のファイルとその関連ファイルを複数選択（またはこれらのファイルを含む ZIP ファイルを選択）して、プレビューア ツールにドラッグします。
プレビュー ツールからファイルを選択するプレビューツールで、[Scene Viewer] > [Load File] を選択します。glb または glTF ファイル、および関連するすべてのファイル（またはこれらのファイルを含む ZIP ファイル）を複数選択し、[Open] をクリックします。
検証エラー
| エラーコード | 重大度 | メッセージ | 現在サポートされている値 |
|---|---|---|---|
INVALID_INPUT_FILE_EXTENSION |
エラー | 入力ファイル [filename] に、バリデータでサポートされていないファイル拡張子が含まれています。 | ['.glb', '.gltf'] |
REC_INPUT_BINARY_SIZE_EXCEEDED |
警告 | 指定されたユーザー入力のバイナリサイズが、Scene Viewer の仕様で推奨されている上限（推奨サイズの上限 [size] MB）を超えています。 | 10 |
MAX_INPUT_BINARY_SIZE_EXCEEDED |
エラー | 指定されたユーザー入力のバイナリサイズが、Scene Viewer の仕様でサポートされている上限（サイズ上限の [size] MB）を超えています。 | 15 |
UNSUPPORTED_GLTF_EXTENSION_USED |
エラー | glTF の拡張子 [ext] は Scene Viewer の仕様でサポートされていません。 | ['KHR_materials_pbrSpecularGlossiness', 'KHR_materials_unlit', 'KHR_texture_transform'] |
ANIMATION_LIMIT_EXCEEDED |
エラー | glTF のアニメーションの数が、Scene Viewer の仕様でサポートされている上限（最大 [num] 個のアニメーション）を超えています。 | 1 |
MORPH_TARGET_USED |
エラー | glTF に、Scene Viewer の仕様でサポートされていないモーフ ターゲットが含まれています。 | |
MATERIAL_LIMIT_EXCEEDED |
警告 | glTF のマテリアルの数が、Scene Viewer の仕様で推奨される上限（最大 [num] 個のマテリアル）を超えています。 | 10 |
TEXTURE_RESOLUTION_LIMIT_EXCEEDED |
警告 | glTF のインデックス [idx] の画像の解像度が、Scene Viewer の仕様で推奨されている上限（最大解像度 [res] x [res]）を超えています。 | 2,048×2,048 |
UV_LIMIT_EXCEEDED |
エラー | glTF のメッシュあたりの UV の数が、Scene Viewer の仕様でサポートされている上限（メッシュあたりの最大 [num] UV）を超えています。 | 1 |
VERTEX_COLOR_USED |
エラー | glTF には、Scene Viewer の仕様でサポートされていない頂点の色が含まれています。 | |
JOINT_LIMIT_EXCEEDED |
エラー | glTF のジョイントの数が、Scene Viewer の仕様でサポートされている上限（最大 [num] 個のジョイント）を超えています。 | 254 |
TRIANGLE_LIMIT_EXCEEDED |
警告 | glTF の三角形の数が、Scene Viewer の仕様で推奨される上限（最大 [num] 個）を超えています。 | 100,000 |
PRIMITIVE_MODE_UNSUPPORTED |
エラー | プリミティブ モード [mode] は、Scene Viewer の仕様ではサポートされていません。 | {4 : 三角リスト、 5 : 三角ストリップ、 6 : 三角ファン} |
MISSING_PBR_METALLIC_ROUGHNESS |
情報 |
インデックス [idx] のマテリアルに pbrMetallicRoughness プロパティがありません。メタリック要素やラフネス ファクタを代わりに使用している場合、Scene Viewer の仕様ではこれは必要ありません。どちらも使用しない場合、マテリアルでデフォルト値が使用されるため、意図しない動作が発生する可能性があります。
|