DEV Community

IZUN∀
IZUN∀

Posted on

VRMとAR Quick Lookで遊ぼう

最近Twitterで知人がVRMモデルをusdzに変換して遊んでるのを見かけたので自分もやってみた。
会社で遊んでた際に、ふと「あれ?これ遊びたい人多いと思うけど手順が結構プログラマ向けだな?」と思ったのでわかりやすい記事を書いてみようと思ったので実行(ΦωΦ)

準備するもの

Mac
対応してるiPhone or iPad
VRMデータ
AppleID
usdz変換ツール
usdzをアップする場所

VRMの準備

VRoidHubで持ってきたらいいんでない?(ΦωΦ)
https://hub.vroid.com/

usdz変換ツール

↓ここからDLできるよ入るときAppleID必要だよ(ΦωΦ)
usdz変換ツール

スクリーンショット 2019-10-23 0.05.27.png

0.61のバージョンをDLして来たら適当に解凍しておきましょう。

VRMモデルを.glbに変換

VRMモデルデータの.vrmを名前変更で.glbに変更してください(ΦωΦ)
スクリーンショット 2019-10-23 0.11.09.png

こんな感じね。

そしたらルートの直下にでも置いてください。
ルートがわからないとな?(ΦωΦ)
他のQiitaの記事で「Macの使い方」とか探して勉強して行きましょう(’ΦωΦ)

usdz変換ツールを使ってusdzに変換

さて、先程ダウンロードして適当なところに解答した変換ツールの中に「USD.command」というのがありますね(ΦωΦ)
スクリーンショット 2019-10-23 0.17.23.png
これを起動します。
スクリーンショット 2019-10-23 0.20.46.png

こんな感じのが出てくるので
ここで先程の.glbファイルを変換します。
usdzconvert ****.glb って入れて
スクリーンショット 2019-10-23 0.24.22.png

スクリーンショット 2019-10-23 0.25.30.png
Output file と出てきて
ちゃんと.usdzになったファイルが出てこればOK!(ΦωΦ)

あと、このファイルを自分のサイトに入れるなり
AWSのS3にいれておくなりして手元のiPhoneのSafariから見に行けば〜
AR.jpg

上手にできました〜(ΦωΦ)

興味出た人はfixOpacityでアルファ周り処理したりとか
アニメーションが入った.glb作って見たりとかしてみてく遊んでみてください。

ではでは(ΦωΦ)

Top comments (0)