AR Quick Look講座

2018.11.07

こんにちは。代表の増本修二です。

iOS12のARkit2でAR Quick Look作ってみたので、改めてARと、AR Quick Lookについてまとめてみました。
以下ご参照ください。

※※※※※※※※※※※※※※※※※※※※※※※※※
AR Quick Look サンプルページはこちら
http://www.ag-works.com/tech/tech-quicklook/
※※※※※※※※※※※※※※※※※※※※※※※※※

【ARとは】
Augumented Realityの略で、拡張現実と呼ばれています。

・画像認識型AR
例えばsnowなど、顔を認識し、表示するタイプや、
空間を把握して表示する(今回のパターン)タイプがあります。

・マーカー認識型AR
画像などをトリガにして表示させます。
以前はこのタイプが主流でした。

・GPS位置情報連動型AR
ポケモンGOなど、ある特定の地点で表示させるタイプもあります。

※Microsoftのholorensの様に専用グラスをかけ、現実世界と同時に表示させるのを
MR(MixReality)と呼びます

今回のARは、このMRをグラスではなく、iPhoneを通して見る、というイメージです。

【ARを体験する環境】

主にスマホやタブレットのカメラを通して体験します。
後述しますが今回のAR Quick Lookは比較的新しいiPhone、最新のiOSが必要になります。

【どう行った仕組みか】

iOS12のARプラットフォーム、ARKit2の機能で表示させます。

ARKit2では、空間に配置されたテーブルや椅子、床、壁の境界など、色差、明度差から空間を把握し、実際の空間サイズを計測します。

その計測した空間に、「USDZファイル」というモデルやテクスチャなど3Dデータを一つに圧縮したファイルを「AR Quick Look」という機能でAR表示します。

Apple AR Quick Lookサンプルページ
https://developer.apple.com/arkit/gallery/

【どのようにして作れるか】

大まかな流れは

①表示するデータを用意する

②USDZファイルに変換する

③ウェブサーバーにアップする

となります。

作る環境としては主に下記が必要です。

ハードウェア:Mac
OS:MacOSX High Sierra 以上
開発用アプリ:Xcode10
3D編集アプリ:Blender

【何を表示させるか】

表示させるデータは基本的に3Dのデータです。
その3Dデータを作る必要があります。

作る方法には、
・「Blender」を使用して0から作る
・3D素材を購入する
・フォトグラメトリで撮影して作る

等があります。

今回の人物モデルはフォトグラメトリで作成しています。

フォトグラメトリとは全方位から撮影した画像をつなぎ合わせてリアルなモデルを作る手法です。
以前、レスパスビジョン様にて撮影いただいたデータを使用しました。
http://www.steam-studio.jp/3dscan-iris.htm

このデータをBlenderで調整し、OBJ形式で書き出します。

尚、表示させるUSDZファイルには下記制約があります。
・10万ポリゴンまで
・アニメーションは10秒まで
・テクスチャーは2048×2048まで

【どうやって配信するか】

上記で作成したOBJデータをUSDZに変換し、ウェブサーバーにアップします。

USDZはxcode10のコマンドラインで変換しますが、
下記サイトの様な変換サービスもある様です。
https://www.vectary.com/get-in/

ウェブサーバーにUSDZファイルを設置し、そこにiOS safariでアクセスすることで、iOSのAR機能が起動する、という仕組みです。

実際のデータが下記です。
http://webgl.cksv.biz/artest/

iOS12以上、iPhone6s以上のsafariでアクセスしてください。
モデルがヒゲのおじさんで恐縮ですが(笑)

shuzic

投稿者:shuzic

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

TOPへ