VRM勉強会03 VRMのバイナリを読もう -VRM一覧表示を爆速にする-

VRMファイルのバイナリを読む話です。
詳細が分からなくても、VRM.QuickMetaLoader を使ってみましょう。
https://github.com/m2wasabi/VRMQuickMetaLoader

Transcript

1. VRMのバイナリを読もう VRM一覧表示を爆速にする VRM勉強会 #3 2019/08/27 えむにわ @m2wasabi
2. 自己紹介 • 山本 允葵 (Masaki Yamamoto) えむにわ @m2wasabi 定職に就かずにふらふらしてるおっさん フ リ ー ラ ン ス エ ン ジ ニ ア 夏なのにイベントなさすぎて鬱
3. 自己紹介 • 山本 允葵 (Masaki Yamamoto) えむにわ @m2wasabi 新しいものに何でも食いつく 雑食系野良エンジニア(フリーランス) Web,クラウド,IoT,xR周りが飯のタネ 引っ越したいので職探し中(信用について考えさせられる日々) https://m2wasabi.booth.pm/ Boothで書いたもの☝
4. VRM関連で作ったもの OSSのアバターパペットツール https://github.com/m2wasabi/LiveAvatar 身につける装備なしで使える！ バーチャル対面コミュニケーション 守衛のおじさん や 受付けのお姉さん アップデートしていいんだよ！ 設置はシンプル！ Viveコントローラー持って 椅子に座るだけ！ VOICEROIDなどの音声合成にも対応！ LiveAvatar VRMを読み込むUI https://github.com/m2wasabi/VRMLoaderUI ソースは MITライセンス アートワークは CC0 編集自由なのでカスタマイズして使おう！ VRM Loader UI
5. 続・ VRM関連で作ったもの • Looking Glass Libraryでアプリ公開してます • 今日、LookingGlassLargeで遊べます！！  ⇒ Thanks!! なかじさん モーションはグレイさんのvmdモーションを Unityに移植したもの（移植・配布許可済） https://ux.getuploader.com/m2wunity/download/1
6. 宣伝 • 技術書典7で DataDogAgentの本書きます！  お68C VRMちゃうやんけ！！ VRMはネタが足りませんでした…すまぬ そして原稿はこれからなのだ…
7. 今回の内容 • バイナリ ヨム ゴリラについて  何それ  ゴリラ ノ ナリカタ  VRMを読む • VRMメタ情報表示の高速化  標準的なメタ情報の表示方法  ゴリラのメタ情報の表示方法  VRM.QuickMetaLoader
8. バイナリ ヨム ゴリラ とは • バイナリを直接読む知性と力を持った ジャングルの王
9. ゴリラ ノ ナリカタ • 好きなキャラを選んでください 北国の独裁者 日本のロックの重鎮
10. ゴリラ ノ ナリカタ • 好きなバイナリエディタを選んでください https://gitlab.com/devill.tamachan/binaryeditorbz/ ※OSS化+開発移管してるので古参は注意！！ https://www.vector.co.jp/soft/win95/util/se079072.html なんと1999年製
11. ゴリラ ノ ナリカタ • Stirlingを選んだら僕と握手
12. ゴリラ ノ ナリカタ • Stirlingオススメ設定
13. ゴリラ ノ ナリカタ • Stirlingオススメ設定
14. ゴリラ ノ ナリカタ • Stirlingオススメ設定 もう迷わない！！
15. ゴリラ ノ ナリカタ ツール ツカウダケ カンタン
16. VRMを読む • とりあえず開いて中見てみましょう やめろ！
17. VRMを読む • とりあえず開いて中見てみましょう お゛
18. VRMを読む • とりあえず開いて中見てみましょう … glTF JSON JSON glTF のバージョン 全容量 byte チャンク容量 byte 分析
19. VRMを読む • とりあえず開いて中見てみましょう glTF JSON JSON glTF のバージョン 全容量 byte チャンク容量 byte 全容量：0x00783838 = 7,878,712 bytes チャンク[0]容量： 0x00019DAC = 105,900bytes チャンク[0]内容：J SON
20. VRMを読む • とりあえず開いて中見てみましょう glTF JSON JSON glTF のバージョン 全容量 byte チャンク容量 byte 全容量：0x00783838 = 7,878,712 bytes チャンク[0]容量： 0x00019DAC = 105,900bytes チャンク[0]内容：J SON アドレス 0x00000014 から 105,900byte切り取ればJSONだ
21. VRMを読む • JSONを抜き出してみる
22. VRMを読む • JSONを抜き出してみる  glTF2.0拡張形式だ！  VRM独自の追加情報は  extentions > VRM 以下 glTF2.0についての参考資料 https://github.com/KhronosGroup/glTF https://qiita.com/emadurandal/items/1a034c4addd7ff8b5184 見覚えのある データ
23. VRMを読む • Q：JSONが終わったらどうなってるの  0x14 + 0x019DAC = 0x019DC0
24. VRMを読む • Q：JSONが終わったらどうなってるの  0x14 + 0x019DAC = 0x019DC0 • A：バイナリが詰まってるよ BIN チャンク容量 byte PNGだ
25. VRMを読む • Q：JSONが終わったらどうなってるの  0x14 + 0x019DAC = 0x019DC0 • A：バイナリが詰まってるよ BIN チャンク容量 byte PNGだ 使い方： アドレスと容量を指定して抜き出すだけ
26. VRMを読む • VRM完全に理解した！
27. VRMメタ情報表示の 高速化
28. 標準的なメタ情報の表示 • UniVRMの場合 var bytes = File.ReadAllBytes("AliciaSolid.vrm"); var context = new VRMImporterContext(); context.ParseGlb(bytes); var meta = context.ReadMeta(true); おなじみの4手
29. 標準的なメタ情報の表示 • UniVRMの場合 var bytes = File.ReadAllBytes("AliciaSolid.vrm"); var context = new VRMImporterContext(); context.ParseGlb(bytes); var meta = context.ReadMeta(true); ここで ・JSON抽出 ・JSONパース ・バイナリ領域の分割読み込み をしている パースされたJSONから Metaオブジェクトの取り出し サムネイルの取り出し
30. 標準的なメタ情報の表示 • UniVRMの場合 var bytes = File.ReadAllBytes("AliciaSolid.vrm"); var context = new VRMImporterContext(); context.ParseGlb(bytes); var meta = context.ReadMeta(true); ここで ・JSON抽出 ・全JSONパース ・バイナリ領域の分割読み込み をしている パースされたJSONから Metaオブジェクトの取り出し サムネイルの取り出し 実 は 軽 い
31. ゴリラのメタ情報の表示方法 • ゴリラ JSON ヨクワカラナイ
32. ゴリラのメタ情報の表示方法 • ゴリラ JSON ヨクワカラナイ • トリアエズ "extensions": サガス • ツギ "VRM": サガス • ツギ "meta": サガス • } マデノ ナガサ ハカル • トリダス
33. ゴリラのメタ情報の表示方法 • ゴリラ JSON ヨクワカラナイ • トリアエズ "extensions": サガス • ツギ "VRM": サガス • ツギ "meta": サガス • } マデノ ナガサ ハカル • トリダス
34. ゴリラのメタ情報の表示方法 • ゴリラ JSON ヨクワカラナイ • トリアエズ "extensions": サガス • ツギ "VRM": サガス • ツギ "meta": サガス • } マデノ ナガサ ハカル • トリダス 10倍速!!
35. VRM.QuickMetaLoader • バイナリを直接読むことにより 最短手でメタ情報を読み込むライブラリ  サムネイルの読み込みも ゴリゴリしてるが説明は略…!!  MITライセンス  どんどん使ってくだせ!!  使い方は簡単3行!  詳しくはGitHub見てね https://github.com/m2wasabi/VRMQuickMetaLoader
36. まとめ • VRM完全に理解した！ • バイナリ ヨム ゴリラ ツヨイ
37. Thanks for your attention おしまい！