Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
キーボードとマウス入力で動かすVRM(キャラ無し版)
Search
Baku_Dreameater
May 22, 2019
Technology
0
180
キーボードとマウス入力で動かすVRM(キャラ無し版)
キーボードとマウスでVRMを動かすVMagicMirrorというソフトを宣伝しつつ、全体的な技術背景を説明します。
Baku_Dreameater
May 22, 2019
Tweet
Share
More Decks by Baku_Dreameater
See All by Baku_Dreameater
自作ソフト(VMagicMirror)がVRMA対応してる話+実装のTips
bakudreameater
0
380
趣味開発でVRM1.0モデルに対応した話
bakudreameater
1
5.8k
Oculus Questでマリオネットを召喚して遊んでみた
bakudreameater
1
1.5k
キーボードとマウス入力で動かすVRM(キャラ付き版)
bakudreameater
0
1.6k
Other Decks in Technology
See All in Technology
LINE Developersプロダクト(LIFF/LINE Login)におけるフロントエンド開発
lycorptech_jp
PRO
0
150
AWS re:Invent 2024で発表された コードを書く開発者向け機能について
maruto
0
210
あの日俺達が夢見たサーバレスアーキテクチャ/the-serverless-architecture-we-dreamed-of
tomoki10
0
500
2024年にチャレンジしたことを振り返るぞ
mitchan
0
150
ずっと昔に Star をつけたはずの思い出せない GitHub リポジトリを見つけたい!
rokuosan
0
160
Oracle Cloud Infrastructure:2024年12月度サービス・アップデート
oracle4engineer
PRO
1
270
How to be an AWS Community Builder | 君もAWS Community Builderになろう!〜2024 冬 CB募集直前対策編?!〜
coosuke
PRO
2
2.9k
podman_update_2024-12
orimanabu
1
290
5分でわかるDuckDB
chanyou0311
10
3.3k
re:Invent をおうちで楽しんでみた ~CloudWatch のオブザーバビリティ機能がスゴい!/ Enjoyed AWS re:Invent from Home and CloudWatch Observability Feature is Amazing!
yuj1osm
0
140
非機能品質を作り込むための実践アーキテクチャ
knih
5
1.6k
いまからでも遅くないコンテナ座学
nomu
0
130
Featured
See All Featured
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Reflections from 52 weeks, 52 projects
jeffersonlam
347
20k
jQuery: Nuts, Bolts and Bling
dougneiner
61
7.6k
A better future with KSS
kneath
238
17k
Learning to Love Humans: Emotional Interface Design
aarron
274
40k
Bash Introduction
62gerente
609
210k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
191
16k
Producing Creativity
orderedlist
PRO
342
39k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
132
33k
Unsuck your backbone
ammeep
669
57k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
365
25k
Transcript
キーボードとマウス入力で 動かすVRM 獏星(ばくすたー)@baku_dreameater 2019/05/22 第2回VRM勉強会 1
自己紹介 獏星(ばくすたー) @baku_dreameater ・仕事:ロボット関係+モバイルアプリ ・趣味:洋食屋さん巡り ・好きなもの:マレーバク 2 プレゼン中はここでも わちゃわちゃしてます
話すこと 宣伝 ・「VMagicMirror」というソフトの紹介 知見の紹介 ・「VRデバイス無くても結構いい線行くよ」という話 ・余談:常駐化に関係ある事 3
(※宣伝)VMagicMirrorについて ・Windows向けのVRM表示ソフト ・デスクトップマスコットにもなります BOOTH https://baku-dreameater.booth.pm/items/1272298 ソースコード(MITライセンス) https://github.com/malaybaku/VMagicMirror 4
VMagicMirrorの雰囲気 1: 何か適当にテキストを打つ TODO: この辺にテキスト 2: プレゼンモード 5 ※このLTスライドは 実演前提で作ってあります
なぜキーボードとマウスなのか デバイス構成を絞る ・すぐ使える=VRMと好相性 自分をモーキャプする最小構成を考える ・プログラマとしてはキーボード叩くだけでも足りそう 一体感 ・作業風景ならキーボードとマウス操作が主のハズ そこだけ使えば十分な一体感が出せそう 追加: デスクトップ常駐力を高めたい
6 私がかんがえたVRM沼 ・PC単体で動くソフトで誘致 ・トラッキング欲が次第に高まる ・気づいたらVRデバイスを買っている
アプリケーションの構成 WPF Unity 7 WPFで設定UIを作ると実装がラク! ※gRPCについての詳細は無しで… (毛の生えたTCP通信扱いしてます) gRPC ・コンフィグUI ・設定ファイルI/O
・Windowsっぽい事 (レジストリ操作等) ・キャラ表示 ・視点コントロール ・モーション (FinalIK) ・リップシンク(AniLipSync) ・顔トラッキング (DlibFaceLandmarkDetector)
入力キャプチャのやり方 マウス :Unity標準のMouse.inputPosition キーボード :WPFアプリ内でグローバルフックを 使ってキャプチャ(*1) ゲームパッド:XInputGamePad(*2) ※Unity向けのUnityRawInput(*3)も多分使えるが、 VMagicMirrorでは非使用 8
*1: https://github.com/malaybaku/VMagicMirrorConfigのKeyboardHook.cs *2: https://github.com/kaikikazu/XinputGamePad *3: https://github.com/Elringus/UnityRawInput
キーボード配列と運指の設計 手元のSJISキーボードを眺めて全部決め打ち。 例:”A”キーはどこにある?また、どの指で打鍵する? ・”A”は3列目、左から2番目のキー ・”A”はいつも左手小指で打鍵する ◦実装が簡単なわりに見栄えよし △海外のキーボード配列ではちょっと不自然 △変態自作キーボードと相性が悪い 9 ソース:
https://github.com/malaybaku/VMagicMirror 以下のKeyboardProvider.cs 楽器では厳しい手法。 キーボードの特権!
マウス注視 + デスクトップの奥行きイメージ 10 壁紙 + 他アプリ キャラクター マウスポインタ =
キャラの注視点 ≒ ユーザー注視点 視点はあくまで横~前方を向き。 背後の他アプリは直接は見ません。 (顔が見えないと嫌でしょ?)
指さしモーション やりたい事 指先 ≒ マウス位置になるように動かす やり方 Mouse.ScreenToWorldPoint()でIK位置を決める ・XY: Mouse.inputPositionそのまま ・Z:
カメラ-キャラ頭部間の距離をめやすに決定 その他 ・胴体付近に腕がめり込まないようガードすると◎ 11 奥行き意識が大事!
キーボード・マウスでは動かない部分 表情の動き ・まばたき→てきとうに一定間隔で1回or2回まばたき ・目の閉じ具合に合わせて瞳孔を下げる+眉毛も上下 (※眉毛については補足参照) ・表情ショートカットキーは現状なし →キーボード入力がバレます ・デフォルトでFunブレンドシェイプが有効(30%程度) 全身動作 ・呼吸動作をスクリプトベースで適用
・待機アニメーションは非使用 (IKとの競合回避のため) 12 トークに興味ない人は まばたきにご注目…
余談:透過 (非矩形ウィンドウ)について 実装方式 ・Win32APIで実現→キルロボ(@kirurobo)さんの記事等(*1) ・「透明な部分でもヒットテスト(当たり判定)が有効」問題… →上記記事の方法だと対策済み! あると嬉しい事 ・スクリーン丸ごと見せたいときに強力 ・常駐力が高い なくてもいい理由
・配信ソフト任せでもいい(単色背景) ・ハンパに実装するとヒットテスト制御で苦労 →キャラが邪魔に感じられるとあまり嬉しくない 13 興味をもった人は 「透過ウィンドウ」だけでなく 「非矩形ウィンドウ」でもググること! 後者のほうがコアなネタが出てきます。 *1: https://qiita.com/kirurobo/items/013cee3fa47a5332e186
14 補足
顔トラッキングについて ・多少いい加減でも載ってると嬉しい ・パラメータ調整は最小0個か1個 ・顔全体の位置/角度トラッキングだけでも だいぶ変わる ・FPS低下の対策も仕込んでおくと◦ →とりあえず顔検出メソッドはUIスレッド外に逃がす 15
眉毛 on VRM ・VRMBlendShapeProxyを経由せず、 直にブレンドシェイプを設定すればOK ※眉単独の動作は(まだ)VRM仕様外!あくまで「ついで」 ・手動設定UIを作るとゴチャゴチャする →とりあえずVRoidStudio製モデルでは自動セットアップ 16
その他の知見 ・顔トラッキングが使える環境で手元を隠す →肩がそれっぽく動くので意外と有効 ・英語UIは意外と大事 海外の方は色々な方法で 貴方を見つけてきます(VRChat経由とか) 17 キーボードが隠れる位置まで 下がってみると…
このLTスライドのレイアウト ・左にメインコンテンツ ・右下は空白orキャラ背景 ・右上はセリフとかリアクション芸コーナー セリフ枠このへん 18 スライド番号は左下へ!右下はNG