勉強会のレポート(メモ)です。
参加したのはこちら「xR Developers Community Conference」。
xR Tech Tokyo・Tokyo HoloLens ミートアップ ・VRM勉強会・withARハッカソンの合同オンライン勉強会です。
このレポではVRM勉強会をメインにしています。
- それぞれのコミュニティの紹介
- アーカイブ動画
- C-1 VRM 1.0で使用可能になるConstraintについて
- C-2 「VRMはアバター時代のPNG」から考えた、透過撮影アプリ制作の話
- C-3 モバイルファーストなアプリを作るためにvearがしたこと
- C-4 Unityで作ったVRMポーズをUE4でも使う！
- C-5 USBカメラモーションキャプチャー「ThreeDPoseTracker」
- 他の感想ブログとか
- おまけ
それぞれのコミュニティの紹介
以下イベントページからの引用です。
xR Tech Tokyo
xR Tech Tokyo は、2016年からおおよそ隔月で開催している VR, AR, MR 関連の開発者向け勉強会イベントです。
現在は WebXR に特化した WebXR Tech Tokyo という形で実施しています。個別ハッシュタグ:
xRTechTokyo運営: @ikkou
HoloLens ミートアップ
HoloLensアプリ開発で著名な方々に登壇いただき、HoloLensに向いたアプリ、VR/MRに向いたアプリの特長や、HoloLensアプリ開発の裏話をお話しいただきます。
HoloLensを持っていない方も参加可能です！ご興味のある方は是非ともご参加頂き、HoloLensを含めたWindows MixedRealityの世界を覗いてみてください！
https://hololens.connpass.com/
個別ハッシュタグ:
HoloMagicians運営: @morio36
VRM勉強会
VRアバターの共通規格「VRM」に関する知見共有やアプリ自慢をする勉強会
個別ハッシュタグ:
VRM勉強会withARハッカソン
ARエンジニアと異業種のクリエイターが共創するハッカソン。 8/30~9/6に夏まつりwithARハッカソン開催中！
個別ハッシュタグ:
withARハッカソン
アーカイブ動画
全てアーカイブとして残っています
セッション間の雑談も見どころです
xR Tech Tokyo
公開されました
HoloLens ミートアップ
VRM勉強会
【VRM勉強会枠】xR Developers Community Conference #xRDCC #VRM勉強会
withARハッカソン
【withARハッカソン枠】xR Developers Community Conference #xRDCC #withARハッカソン
C-1 VRM 1.0で使用可能になるConstraintについて
VRM 1.0はどうなっているの？
運用体制に問題がありしばらく動きがありませんでしたが
現在はGitHubのissueベースで進めています。
↓こちらで、企画に関してのissueを受け付けています。
https://github.com/vrm-c/vrm-specification/projects/1
VRM 1.0におけるConstraint
現在議論・実装が進んでいます。具体的な議論はこちら。
現在決まっているConstraintがこの3つ
・Position Constraint ソースとなるノードの移動に追従
・Rotation Constraint ソースとなるノードの回転に追従
・Aim Constraint ソースとなるノードの位置を向くように回転させる
ただしVRMに載せるにあたり制約をしています。
様々なプラットフォーム、実装、アプリケーションでリアルタイムに処理をするためにシンプルにしています。
UniVRM 1.0の試し方
Unity2019.4以降で、Packagesフォルダのmanifest.jsonに追記するだけ。
UniVRM 0.xxで作られたVRMファイルも読み込めます。
SpringBoneのカプセルコライダやConstraintが使うことができます。
ここでデモタイム(動画を見てね)
注意事項
VRM 1.0のフォーマットはこれから変更される可能性が高いので、
(混乱のもとになるので)流通させないでください。
フィードバックをください
GitHubのissueや、「#VRMなんもわからん」でつぶやいてください
Issues · vrm-c/vrm-specification · GitHub
C-2 「VRMはアバター時代のPNG」から考えた、透過撮影アプリ制作の話
私のLTのスライドですhttps://t.co/QG9PQR8eHg
— 松VR🎩友黎火ちゃん🌔 (@matsu_vr) 2020年8月31日
#VRM勉強会 #XRDCC
VRMを読み込んで、透過しながらポーズや表情を切り替えて撮影をできるアプリを作りました。
今回は「アバター時代のPNG」と概念からどういうアプリが作れるか考えたことをお話します。
VRM いろいろある
モデルには身長やアクセサリーなど様々なものがある。やれることも様々ある(ポーズやライティングなど)
VRMアプリを作るときに、様々なモデルに対応することは必須として、「なにをするか」に焦点を絞らないと作れなくなってしまう。
「アバター時代のPNG」とは
これはエクシヴィの@GOROmanさんの発言です。この思想にかなりの影響を受けました。
@GOROman さんコメント中。昔話から「誰でもアバター」時代の話に。「SNSのアイコンがPNGなどの標準形式であるように、VRMが誰でもアバター時代のPNGになるように、日本発の世界をとれるデファクトになれれば」 pic.twitter.com/oNfWKoHOy6
— Munechika Nishida (@mnishi41) 2018年12月20日
PNG感覚で使えるデータで考えた場合Instagramnをイメージしました。
同じようにVRMでポーズとアプリを選んで良い感じの画像を作れるアプリを作ってみようと立ち上げました。
やらないことを決めた
プログラミングや3DCGができる人が考えるようなことを考えなくても使えるようにしました。
微調整などはカットしています。
カメラ・ライティング・ポージング・切り抜きなどについて考えなくてもいいことを目標にしました。
どういう風に実装したか
FOVの設定
一番困ったところです。VRMはいろいろあるので最適な設定というものがない。
なので並行投影にしどんなモデルでも許容範囲になるようにしました。
ライティング
サムネやグッズを作ることを想定したので影はでないほうが扱いやすいため出ないようにしました。
カメラの画角
勝手にいい感じに画面に収まるようにしました。
頂点座標とワールド座標を求めて、それが収まるようにカメラをサイズを変更するようにしています。
アクセサリーや武器を持っている場合、普通のMeshRendererのことがあるのでMeshFilterも計算対象にしています。
Standard Shaderのハマりどころ
ビルド時にStandard Shaderが含まれていないとエラーでハマリます。
Project Settingで設定しましょう。
VRMのライセンス表記
えむにわさんのVRMLoaderUIで解決しました。
これを呼ぶだけで、ファイル選択とライセンスの表示とシーンの読み込みをお任せできます。
ドキュメントにない変数を探す
VS Codeの補完機能に頼り探しました。
初心者の方には有効な手だと思います。
C-3 モバイルファーストなアプリを作るためにvearがしたこと
vearとは
iOS向けのアプリで、アバターをフェイスモーフィングし撮影や配信をするアプリです。
アバターから意識を逸らせる理由
撮影や配信といった提供したい価値にフォーカスさせるため
アバターのアプリは動かして満足してしまいがちで、本来の目的に到達できないことも多い
アバターを使ったアプリは大きく分けて2つある
着ぐるみ式
人間とアバターを同期させる手法、キャラクターになりきることが特徴
動かしたうえで演技や行動をすることが目的
パペット式
着ぐるみ式の方では、動かすことにフォーカスしてしまうと目的に到達することができない。
なので、アプリを起動したらすぐにアバターが動く状態にしておくのが(重要)
着ぐるみ式の弱点
没入感から放り出されやすい、特にアバターをメタ視点で見せてしまうと没入感が損なわれる
没入感が損なわれるとどうなるか
「なにをしようか」ではなく「誰になろうか」という点に関心が向いてしまう。
スマホアプリの場合、起動してから落とすまで3分から10分とライフサイクルが短い。
なのですぐに没入させて、それを維持するのが大事。
違和感を減らすためにしたこと
ARKitから取れる情報はなるべく反映する
回転のみでなく、位置情報、瞬きなどを反映するとユーザーとのシンクロ率が上がります。
現実と乖離する部分は隠す
トラッキングが外れてもホームポジションに移動させたり、画面端に出しっぱなしにしない。
できない事はしない
操作している感じを出さない、シンクロできる動きだけを実装する。中途半端になるなら実装しない。
全身のトラッキングはできないので、できない部分は隠す。
違和感をなくした後
この時点で普通のカメラアプリと同じ土俵に立てます。
ユーザーがアバターなのか人間なのか気にする必要がなくなるため、
人間向けのカメラアプリの機能(フィルターやジェスチャーなど)を再利用できる。
共通認識を上手に使う
カメラアプリらしい見た目からはずれない。どこを押せばシャッターが切れるかわかりやすいようにするなど。
OSのデザインに沿ったUIを使いましょう。iOSの場合はヒューマンインターフェースガイドラインに沿うといいです。
これに沿わないとアプリの世界観に合わず、ゲームっぽく見えてしまう。
C-4 Unityで作ったVRMポーズをUE4でも使う！
話すこと
UE4でゲームを作る話とVRM4Uについてはお話しません。
それらについてはこちらをご覧ください。
COCOPStudioで作ったポーズをUE4で使うお話を今回はします。
COCOPStudioとは
Unity製のアプリです。ポーズの作成・修正・保存・読み込み・透過PNGの出力ができます。
出力してゲームに取り入れたり、マンガの制作に使うことができます。
AndroidとWindows向けに配信しています。iPad版はもう少しで公開できるかも。
ポーズの集合サイトも作っています。
UnityからUE4へポーズを渡す
ポーズのデータを渡す時に問題になるのが軸の違い
Unityは左手系のYup、UE4が右手系のZupです。これを変換してあげればよい。
UnityのRotationを、UE4のRotationを変換してもうまくいきませんでした。
Unityは内部でQuaternionを使っています、なのでRotationではなくQuaternionを使うことにします。
UnityのQuaternionをUE4のQuaternionに変換し、そこからRotationに変換してできました。
これはCOCOPStudioの方に自動化機能として組み込んでいます。
受け取り側 UE4のエディタ拡張
COCOPStudioから出力されたJSONをUE4にD&Dするだけ。
後はボタンを押したらポーズが全て読み込まれるエディタ拡張を作りました。
これは9月中にデスクトップ版で配布予定です。
C-5 USBカメラモーションキャプチャー「ThreeDPoseTracker」
ThreeDPoseTrackerとは
USBカメラでモーションキャプチャができるソフトウェアです。
動画からもキャプチャできます。対象は一人のみで、強いPCと撮影環境が必要です。
ソースはGitHubにあります。
使い方
※デモ動画流れるのでアーカイブ動画を参照してください
宣伝
Hubs Cloudとは
ブラウザで動く開発中のソーシャルVRです。
インストール不要でスマホのブラウザからも動きます。
評価用のサイトを立ち上げています。
最後に
まだまだベータ版です
動画の投稿をしてもらうと励みになるのでお願いします。
他の感想ブログとか
おまけ
Quaternionについてはこちらがとても参考になります。
間違っている箇所、消してほしい所がありましたらコメントにお願いします。
