[WebAR]iOSのSafariでARを表示

iPhone上のSafariでARのオブジェクトを表示するまでを試した。

  1. iPhoneXで70枚ほど物体の写真撮影
  2. 撮影した写真から3Dモデルをツールで生成(objファイル)
  3. 生成した3Dモデルをツールでフォーマット変換(obj->usdz)
  4. HTMLに生成したusdzファイルを組み込む

コード

usdzファイルがあればHTMLに埋め込むことで、iOSのAR Quick Lookという機能でiPhoneやiPadのSafariで表示できる。
AppleのARKitのドキュメントにサンプルコードがある。

<div>
	<a rel="ar" href="item/touki-mug.usdz">
		<img src="IMG_touki-mug.jpg">
	</a>
</div>

結果

自分でARの3Dモデルを生成してHTMLに埋め込んで見た結果が以下のような感じ

  • ARのクオリティが低すぎる
  • 縮尺がおかしい(100%で実寸になってほしい)
  • ARの操作が難しい(中心の位置がおかしいのかな)
  • 目的の物体以外を削りたい

参考

AR Quick Lookを使ったモデルのプレビュー




ARでToDoを楽しく管理
iPhone用スマホアプリ
「Air ToDo」

空間上で楽しく管理するAR ToDoリストです。
チェックマークに3Dのパンダが使えるようになりました。




コメントを残す

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