近年、世間ではリモートでスピーチをする機会が増加している。人前で喋ったことがあると経験があるのではないかと思うけど、テレビ会議ごしに話をすると目線が合わない、そもそも顔が見えないなどで反応がものすごく薄い。だんだんと慣れてきた感もあるけどやっぱり喋りづらい。技術による人間の疎外、これは仕方がないことですよ。
そうであれば解決するのも技術だ、というわけで作ってみたのがこちら（マイクの権限が必要です）。ブラウザの中から誰かがこちらを見てくれていて、話にうなずいてくれる。ただそれだけ。だけど、多数に向けたスピーチの際にうなずいてくれる人間の貴重さを知っている人には、このありがたさに共感してくれるのではないだろうか。
pixiv/three-vrm を使って3Dアバターヒューマノイドをブラウザ上に表示し、あたかもそこで自分の話を聞いているかのように存在させている。呼吸とまばたきを加えるだけでそれっぽさが増すのでおもしろい。
問題はうなずきをどう嘘っぽくないタイミングで挟み込むかだけど、Web Speech API の SpeechRecognition を使ってみた。これを使うとリアルタイムにマイク音声の書き起こしをしてくれるのだけど（ブラウザすげーな！）、その内容が確定されたタイミングが話の一区切りと見てうなずくようにしてみた。まあ悪くはないんじゃないかと思う。
動きは基本モーションみたいなものが配布されてるんじゃないかと思って調べてみたけどわからず、結局 JS で書いた。まばたきは 3D グラフィックス初心者が Web で VRoid をアニメーションさせてみた - Qiita のものを拝借した。
以下にデモ動画をあげているので見てもらえると感じがつかめると思う。
デモ兼紹介動画
transcript
こんにちは motemen です
今日は作ったものについてご紹介しようと
思います
まず課題意識としてこんなことありませ
んかって書いてるんですが
最近はリモートワークで仕事をする人も
増えてきてリモート会議であったりリモートの
ミーティングのツールを使って人前で話を
するっていうことをする機会も増えてきた
んじゃないかなと思いますそういうときにです
ねこういうこともよくあるかなぁと思って
いて参加者がカメラオフにしていたりまた
モニター越しだと聞いてくれている人
とは視線が合わない目線が合わないという
こととか
ありますとそうなるとですね話している側
としてはけっこう身に覚えがあるんじゃないかな
と思うんですが相手の反応がわからない
はい自分の言ってること伝わっているのかな
とかこれ聞こえているかなみたいなような不安
になっちゃう喋りにくいってことがあるん
じゃないかなと思うんですね
そこで作ったのが vnodroid と
呼んででますがこういうものですまさに今
画面の左側に出てるんですけど
バーチャルうなずき人間ということでこういう
名前にしてします
機能としてはまあこっちの話を聞いて
くれるというだけにつきまして
まず1つは適当なタイミングで頷いて
くれる適当というか適切なタイミングですね
あとモニターみるといつでも視線がある
目を見てくれるということですねはい
えっとこれはウェブサイトにアクセスすると
すぐに使い始めることができます
motemen.github.io/vnodroid/ に
アクセスでカメラとマイクを許可してあと
はおもむろにしゃべり始めたら ok です
ここえっといくつか VRoid Hub と
いうサイトで配布されているものを使って
まして
いくつか
デフォルトでサンプルモデルとして提供さ
れている物を使うことができるので
3種類のキャラクターから選ぶことができます
技術的には VRM っていう
3Dアバター
のための規格
ですかねモデルファイルをブラウザ上で
表示できる three-vrm というのを使って
いて使っておりましたあとですね
その聞き取りうなずきのタイミングを確定
するために Web Speech API
というものを利用しています
Web Speech API の中でも
この聞き取りを行う例えば Chrome
だと webkitSpeechRecognition
っていう名前なんですがこれを使っ
ていてこれを使うとですねマイク入力をリアル
タイムに今コンソールだしてますけど文字列として聞き取ることができると
でリアルタイムに聞き取るんですけど途中で
ですねあの
聞き取りの内容を確定されるタイ
ミングってのがあるんですね
まあやっとそうなると意味が確定したん
だろうということで頷きのタイミングにし
ています
だけどあまりに長すぎると
なかなか意味が確定しないということで気
聞き取り内容が確定しないということで話の途中
でも時々今が開いたらうなずきを入れる
みたいな感じで調整してますこの辺は
自然になるように調整していくのはまあ
これからやっていきたいなということです
ねはいじゃあ motemen.github.io/vnodroid/ にアクセスしていただければ皆
さん今日から無料で使い始められますので
どうぞご利用ください
