本記事のテーマ
指に連動してキャラクターが動くアプリを制作する。
制作環境
・Unity2020.3.26.f1
・Mediapipe Python
・NodeJs
概要（設計）
カメラで人差し指の位置を認識し、指の動きに連動してアプリ上のキャラクターを動かす。
使用技術
指認識：Mediapipe
データ送信：Websocket
キャラクターを動かすアプリ：Unity
作り方
今回つくるWebsocket通信と複数アプリ間のキャラクターの位置の同期は以下のサイトを元に作成しました。
ですので基本的には下記サイトを参考に作ってください。
本記事では追加説明を記載いたします。
また、参考サイトには誤字や脱字があったので修正しています。
完成したコードをGithubにおいていますので動かない際はお手数ですが私のGithubのコードと比較しながら作成してください。
■誤字脱字、説明不足パターン
※細かい差分などを覚えていないのでコメント欄でご質問いただけますと幸いです。
・オブジェクトの名前がコードないと異なる。
・オブジェクトの配置位置が記載されていない
・UserLoginDataクラスを作成していない状態で使用するためErrorが発生。
Unity初心者がawsサーバーとWebSocketを使ってのリアルタイム同期通信について学ぶ①
Unity初心者がawsサーバーとWebSocketを使ってのリアルタイム同期通信について学ぶ②
Unity初心者がawsサーバーとWebSocketを使ってのリアルタイム同期通信について学ぶ③
完成コード
追加説明
③追加するプラグインの配置
参考記事①のWebsocketに関するプラグインの配置です。
・Network.Json.dll
Unity2020からはNetwork.Json.dllと同等の機能のパッケージが入っており、新しく追加しなくても↓のパッケージが使用できます。
・websocket-sharp.dll
Ubuntuでwebsocket-sharp.dllを作成するためにMonodevelopを使用しました。
手順：
1. websocket-sharpのgit repogitoryをダウンロードする。
GitHub - sta/websocket-sharp: A C# implementation of the WebSocket protocol client and server
2. monodevelopをインストールする
下記サイトのUbuntu18.04の手順でUbuntu20.04にダウンロードできました。
3. monodevelopをアクティビティから開き,websocket-sharpをBuildする。
手順は下記サイトを参考。ファイル→開く→1でダウウンロードしたファイル内のwebsokcet-sharp.slnを選択する。
Exampleファイルを削除後、Releaseを選択してBuildする。
Nodejsのインストールと設定
インストールは参考サイトから転載
git clone https://github.com/creationix/nvm.git ~/.nvm
source ~/.nvm/nvm.sh
vi .bashrc（下記を追加）
--------------
# nvm
if -s ~/.nvm/nvm.sh ; then
source ~/.nvm/nvm.sh ;
fi
-------------
nvm ls-remote
nvm install v16.13.2
nvm use v16.13.2
node -v
npm install ws
この後node ws.jsを実行するとMODULE_NOT_FOUNDとなったので下記サイトを通りにPATHを通してあげると動いた。
Node.jsで、存在するはずのmoduleがrequireでエラーになることについて - Qiita
websocketのIPアドレスを指定する
nodejsで立てるサーバーのIPアドレスを確認する。
UbuntuだとIfconfigコマンドで確認できる。
残りの手順は次の記事にて記載いたします。
「Mediapipeによる指認識〜Nodejsを通してアプリに位置情報を送信する」
以上、ご参考になると幸いです！
質問などは下のコメント欄でお待ちしております！
分かりにくいなどのクレームもお待ちしております！
