🔍

モバイル版のGoogle検索で3DモデルとARが表示されるもの一覧(2021/07版) #Google3D #Google検索ARで遊ぼう

2020.12.22に公開2021.07.25に更新

WebXR

WebAR

tech

2019年9月から、モバイル版の Google 検索で特定の動物を AR で表示できるようになりました。2020年12月現在は、動物以外にも恐竜や昆虫などが、そして「先行プログラム」として特定のアイテムを表示できます。

--- 2021/07/26 追記 ---

2021年7月21日から、東京 2020 オリンピック・パラリンピックにあわせて10人のオリンピアンが追加されました。

--- 2021-06-23 追記 ---

2021年6月22日から、映画『ゴジラvsコング』の公開にあわせてゴジラとコングのアニメーション付き 3D モデルが追加されました。

--- 2021-05-19 追記 ---

2021年5月19日から、スポーツ選手のアニメーション付きモデルが追加されました。

--- 2021-04-20 追記 ---

2021年4月20日から、ガンダムやハローキティなど、日本のキャラクターが追加されました。

本エントリでは、言語設定が日本語のモバイル版 Google 検索で、実際に AR で表示できるものを一覧化しています。

動作環境

動作環境と表示されるものの一例は Google の公式サイトで示されています。

iOS

2021/04 現在、iOS で 3D 表示するには Google アプリが必須となっています。

iOS の AR 表示は “ARKit” に依存しているため、ARKit の動作要件と同じで、端末は iPhone 6s 以降、OS バージョンは 11 以降が動作条件となります。ブラウザは Safari を推奨します。

なお、iPad の場合、「デスクトップ用Webサイトを表示」ではなく「モバイル用Webサイトを表示」にしていれば 3D は表示されますが、AR は表示できません。

Android

Android の AR 表示は “ARCore” に依存しているため、ARCore の動作要件と同じで、端末は ARCore supported devices に挙げられている ARCore に対応しているもの、OS バージョンは Android 7 以降が動作条件となります。ブラウザは Chrome を推奨します。

実際に表示できるもの一覧

確認した諸条件は次の通りです。

Google 検索の言語設定は日本語
端末は iPhone 11 Pro
OS バージョンは iOS 13.4
ブラウザは Safari

付随する条件は次の通りです。

括弧内のものは、実際に表示される名前です。
例えば『トラ(ベンガルトラ)』の場合、「トラ」で検索すると「ベンガルトラ」として表示されます。
二重括弧内のものは、英語で検索しないと表示されないものです。
例えば『angler fish((アンコウ))』の場合は、「アンコウ」で検索すると表示されませんが、「angler fish」で検索すると表示されます。
三重括弧内のものは、三重括弧内のもので検索しないと表示されないものです。
例えば『スフィンクス(((スフィンクス猫)))』の場合は、「スフィンクス」で検索すると表示されませんが、「スフィンクス猫」で検索すると表示されます。

2019年9月に実装されたもの

トラ(ベンガルトラ)
パンダ(ジャイアントパンダ)
ヒョウ(アフリカヒョウ)
チーター
ポニー(シェトランドポニー)
クマ(ヒグマ)
オオカミ(シンリンオオカミ)
ヘビ(ボールニシキヘビ)
ウマ(アラブ種)
アライグマ
ハリネズミ(ナミハリネズミ)
シカ(オジロジカ)
カモ(マガモ)
アリゲーター(アメリカアリゲーター)
サメ(ホホジロザメ)
タコ
カメ(アオウミガメ)
コンゴウインコ
ペンギン(コウテイペンギン)
ワシ(イヌワシ)
ポメラニアン
ゴールデン・レトリーバー
イヌ or ラブラドール(ラブラドール・レトリバー)
ロットワイラー
フレンチ・ブルドッグ
パグ
ネコ(アメリカン・ショートヘア)
アルパイン種
angler fish((アンコウ))
ブルドッグ*

Ref. 「Google検索で動物のAR」登場するのは全部で29、その種類をよく見たら

2020年7月のアップデートで実装されたもの

恐竜と翼竜

月初に Jurassic World Alive とのコラボで恐竜と翼竜あわせて 10 種が加わりました。

ティラノサウルス
ヴェロキラプトル
トリケラトプス
スピノサウルス
ステゴサウルス
ブラキオサウルス
アンキロサウルス
ディロフォサウルス
プテラノドン
パラサウロロフス

Ref. Google 検索の AR 機能で恐竜を現代に

昆虫

月末に Google 昆虫 AR ! 夏休みフォトコンテストとのコラボで 23 種の昆虫が加わりました。

カブトムシ
ヘラクレスオオカブト
アトラスオオカブト
ノコギリクワガタ(クワガタムシ)
オオクワガタ
ミヤマクワガタ
タマムシ
テントウムシ
ホタル
アゲハチョウ
モルフォチョウ
ヨナグニサン
カマキリ
トノサマバッタ(バッタ)
トンボ
セミ(アブラゼミ)
ミンミンゼミ
周期ゼミ
ツクツクボウシ
ヒグラシ
オオスズメバチ
カミキリムシ(ルリボシカミキリ)
Leiodidae((マンマルコガネ))

Ref. ヘラクレスオオカブトや約 20 の昆虫が AR 機能に登場

2020年12月のアップデートで実装されたもの

2020年12月のアップデートで実装された動物はすべて「Google アプリを使って実空間に表示」となり、iOS Safari の WebAR として AR 表示ができません。

犬

秋田犬*
オーストラリアン・シェパード*
ビーグル*
ボーダー・コリー*
ブル・テリア*
イタリアン・コルソ・ドッグ*
チャウ・チャウ*
cocker spaniel((コッカー・スパニエル))*
ダックスフント*
ドーベルマン*
シェパード(ジャーマン・シェパード・ドッグ)*
グレート・デーン*
珍島犬*
子犬(パピー)*
マルチーズ*
プードル*
シュナウザー*
柴犬*
シーズー*
ウェルシュ・コーギー・ペンブローク*
ヨークシャー・テリア*
チワワ*
ピットブル*
シベリアン・ハスキー*

表示されるとされているが表示されなかったもの

『ピットブル』は、「ピットブル」でも「アメリカン・ピット・ブル・テリア」でも「Pit Bull」でも「American Pit Bull Terrier」でも、検索結果には「3D 表示」ボタンが表示されませんが、「その他のコンテンツ」から表示できます。

猫

メインクーン*
子猫*
ベンガル*
メインクーン*
ノルウェージャンフォレストキャット*
ペルシャ*
ラグドール*
ロシアンブルー*
スコティッシュフォールド*
シャム猫(シャム)*
スフィンクス(((スフィンクス猫)))*

その他

コヨーテ*
乳牛*
去勢牛(農耕去勢牛)*
pig((ブタ))*
ロバ*
tamias((シマリス))*
モルモット*
ハムスター*
フェネック(フェネックギツネ)*
カバ*
シマウマ*
レッサーパンダ*

Ref. モバイル版Google検索結果のAR表示に柴犬やシャム猫、ハムスターなど50種追加
Ref. Google opens the door for 50 new AR animals to jump into your living room

ベビーヨーダ

スター・ウォーズ実写ドラマ『マンダロリアン』とのコラボでベビーヨーダが追加されました。

the child または baby yoda(ザ・チャイルド)

2021年4月に実装されたもの

2021年4月のアップデートで実装されたキャラクターはすべて「Google アプリを使って実空間に表示」となり、iOS Safari の WebAR として AR 表示ができません。

ウルトラマン
ウルトラマンゼロ
ウルトラマンベリアル
ゴモラ
エヴァンゲリオン
オデュッセウスガンダム
Ξガンダム
ペーネロペー
こぎみゅん
ハローキティ
キキ＆ララ
ポムポムプリン
パックマン
太鼓の達人

Ref. ガンダムやハローキティなど、日本のキャラクターが AR 機能に登場

2021年5月に実装されたもの

Google I/O 2021 にあわせてスポーツ選手のアニメーション付き 3D モデルが追加されました。

2021年5月のアップデートで実装されたキャラクターはすべて「Google アプリを使って実空間に表示」となり、iOS Safari の WebAR として AR 表示ができません。

🎾 テニスの大坂なおみ選手
⚽ サッカーのミーガン・ラピノー選手
🤸 体操のシモーネ・バイルズ選手

各選手ともに 3 つのアニメーションが用意されていて、3D 表示中にアニメーションを変更できます。

2021年6月に実装されたもの

映画『ゴジラvsコング』の公開にあわせてゴジラとコングのアニメーション付き 3D モデルが追加されました。

2021年6月のアップデートで実装されたキャラクターはすべて「Google アプリを使って実空間に表示」となり、iOS Safari の WebAR として AR 表示ができません。

ゴジラ
コング ( 「キングコング」で検索した場合は表示されない )

2021年7月に実装されたもの

東京 2020 オリンピック・パラリンピックにあわせて10人のオリンピアンが追加されました。
厳密には3選手は2021年5月に実装されたものと同一です。

オリンピアンのようにスポーツを楽しんでみたいと思ったことはありませんか？ Google 検索の AR 機能に10 人のオリンピアンが登場します。スマートフォンで検索し、[3D 表示] をタップすると、オリンピアンが 3D で検索結果に表示され、回転や拡大することもできます。また、実際の風景にも表示できるので、自分の部屋に選手を呼ぶことができます。

2021年7月のアップデートで実装されたキャラクターはすべて「Google アプリを使って実空間に表示」となり、iOS Safari の WebAR として AR 表示ができません。

🛹 スケートボード or レティシア・ブフォーニで検索
- レティシア・ブフォーニの360キックフリップ
- レティシア・ブフォーニのミニランプ
- レティシア・ブフォーニのボードスライド
🎾 テニス or 大坂なおみで検索 (既存)
- 大坂なおみの時速200キロのサーブ
- 大坂なおみのラリー
- 大坂なおみのテニスのショット
🤺 アレクサンダー・マシアラスで検索 (フェンシングでは出てこない)
- アレクサンダー・マシアラスの有効打
- アレクサンダー・マシアラスの振り込み
- アレクサンダー・マシアラスのパラード
🏊 競泳 or ケーレブ・ドレッセルで検索
- ケーレブ・ドレッセルの自由形
- ケーレブ・ドレッセルのバタフライのストローク
- ケーレブ・ドレッセルの競泳スタート
🏃 二クラス・カウルで検索 (陸上競技では出てこない)
- 二クラス・カウルの5m棒高跳
- 二クラス・カウルのやり投
- 二クラス・カウルのハードル
- 二クラス・カウルの走高跳
- 二クラス・カウルの砲丸投
- 二クラス・カウルの円盤投
- 二クラス・カウルの走幅跳
🏃 ディナ・アッシャー＝スミスで検索 (陸上競技では出てこない)
- ディナ・アッシャー＝スミスの短距離走
- ディナ・アッシャー＝スミスのもも上げ (短距離走と同じ)
- ディナ・アッシャー＝スミスに挑戦
- 高速で走るディナ・アッシャー＝スミスのスロー
⚽ ミーガン・ラピノーで検索 (既存)
- ミーガン・ラピノーのリフティング
- ミーガン・ラピノーのドリブルとパス
- ミーガン・ラピノーのフリーキック
🏸 バドミントン or シンドゥ・プサルラで検索
- シンドゥ・プサルラのジャンピングスマッシュ
- シンドゥ・プサルラのラリー
- シンドゥ・プサルラのバドミントンのショット
🤸 体操競技 or シモーネ・バイルズで検索 (既存)
- シモーネ・バイルズの後方抱え込み2回宙返り3回ひねり
- シモーネ・バイルズの後方2回宙返2回ひねり
- シモーネ・バイルズの連続ジャンプ
オリンピック or Olympicで検索
- オリンピック関連のすべてが表示される

なお、既存の3選手を含み10選手が追加されたことになっていますが、筆者は9選手までしか確認できていません。

Appendix: 3D 表示と AR 表示の仕組み

ここから先は技術的な話です。

Scene Viewer

この 3D 表示と AR 表示は ARCore 1.9 で実装された WebAR を実現する Scene Viewer によって成り立っています。これは「3D 表示」ボタンをタップ後、実際に 3D と AR を表示するサイトの遷移先 URL に scene-viewer が含まれていることからも明らかです。

e.g. https://arvr.google.com/scene-viewer/web?file=...

ARCore の Scene Viewer は ARKit の AR Quick Look に近しい存在ですが、もちろん異なる部分もあります。

この Scene Viewer を使って 3D モデルや AR を表示する方法については、ARCore のドキュメントとして詳細が示されています。

ドキュメントの冒頭にパラメーターも説明されているので、『猫』で検索したときの URL を参考に紐解いていきましょう。

e.g. https://arvr.google.com/scene-viewer/web?file=https://storage.googleapis.com/ar-answers-in-search-models/static/ShortHairedCat/model.glb&title=アメリカン・ショートヘア&referrer=google.com:ANIMALS:ios_intent_with_upsells&sound=https://storage.googleapis.com/ar-answers-in-search-models/static/ShortHairedCat/Feline_AmericanShortHair_Unisex_Adult.mp3&card_content=https://arvr.google.com/searchar/infocard?data%3DCg0vZy8xMWo5NzNiNW0wEAE%26hl%3Dja-JP%26hl%3Dja-JP%26gl%3Djp&fdl

file パラメーターには 3D モデルの URL が含まれています。

file=https://storage.googleapis.com/ar-answers-in-search-models/static/ShortHairedCat/model.glb

3D モデルには複数のフォーマットが存在していますが、Scene Viewer が対応しているのは Google 検索でも使われている .glTF のバイナリ形式にあたる .glb 形式と、ARKit の標準フォーマットにあたる .usdz 形式の 2 種類だけです。

title パラメーターには URL エンコードされた名前が含まれています。

title=%E3%82%A2%E3%83%A1%E3%83%AA%E3%82%AB%E3%83%B3%E3%83%BB%E3%82%B7%E3%83%A7%E3%83%BC%E3%83%88%E3%83%98%E3%82%A2

この例ではアメショこと「アメリカン・ショートヘア」となります。

referrer パラメーターには遷移元などのリファラー情報が含まれています。

referrer=google.com:ANIMALS:ios_intent_with_upsells

sound パラメーターには鳴き声などの音声データが含まれています。

iOS の場合は Google アプリを使わなければ鳴き声を聞けませんが、URL に直接アクセスすると聞けます。
また、ティラノサウルスのように、現代には存在していないものはどうしているのか気になりましたが、ジュラシック・ワールドとのコラボということもあってか (おそらく) 映画で使われている声が含まれています。

sound=https://storage.googleapis.com/ar-answers-in-search-models/static/ShortHairedCat/Feline_AmericanShortHair_Unisex_Adult.mp3

アメリカン・ショートヘアの鳴き声

ティラノサウルスの鳴き声

card_content パラメーターには「その他の動物」として表示される infocard の情報が含まれています。

card_content=https://arvr.google.com/searchar/infocard?data%3DCg0vZy8xMWo5NzNiNW0wEAE%26hl%3Dja-JP%26hl%3Dja-JP%26gl%3Djp

検索結果に「3D 表示ボタン」を追加できる先行プログラム

本エントリの冒頭でも触れていますが、この Google 検索で 3D および AR が表示される仕組みには「先行プログラム」が存在しています。

猫や犬といった動物などは、検索してすぐに「3D 表示」ボタンが表示されますが、この位置は SEO 観点でも非常に強力なものであり、自由に設定できるものではありません。

しかし、「先行プログラム」に申し込み、審査を通過したものについては、検索結果のページ上部ではなく、スクロールしている途中に「3D 表示」ボタンを表示させることができます。これは Google 検索セントラルのドキュメント「上級者向け SEO」として示されています。

一例として、ドキュメントでも示されている「Keurig K-Mini Single-Serve K-Cup Pod Coffee Maker : Target」が挙げられます。

<model-viewer> を使って検索結果ではなく自分のウェブサイトに 3D と AR を表示する方法

前述の先行プログラムは検索結果に表示されることにより、SEO の効果が得られますが、何でもかんでも適用してもらえるわけではなく、一定の審査があり、決して簡単とは言えません。

本エントリでは <model-viewer> の詳細は省きますが、Web Component のひとつである <model-viewer> を使うことで、検索結果ではなく自分のウェブサイトであれば、誰でも自由に 3D と AR を表示させられます。

気になる方は公式ドキュメントを参照してください。

サンプルとして用意されている `<model-viewer>` を使った WebAR の一例

上記のような見た目は下記のコードで実現できます。

<!-- Import the component -->
<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>
<script nomodule src="https://unpkg.com/@google/model-viewer/dist/model-viewer-legacy.js"></script>

<!-- Use it like any other HTML element -->
<model-viewer src="../../shared-assets/models/Astronaut.glb" ar ar-modes="webxr scene-viewer quick-look" ar-scale="auto" camera-controls alt="A 3D model of an astronaut" skybox-image="../../shared-assets/environments/aircraft_workshop_01_1k.hdr" ios-src="../../shared-assets/models/Astronaut.usdz"></model-viewer>

Ref. https://modelviewer.dev/examples/augmentedreality/#ar

前述の通り iOS 向けであれば AR Quick Look でも実現できますが、AR Quick Look は USDZ にしか対応していないため、Android ユーザーは見れません。この <model-viewer> であれば Android ユーザー向けに GLB を、iPhone ユーザー向けに USDZ を用意することで、環境によって 3D モデルをライブラリ側で出し分けてくれるので、とても便利です。

現場からは以上です！

Discussion

ログインするとコメントできます