AR Quick LookとObject Captureの融合

AR Quick LookとObject Captureの融合

ビジュアルクオリティとファイルサイズの両方を最適化しながら、Object CaptureのアセットをAR Quick Lookに組み込むシンプルな方法を紹介します。AR Quick LookとObject Captureを統合してまったく新しいエクスペリエンスを生み出す方法について確認します。このセッションを最大限に活かしていただくために、WWDC19の「AR Quick Lookの最新情報」を先に視聴いただくことをお勧めします。また、WWDC20の「AR Quick Lookでオンラインショッピング」では、Apple PayやカスタムアクションをWeb上のARに統合する方法について確認できます。

リソース
関連ビデオ

WWDC21
WWDC20
- AR Quick Lookでオンラインショッピング
WWDC19
- AR Quick Lookの最新情報
- Reality ComposerによるAR体験の構築
ダウンロード

ご覧いただきありがとうございます私の名前はジェリーです Object Captureのアセットの AR Quick Lookへの導入方法をみなさんに紹介できることにワクワクしていますリマインダーとして AR Quick Lookはシステムに組込まれたARビューアです iOS全体で3Dモデルを見ることができ Safari メッセージファイルなどで利用できます AppやWebサイトに 3Dモデルを埋め込めます自分の環境でそれらを見てインタクションすることができますこれは製品をアピールするのに最適な方法ですイベントの宣伝にもなり Apple TV+の番組「For All Mankind」のインタラクティブなデモでは宇宙飛行士の宇宙服に詳しく知ることができるなど没入感のある体験の中で追加コンテンツを提供ができます
このプレゼンテーションでは Object Capture APIを使い AR Quick Look用の 3Dコンテンツを作成する方法についてお話します留意すべきベストプラクティスをユースケースに応じて紹介します
では簡単なおさらいをします AppやWebサイトに AR Quick Lookをどのように組み込むか
そして最後にいくつか AR Quick Lookの刺激的なアプリケーションを紹介しますそしてObject Captureがその作成に役立ちます
それでは早速 AR Quick Look用の 3Dコンテンツ制作プロセスを確認してみましょう以前は AR Quick Look用の3D コンテンツを作成する場合 3Dモデリングソフトの使用する必要がありましたしかし通常は高価で誰もが簡単に手を出せるものではありませんでしたそこで今年新しいObject Capture API を導入しました RealityKitに内蔵されていて従来とは違う方法で USDZファイルを生成します対象物の静止画のコレクションから高品質な3Dモデルを作成することができます
Object Captureは AR Quick Lookで直接見ることができる USDZファイルを作成するための作業を行いますこの他 Reality Composerを使うこともできますモデルにインタラクティブなカスタム動作の追加もできます例えばタップトリガーやカメラアクションをデジタルシーンに追加できます
これらの技術を組み合わせることで誰でも簡単に臨場感あるAR体験を作ることができるようになりました実際にこのワークフローのデモを見てみましょう手作りの陶器を販売するネットショップを始めましたひとつご紹介します
この鉢の3Dモデルを作成し動作を追加する方法をお教えしますお客様が購入される前に自分の机の上で様々な多肉植物と一緒にプレビューできるようにするためですその前に実際に見てみましょう
バーチャル多肉植物が机の上に置かれていますもっと近くで見てみましょう幾何学的ならせん形のものが詳細に見えます
それでは他の多肉植物も見てみましょう緑のものをタップしてみると… 赤のものに切り替わりますさらにチェックしてみましょうもう一度タップしてみます
グレーのすごくいいですね鉢との相性がいいですね本物と比べてどう見えるのか気になります
うわー説得力ありますね葉っぱが大きくなった以外はね数週間前にこれをスキャンした時よりもさて　念のために Object Captureはバーチャルな植物を自動的に成長させることはありませんもしお望みならReality Composerを使いスケールを変更することでそれをシミュレートできますこれはオンラインショップの素晴らしいアセットになると思いますこの作品を一から作った方法をご紹介しましょうまずは多肉植物の鉢を単体で撮影することから始めましたニュートラルな背景であらゆる角度から
その後Object Captureを使ってUSDZモデルを作成同様に以下の手順を繰り返しました多肉植物のそれぞれについてこれらの手順を繰り返し 3つの異なるUSDZモデルを作成しましたではReality Composerで動作を追加することで同じ鉢に植えられた別の多肉植物に入れ替える方法をご紹介しましょう
鉢のベースを追加したプロジェクトが開始されています 3つの多肉植物を配置して鉢の中にきちんと収まるようにしています動作の追加してみましょう追加したのは「起動時に隠す」という動作です最初は緑の多肉植物だけが表示されるようにしました誰かが緑の多肉植物をタップすると入れ替わるように赤色の多肉植物を表示しますそのために「非表示」と「表示」のアクションに加えてタップトリガーを追加その後この手順を繰り返し赤からグレーにグレーから緑へと入れ替えることができますこれで完成です！あとはアセットをエクスポートしますそして先ほどのように AR Quick Lookで見ることができます
Object Capture を使っていかに簡単にコンテンツを作れるかを確認しました AR Quick Lookでの表示におけるモデルのエクスポートに関するベストプラクティスについてご紹介します Object Captureを使って USDZファイルを書き出す際にはどの詳細設定を使うかが重要になりますそれぞれの設定の特徴を表にしてみましたこの表を使って説明しますビジュアルの忠実さとファイルサイズとの間には常にトレードオフがあります USDZのエクスポートファイルサイズを小さくすることは AR Quick Lookにおける重要な考慮点ですなぜならユーザーにとってはダウンロード時間の短縮につながるからですどのような詳細設定を選んでもObject Captureは常に同じアルゴリズムを採用し高品質な再構築の生成を行うことができますしかし様々なレベルのメッシュデシメーションの適用とテクスチャのダウンサンプリングを指定された詳細設定に応じて行います ReducedとMediumの詳細設定はビジュアルの忠実度とファイルサイズのバランスが取れていますそのため AR Quick Look用のコンテンツを作成する際にはまずReducedとMedium 両方の詳細設定でエクスポートすることをお勧めしますそして見た目の違いやその他の重要な点を評価した上でどちらを残すかを選ぶことができますこれについては次にお話します今見てきたように Reduced詳細設定ではファイルサイズが最も小さくなりますそのためモデルを閲覧するまでのダウンロード時間を短縮することができ Web配信に最適ですまたこれは複数のアセットを結合する場合に推奨される設定です 1つのシーンの中で多肉植物のコレクションを紹介するのもこれに該当しますこれらの属性により Reduced詳細設定は多くのユースケースに適しています
特定の場面でビジュアルの品質に大きな違いがあることに気づいた場合 ReducedとMedium間の設定では Medium詳細設定が適しているかもしれません大抵は複雑なオブジェクトを対象にした場合が該当します Object Captureによる再構成のために何百枚もの画像を撮る必要があります覚えておいてほしいのはファイルサイズの大きい USDZが生成されることですですので複数のモデルを一緒にしない方が良いです例えば多肉植物と鉢を鉢を一緒に撮影するようなケースです同じような感じで Medium詳細設定は Appに適していますアセットのローカルコピーがすでにデバイス上にありダウンロード時間を短縮できますまとめてみると両方の詳細設定を評価してください判断の基準は対象物やユースケースに応じたものとし作成したアセットは様々なiOSハードウェアでテストしてデバイスの互換性とパフォーマンスを確認しますどちらの詳細設定でもソースの品質を確保するのがベストです常にシャープな画像を撮りぶれないようにして高品質な再構成へと繋げますまた隣り合う写真同士の重なりを70％以上確保しフレームいっぱいに被写体を入れるようにしますさらに詳しくは「Capturing Photographs」をご覧くださいまた「Object Capture」のセッションもチェックされることをお勧めしますベストプラクティスがわかったところで AR Quick Lookを組み込む方法をおさらいしましょうご存知の通り AR Quick Lookは数行のコードで AppやWebサイトに組み込むことができますその方法について簡単に振り返ってみましょう
AR Quick Lookを Appに組み込む場合 Quick Lookフレームワークを使うことができますここでは新しい QLPreviewController を作成しデータソースに「self」を割り当てます通常のビューコントローラーのように表示します
もちろん QLPreviewControllerの dataSourceプロトコルを実装する必要がありますこれはQuick Lookにプレビューを何枚表示するかやそれぞれの内容を伝えます
ここではディスク上のローカルファイルの URLを持つARQL previewItemを作成しますそしてそれを返しますシステムはAR Quick Look を提示するようにします
体験をカスタマイズする方法も提供しています例えば ARモードのコンテンツに対して現実空間に配置されたオブジェクトを実際の大きさで見れるようにスケーリングを無効にすることができます allowContentScalingプロパティをfalseに設定します
AR Quick Look体験を Webサイトに組み込む場合 HTMLにこのタグスニペットを追加しますそして自分のモデルとサムネイルのURLに置き換えます
そして rel=“ar“ 属性を必ず入れてくださいサムネイルにARバッジのアイコンが追加されます先ほどと同様に ARのコンテンツ拡大と縮小を無効にすることが Webにも組み込めますコンテンツスケーリングを無効にするには allowContentScalingに 0を設定します
Webサイトに組み込む場合は ApplePayやカスタムアクションを表示することもできます先行予約のようなカスタムアクションを直接AR Quick Lookに表示できますお客様が注文の流れの中で次のステップに進むことができるようにします
AR Quick Lookでできることのほんの一部を簡単にまとめてみましたさらなる詳細については以前のセッションをご覧ください
ではAR Quick Lookを使った実際の応用例をご紹介します Object Captureの発表により 3Dコンテンツの制作から配信までの流れがより身近なものになり誰でもアクセスできるようになります Object CaptureはUSDZ ファイルを生成するための重い作業を担います Reality Composerを使えばマルチアセットシーンを簡単に作りモデルに機能を追加できます AR Quick Lookは視聴体験を提供します iOS上のAppやWebサイトまたmacOSでも利用可能です
これらの技術によってより改善された体験と新しい体験の両方を様々な分野で生み出すことができますいくつかの例を見てみましょう E-コマースは最も人気のあるAR Quick Lookのユースケースの一つでありそれには理由があります 3Dモデルを AR Quick Lookで見ると商品を自身の空間でイメージできます靴でも写真立てでも家具でもそしてObject Captureによって小売業者は3Dモデルを簡単に作成できるようになります以前に 3Dの経験がなかったとしても GOAT Appのチームのように Fragment Designのエアジョーダン3 スニーカーのモデルを Object Captureを使用して作成することができます Reality Composerを活用すると動作を追加することで視聴体験を向上できます例えば多肉植物のデモで示したように多肉植物を入れ替えることができます顧客が様々な服や財布をプレビューできる Appを作ることができます
もう一つのユースケースは美術館です歴史的工芸品は保護ケース内に保管されていることが多いですそのためあらゆる角度から見ることができませんしかし対象物を3Dで撮影することで自分のデバイスでその人工物の詳細な仮想表現を見たりインタラクションができます AR Quick Lookによって美術館や博物館を遠隔で見学できるだけでなく実際の場所における新しい展示も可能ですバーチャルな世界でしか体験できない
3Dコンテンツの説明や目の不自由な方のためにナレーション音声を入れることもできますメトロポリタン美術館の Zemi figureのようです聴いてみましょう西暦1000年頃カリブ海に浮かぶアンティル諸島に住むタイノ文明の彫刻家によって作られましたおそらく現在のドミニカ共和国です
Object Captureと AR Quick Lookの他のユースケースとしては教育の分野があります図や映像は歴史的に見ても2Dですこれは時に 3Dの概念を伝えることを難しくしてしまいます拡張現実を使えば 3Dで教えることができます先生が魅力的なレッスンを Object Captureの3D モデルを活かして作成できますテクノロジーが提供する即時のフィードバックとインタラクティビティによって生徒が自分のペースで学び発見できますこれは教師の授業計画に役立つだけでなく子供たちもARで自分の創造性を発揮できます例えば Qlone Appを使うと子供たちが 3Dモデルを作れます自分の好きなおもちゃやアートプロジェクトなどです Appが便利なビジュアルガイドを提供し自動的に適切な写真を撮れます Qloneは iOSとMacの App間でシームレスにインテグレーションされた Object Capture 技術の導入に取り組んでいます子供たちが作ったものを友達や家族と共有することが容易になります Appleの同僚の子供たちを招待したのですが彼らが行った仕事の一部を紹介したいと思います写真を撮影して Object Captureで 3Dモデルを作成して子供たちが Reality Composerを使用しデジタルインタラクションを加えましたチェックしてみましょう 1つ目は音声とともに現実となった恐竜の着ぐるみです
お皿やカップも飾ってある素敵なセットもあります
フグとタコの間に吹き出しが入るというクールなインタラクションが行われています吹き出しは常に自分の方を向いてます
クールでクリエイティブなアートプロジェクトですね今見ていただいたように没入感のあるAR体験を Object Capture Reality Composerと AR Quick Lookを組み合わせてゼロから開発できるようになりました Object Captureにより AR Quick Lookですぐに見ることができる高品質なアセットを作成できます Reality Composerで複数のアセットを 1つのシーンにまとめたりインタラクティブ性をモデルに追加できます
詳細はこちらをご覧ください AR Quick Look Gallery ページで実例をご覧になりまた「Object Capture」のセッションもご覧くださいこれで終わりますご覧いただきありがとうございました [音楽]

8:02 - Integrating AR Quick Look in your app

// File: MyPreviewController.swift
func presentARQuickLook() {
	let previewController = QLPreviewController()
	previewController.dataSource = self
	present(previewController, animated: true)
}

// MARK: QLPreviewControllerDataSource
func previewController(
  _ controller: QLPreviewController, previewItemAt index: Int) -> QLPreviewItem {
	  let previewItem = ARQuickLookPreviewItem(fileAt: fileURL) // Local file URL

	  return previewItem
}

特定のトピックをお探しの場合は、上にトピックを入力すると、関連するトピックにすばやく移動できます。

クエリの送信中にエラーが発生しました。インターネット接続を確認して、もう一度お試しください。

リソース

関連ビデオ

WWDC21

WWDC20

WWDC19