LT発表：VRMお手軽ポーズとVRMA
VRM Meetupの第三回で発表したVRMお手軽ポーズとVRMAについてのLT
https://gyazo.com/3ec00e79d9c37401cb542628a16b024b
自作アプリVRMお手軽ポーズとVRMアニメーションについて
https://gyazo.com/cd1bf8999dfa0d9783abba91dd5a37a3
このLTではココが嬉しい「VRMアニメーション」、
VRMアニメーションがお手軽ポーズにとってどう嬉しかったかについて
https://gyazo.com/5ab27cfa9940f9293e85845fa50725b6
目次
https://gyazo.com/b01e095dc54188973ce6fe252d016810
https://gyazo.com/e58e9547cdd4b472a626b6c6294ce449
VRMお手軽ポーズとはポージング & 撮影が出来るWebアプリケーション
いわゆるVRM撮影アプリ
VRMをさっと動作確認するためのツールという面もある
https://gyazo.com/129874e4bd1cabaadb9993682e0c5a79
お手軽ポーズのテーマは使い始めるまでの時間を最小化すること
Webアプリケーションなのでブラウザで検索してアクセスすればすぐに使えるのが特徴
https://gyazo.com/be0c5d8a2aa102d99604770bc5bf9d6a
はじめのハードルを最小化するための仕組み
PWAに対応していてVRMをダブルクリックすると起動できる
URLでポーズデータを共有する機能
SNSなどでポーズをシェアするとそのリンクから開くだけでポーズを読み込める
「とりあえずVRMで遊んでみる」ということがより簡単になることを目指している
https://gyazo.com/246228487b9b81f448f3fff91023ce06
先日、お手軽ポーズでもVRMアニメーション対応を機能をリリース
VRMアニメーションの再生
ポーズデータをVRMアニメーションとして出力
VRMAを読み込んでポーズとして追加編集したり、
ポーズデータを1フレームの静止アニメーションとして他の対応アプリケーションへ持ち込むことができるように
https://gyazo.com/eec88764f8e61094171edb6135b9c022
本題
VRMAはお手軽ポーズにとってどう嬉しかったか。
https://gyazo.com/ad6d54eff46fc77fde426de122868886
お手軽ポーズから「次のステップ」を提示できるようになった
https://gyazo.com/6fc466ef57b71d7c631788411d27b23c
お手軽ポーズのテーマは最初のハードルを最小化すること
逆に、こだわりたいユーザはより適したものが使えるようにしたい
お手軽ポーズは背景透過で撮影する機能がデフォルトになっている
レタッチやコンポジなどを専門の画像編集ソフトでできるようにするため
このように成果物の取りまわしをよくすることはユーザの学習コストや、デベロッパーの実装コストの面で重要だと考えている。
これまではお手軽ポーズで作成したポーズデータは他のアプリで使用することを想定したものにはなっていなかった
そのせいでライティングにこだわりたい時や複数体で撮影したいときに困ることが多かった
https://gyazo.com/2e43eeb402d746e0d0ca241c5f2a20b3
VRMAによってポーズが別の対応アプリで読み込めるようになったので、こだわりたい内容によってお手軽ポーズで作ったデータを持ち込めるようになった。
複数体のアバターで撮影したいときはVRMポージング・デスクトップさんを使ったり、レンダリングでこだわりたいときはBlenderのVRMアドオンを使ったりするなどユーザのこだわりが次のステップへとつながりやすくなった。
https://gyazo.com/435ffb67eab36dc4a8d802cbe40a36b2
規格が共通化されることでそのアプリの強みに集中しやすくなるというメリットも大きい
VRMと同じで個人開発者にとっては嬉しいポイント
https://gyazo.com/2747de4a6a4aad6a8ae4f3f247a57b70
これからは出口はでっかく、入口はもっとでっかく！
https://gyazo.com/dd968520673cf919b8fe774be5ee26ea
VRMAのエクスポート(おまけ)
https://gyazo.com/0e92e63b85d2fa9b2ceb833ad12b4269
お手軽ポーズではpixiv/three-vrmというライブラリを使っている。
VRMAの読み込みはpixiv/three-vrm-animationというパッケージも必要です。
https://gyazo.com/079eabf1fac541b800398feba2b26a59
お手軽ポーズではこれまでJSONで扱っていたポーズデータをthree.jsの１フレームのアニメーションクリップに変換し、それをglTFとして書き出している。
https://gyazo.com/460de3e4cd42f34bf3cb61196150307a
興味のある人はUniVRMの実装やvrm-c/bvh2vrmaの実装を参考にしてみてください
https://gyazo.com/7107515487f145b6aef11c65b24cd533
まとめ