今年もWebARの季節がやって参りました！
去年はAr.jsとBItBalloonを使ったマーカー有りWebARを作ったそうです。（覚えてない）
マーカー無しもちょっとやったけどあんまり実用的じゃなかった。
普段Webをやらないので、WebAR系はめっちゃ疎いんですけど進化しているのでしょうか？？？
USDZ
調べたらUSDZという形式の3Dモデルならios12で簡単に表示できるそうです。
ARKit - AR Quick Look Gallery - Apple Developer
AR Quick Look
このUSDZを見るにはAR Quick Lookを使えばいいそうです。
AR Quick Lookの実装はsafariで見るかアプリに組み込むか。
・safariで見る方法
・アプリに組み込む方法
今回はもちろんsafariで見る方法を実装します。
追記：USDZファイルを作る（コマンドライン）
ちょっとUSDZファイルが欲しくなったのですが、Vectaryで作れなくなっていたのでコマンドラインを使いました。簡単。
デスクトップにobjファイル置いて、
cd desktop
xcrun usdz_converter leo.obj leo.usdz
でできました。
テクスチャとかはついてない？
ここで使いました。
結局使えなかったけど。
USDZファイルを作る（Vectary）
USDZファイルを作れるサイトの紹介があったのですが、なんとそのままwebに組み込めます！！！！
Vrctaryです。アカウント作ってログインして作ります。
こんな感じの画面です。
左上のメニューから自分で作ったobjモデルなどをimportできます。
下の3DAssetsにも3D素材があります。
GooglePolyと連動しているようです！
でも色々試したけど全部テクスチャがなかったです。
下のAdd onsから3Dの文字や2D画像もいれられます。
ただ日本語は無理っぽい
メッセージを日本語で入れたかったので、iPadで書いて2Dのimageとして読み込みます。ちゃんと透過してる！
完成したら右下のExportから書き出し
サイトに貼り付け
メールにリンクが届くので開くと・・・
USDZファイルをダウンロードすることもできますし、コードだけコピーしてブログに貼り付けることもできます！
こんなかんじ！
ios12のsafariでタッチして開いて上のARを押す
床を認識させる。
できた！！！！！やば！簡単やん！
影も勝手に落ちるし、大きさ・位置・回転変更も直感的にできます！神！！！
ちなみにこんな感じで表示されない時もありました。重いのか？
GoogleSiteに埋め込み！
はてなブログに簡単に埋め込めるので、このブログを使ってもいいのですが、プライベートなことだし、私のブログ親に教えてないので別のサイトを使いたいです。
index.htmlにコードをコピペするだけですぐに使えるので、去年と同じくBItBalloonなどにアップロードしてもいいのですがもっと簡単な方法があります！
GoogleSite!
簡単にwebページが作れるものです。
埋め込みに対応しているか半信半疑だったのですが、ちゃんと対応していました！
はい神。
重い
最初はすんなりいったけど、オブジェクトを増やしたら重くて開かないです。
ネットの回線なのか端末なのかGoogleSiteなのかVectaryなのか
まずオブジェクトを読み込むのにすごい時間がかかる。
しかも読み込んでもARにするとこの画面になる。
universal scene descriptionってなんやねんと思いググったらライブラリの名前？みたいで特に意味はない。
appleのサンプルサイトは読み込みは時間かかったけど一応ARできたからな〜
オブジェクト減らしていったら時間はかかるけど表示できるようになった！
プレゼントボックスが重いっぽい。
追記：父親のiPhoneXだと一瞬で読み込まれた。。。
ええーーーー
えげつな
私の努力〜〜
最後に
ios12のかたはやってみてください！
楽しい！
Arkit*Unityの参考書が出てた！
こちらのswiftの本の中にもARの解説があるそうです。
SwiftでのARkitコンテンツの作り方はこちらのboothの書籍も良さそうです！
