はじめに

ChatdollKitで作ったアバターと話せるシステムをwebGLでビルドする

ChatdollKit

ChatdollKitは、会話できるアバターを作成するためのフレームワークです
機能やオプションがたくさんあるので、Unityで話せるアバターを作りたい人におすすめです

※ChatdollKitを使った対話アバターの作り方はこちら

webGLとは、Unityで作ったプロジェクトをwebブラウザ上で動作させるための仕様のことです

ChatdollKitもwebGLに対応しているのですが、そのままwebGLでビルドしようとしたらエラーが出たので、この記事ではその解決方法を紹介します

今回の記事はChatdollKitのREADMEを参考にさせていただきました

※対話アバターの開発環境はこちら

webGLでビルドしようとしたら、コンソールにエラーが表示されました

The name 'Microphone' does not exist in the current context

MicrophoneはuLipSyncで使用しているのですが、webGLでは使えないみたいです

Microphoneの代わりにChatdollMicrophoneを使います

uLipSyncWebGLのgithubから、uLipSyncWebGLEdition_2.2.0.unitypackageをダウンロードします
ダウンロードしたuLipSyncWebGLEdition_2.2.0.unitypackageを開いてインポートします
Assets > uLipSyncWebGL > Scripts のuLipSyncWebGL.unitypackageをChatdollKitVRMのInspectorにドラッグ＆ドロップで追加します
uLipSyncにある下記の3つのファイルを消去します
- uLipSync > Runtime > uLipSyncMicrophone
- uLipSync > Runtime > Core > MicUtil
- uLipSync > Editor > uLipSyncMicrophoneEditor
  - 公式READMEにはuLipSyncMicrophoneEditorと書いてありますが、uLipSync (v2.6.1)ではuLipSyncMicroputEditorというファイル名でした
  - もしuLipSyncMicrophoneEditorがなければ、uLipSyncMicrophoneとMicUtilを消去して実行してみて、エラーに書いてあるファイルを消去すればいいと思います
uLipSync > Editor > EditorUtilのファイルを開き、DrawMicSelectorメソッドをコメントアウトする
ファイルはダブルクリックで開けます

詳しくはこちらを参考にしてください

webGLでビルドすると、ビルド完了時は自動的にwebブラウザにUnityで作ったものが表示されますが、次回webブラウザ上で表示できなくなります
それを回避するためにPlayer Settingsで設定を変更します

Build Settingsに戻り、Build And Runをクリックします
ビルドしたものを保存するフォルダを選択すると、ビルドが開始されます
webGLのビルドにはかなり時間がかかります
PCのスペックにもよりますが、10分以上はかかると思います
ビルドが終わると自動的にwebブラウザが開きます

今回はCHatdollKitをで作成したものをwebGLでビルドし、ローカル環境で動作させる方法について説明しました