usdzファイルの作り方|iOS用WebAR

シェアする

iOS12からWebARが対応しました。
Webにusdzファイルを埋めておく事でiPhoneやiPadから画像をタップするのみでARが起動します。

この記事はそのusdzファイルの作り方メモです。
(だんだん追記だらけの記事になってきた… 今度整理しよう…)

追記 202105/14

3dsMax公式のusd対応プラグインが発表されたようです。

追記 2020/9/10

Cinem4DがR23でusdz(usda/usdc)書き出しに対応しました。
DCCツールで編集したモデルがそのままusdzで書き出せるのはスムーズ。
※R23ではマテリアルの書き出しに対応してませんでしたがS24でマテリアルにも対応したようです

追記 2020/3/26

Sketchfabがusdzに対応したようです。
Sketchfab adds USDZ 3D file conversion
Sketchfabへアップロードしたモデルはusdz形式でダウンロード出来るようになっています。

追記 2020/1/13

AppleよりGUIでusdz変換が可能な「Reality Converter」がベータリリースされました。
Introducing Reality Converter
以下で説明する手順はコマンドによる変換のため少々手間がかかるものなのですが、この「Reality Converter」を用いる事でより直感的な変換が可能になりました。

追記 2018/9/21

オンラインでusdzファイルを作れるサイトがありました。
https://www.vectary.com
※ただしテクスチャ付きのモデルをアップする為にはファイルをglbにしておく必要がありそうです

追記ここまで。
以下、本題のmacのコマンドラインを利用した変換方法です。


 必要な環境

  • macOS High Sierra以降
    Windowsでは下記手順では変換出来ないのでご注意ください
  • Xcode10 Command line tools の usdz_converter を使う為
  • iOS12搭載のARKit対応端末 Safari 変換の為には必要ないが確認の為

※windowsで変換したい場合はUnityを用いる方法もあります
こちらのフォーラムが参考になります

※Xcode11以降は usdz_converter が Command line tools から外れたようなので注意

Xcode 11 から usdz_converter が Command line tools から外れた。
Apple の Augmented Reality ページからダウンロードする必要がある。
(Terminal からダウンロードしたファイル等の PATH を設定する必要あり)
※引用元記事:http://appleengine.hatenablog.com/entry/2018/06/18/160521

usdzファイルの制約

  • 10万ポリゴンまで
  • アニメーションは10秒まで
  • テクスチャーは2048×2048まで

※usdz発表時はこの制約があったようだが今は緩和されている?


手順

1.DCCツールで3Dモデル作成

3Dモデルをお好みのDCCツールで作ります。

その際以下の点に注意しましょう。
エラーとなりコンバートできませんでした。

・オブジェクト名(ファイル名ではない)に含めてはいけない文字
ドット
スラッシュ
ハイフン

・非表示オブジェクトは含めない
不要なものは削除しておきましょう。

※CINEMA4D環境で起きた現象です(他環境は未確認)

2.obj/Alembic形式で書き出し

usdzファイルを作るにはXcode10のCommand line toolsを利用します。
このツールはobjまたはAlembicをusdzに変換するもののため、DCCツールからはどちらかの形式でエクスポートしておきます。
※Alembicのアニメーションは現在対応してないようです

3.ターミナルから変換コマンド実行

ターミナルを起動しusdzが保存してあるディレクトリに移動します。

cd {ディレクトリのパス}

そこで以下のコマンドを実行。

xcrun usdz_converter {変換前ファイル名}.obj {変換後ファイル名}.usdz

これでobjがある同じフォルダにusdzが生成されます。

PBRテクスチャを含める場合は以下のようなコマンドになります。

xcrun usdz_converter {変換したいモデル}.obj {変換後の名前}.usdz
-g {マテリアル名}
-color_map {カラーテクスチャ}.jpg
-metallic_map {メタリックテクスチャ}.jpg
-roughness_map {ラフネステクスチャ}.jpg
-normal_map {法線テクスチャ}.jpg
-ao_map {陰影テクスチャ}.jpg
-emissive_map {発光テスクチャ}.jpg

jpgで書いてますがpngも対応してます。

4.サイトにusdzを埋め込む

作成されたusdzファイルとテクスチャー一式をサイトにアップします。
サイトに表示させるリンク用の画像も必要になります。
画像からのリンク先にusdzファイルを指定しましょう。

これによってiOS端末でこの画像を閲覧した際、自動的に画像の右上にWebARである事を示すusdz_iconアイコンが付きます。

対応端末でない場合はアイコンは何も表示されず画像のみ表示されます。

5.ARKit対応iOS12端末から確認

最後に動作確認です。
対応端末のSafariでusdzを埋め込んだサイトへアクセスしてみましょう。
Safari以外のブラウザは未対応です。
参考に、こちらにusdzを埋め込んだWebARサンプルがあります。


usdzはZipファイル ※2019/8/16追記

実はusdzはusdcとテクスチャをパッケージ化したzipファイルです。
普通に解凍出来ます。

usdz_unzip
※usdzファイルを解凍したところ

Noが振られたフォルダの中にテクスチャが入っています。
ですのでテクスチャは配布出来ない事情がある場合は注意しましょう。


usdz単体でもARが起動する ※2019/8/16追記

usdzはiOS用「ARファイル」と考えて良さそうです。
WebARとして使うのはあくまで一例で、usdzをiOS端末の[ファイル]アプリに入れておくと、このファイルをタップする事でARが起動します。

また[メッセージ]アプリや[AirDrop]から人に渡すことも出来ます。
ARをシェアするのにも適したファイルフォーマットになっています。


動作の様子

参考にさせていただいたサイト

コメント

  1. […] 参考にさせていただいたサイト usdzファイルの作り方|iOS12用WebAR 【iOS 12】 AR Quick Look機能で自作モデルをSafariから見る ARKit で使用されている USDZ とは何か […]