【Unity】Unity+uLipSync+AgentCraftで3Dモデルと対話しよう！

#はじめに
9/25にサポーターズさん主催のイベント「[技育展](https://talent.supporterz.jp/geekten/2021/)」に参加しました．
今回は技育展のために作成したアプリケーションに関して解説していこうと思います．
作成したのは以下の動画のように3Dモデルと対話できるアプリケーションです．
![Demo.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/41b965eb-121a-c2cb-4fca-6b5dbbe7e3f5.gif)
（音声対話の動画をGIF化したため無音の動画です）

過去にもUnityとAgentCraftを利用した開発記事を書かれている方は多数いらっしゃいますが，2021年9月現在ではdocomoのデバイスSDKの利用方法がそれらの記事と変わっています．
今後も変化する可能性がありますが，それまではこの記事が他の方の助けになれば幸いです．

冗長な部分があるとは思いますが，お付き合いいただけましたら幸いです．

-----追記-----
Youtubeにてデモ動画を公開しています！
本記事をベースに改良したものですが，ぜひ見ていただけると完成品のイメージが固まるかと思います！
[デモ動画リンク](https://www.youtube.com/watch?v=TlRkPjLmA0o)

#環境
OS:macOS BigSur
Unity:2020.3.12f1 (対話エージェントの導入に使用するサンプルアプリケーションのUnityバージョンが3.12f1なので，このバージョンを使用することをお勧めします．)
VisualStudio: 2019 for Mac

#使用したもの
対話エージェント:docomo [AgentCraft](https://agentcraft.sebastien.ai/)
対話エージェント用SDK:docomo [デバイスSDK](https://docs.sebastien.ai/documents/basic07/#%E3%83%87%E3%83%90%E3%82%A4%E3%82%B9SDK)
3Dモデル:Unity Technolosies Japan [Unityちゃん](http://unity-chan.com/contents/guideline/)
リップシンク用アセット:hecomi [uLipSync](https://tips.hecomi.com/entry/2021/02/27/144722)

3Dモデルは口のシェイプキーが割り振られているものであれば，自作のモデルなどUnityちゃんでなくても使用できると思います！

#作成手順
##0.準備
本アプリの開発では，Unity向けのdocomoのエージェントのSDKのサンプルアプリを使用します．
以下のページの「デバイスSDK」の項目に従い，事前にメールを送ってサンプルアプリの利用許可をもらいましょう．
申請が許可されるには1週間程度かかったので，事前に連絡をしておくとスムーズに開発できます．（技育展本番2日前まで申請通らなくて死にそうになった人←）

[ドコモAIエージェントAPI インターフェース仕様書/開発ガイド](https://docs.sebastien.ai/documents/basic07/#%E3%83%87%E3%83%90%E3%82%A4%E3%82%B9SDK)
![スクリーンショット 2021-09-19 11.18.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/f2961f0b-d9a6-0f34-194c-8a1eae19f029.png)

##1.docomo AgentCraftでUnityちゃんの人格を作成する
それではまず，Unityちゃんの人格を作成しましょう．（字面）
こちらのリンクから[AgentCraft](https://agentcraft.sebastien.ai/)にアクセスしていただき，アカウントを作成します．
![スクリーンショット 2021-09-17 12.20.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/fb16a92a-8b78-fc1e-3557-f621ceadd349.png)

その後，以下のような画面に遷移すると思います．
![スクリーンショット 2021-09-17 12.22.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/276f495a-8c51-a699-f490-a9e6eb10997d.png)


この画面がエージェントの作成画面になります．
AgentCraftのドキュメント「[エージェントの作成と基本設定](https://docs.sebastien.ai/documents/agentcraft02/)」を参考にUnityちゃんと交わしたいコミュニケーションをイメージしながら様々な応答を設定していきましょう．

##2.UnityHubをインストール
まだUnityをインストールしていない場合は，まずUnityをインストールしていきましょう．
インストールできている方は「3.AgentCraftとUnityを連携させる」からスタートしてください．
Unity公式記事などがわかりやすく導入手順を記述してくださっています．
以下のリンクなどを参考にUnityHubをインストールをしてください．
[Windows用](https://forpro.unity3d.jp/tutorial/unity-install-windows/)
[Mac用](https://forpro.unity3d.jp/tutorial/unity-install-mac/)

iOSのビルドなどをする場合，VisualStudioまでインストールしておくと，ビルドの際にエラーを吐く確率が下がると思います...
↑私はエラーを吐かれて苦労しました()

##3.AgentCraftとUnityを連携させる
次にUnityでデバイスSDKのサンプルアプリを起動します．
UnityHubを起動し，プロジェクト一覧の画面から「リストに追加」を選択します．
![スクリーンショット 2021-09-17 9.02.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/db7b0c60-f507-6618-9f9f-11e3fce41cc6.png)
docomoさんから頂いたデバイスSDKを保存したフォルダまで移動し，「SpeakSampleApp」を開きましょう．
その後，SpeakSampleAppをダブルクリックし，プロジェクトを起動します．
プロジェクトの設定方法はデバイスSDKのフォルダ内に入っている「SpeakSDK_Unity_sampleapp」の「README.md」に記載されています．
デバイスSDKのページにある「[エージェント作成チュートリアル ~UnitySDK編~](https://docs.sebastien.ai/wp-content/uploads/Agentcraft_speak_sdk_for_unity_tutorial.pdf)」も参考になりますが，情報が古いため，基本的にはREADMEを参考にすることになると思います．

設定が完了すれば，このような画面が表示されるかと思います．
![スクリーンショット 2021-09-22 19.22.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/83e20ff7-7a35-7fb0-dcec-1f3a448dba45.png)

画面上部のPlay（再生ボタン）でプロジェクトを実行し，「SDKStart」ボタンを押すと，エージェントと対話ができるようになります．
設定した会話が機能するか確認してみましょう．
![スクリーンショット 2021-09-22 19.33.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/865b0a5b-2140-5438-82a7-47a1fa54f77d.png)

##4.Unityちゃんを降臨させる
ここまででUnityに対話エージェントを連携させるための下準備は完了しました．
次に，Unityちゃんをお迎えしていきましょう．

事前準備として，Hierarchyに「Directional Light」を作成しましょう．
![スクリーンショット 2021-09-22 19.42.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/7aba95d4-854c-801d-51cb-ce629663f913.png)

作成すると，このように画面が明るくなると思います．（なんということでしょう）
![スクリーンショット 2021-09-22 19.42.56.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/8745ec8b-70ec-cb97-352a-6da1899464d3.png)

それでは，Unityちゃんをインポートしていきます．
※このセクションで使用している画像は違うプロジェクトのものですが，操作自体は同じなのでご了承ください．

まずはUnityちゃんのパッケージをダウンロードします．
[Unityちゃんダウンロードページ](http://unity-chan.com/contents/guideline/)

Unityちゃんがダウンロードできたら，2.で作成したプロジェクトにインポートします．
UnityのAssetタブ>Import Package>Custum Packageを選択し，「UnityChan_1_2_1.unitypackage(執筆時の最新バージョン)」をインポートしてください．
![スクリーンショット 2021-09-17 11.42.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/9accadd7-724b-3792-ff5d-50eaf1b4d7c7.png)


この画面が表示されたら，「Import」を押してパッケージ内容をインポートします．
![スクリーンショット 2021-09-17 12.01.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/a4fa1d47-eb61-1347-1364-8e8dba0b88a9.png)
インポートが完了すると，おそらくAssetsの配下に「UnityChan」ディレクトリができていると思います．
![スクリーンショット 2021-09-17 12.02.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/9c4ecf43-5ed6-5d5f-0d1b-62b2b5e84e92.png)

Assets/UnityChan/Prefabs/までディレクトリを開くと，unityちゃんのPrefabがあるので，ドラッグ&ドロップなどでHierarchy上に配置してください．
![ユニティちゃんdd.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/c0670fe4-2cf2-5a1a-91aa-49f094b47dff.gif)

Unityちゃんが画面に表示されました！
![スクリーンショット 2021-09-17 12.17.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/ee505aec-87ef-a290-825d-7b033496190d.png)


##5.uLipSyncを導入し，Unityちゃんがリップシンクできるようにする
無事にUnityちゃんが降臨されたので，次はUnityちゃんにしゃべる能力を獲得していただきましょう．
uLipSyncの製作者様の記事が非常に丁寧に解説してくださっているので，以下のリンクから確認していただければと思います．
[凹みTips Unity でリアルタイムにリップシンクを行うプラグインを更に作り直してみた](https://tips.hecomi.com/entry/2021/02/27/144722)

ただ，上記記事に従って関連パッケージをインストールする際，Unity.Mathematicsのパッケージがリストに表示されないかもしれません．
その場合は，「[Unity 2020.1 からパッケージマネージャで発見できなくなったパッケージのインストール方法](https://helpdesk.unity3d.co.jp/hc/ja/articles/900002171066-Unity-2020-1-%E3%81%8B%E3%82%89%E3%83%91%E3%83%83%E3%82%B1%E3%83%BC%E3%82%B8%E3%83%9E%E3%83%8D%E3%83%BC%E3%82%B8%E3%83%A3%E3%81%A7%E7%99%BA%E8%A6%8B%E3%81%A7%E3%81%8D%E3%81%AA%E3%81%8F%E3%81%AA%E3%81%A3%E3%81%9F%E3%83%91%E3%83%83%E3%82%B1%E3%83%BC%E3%82%B8%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB%E6%96%B9%E6%B3%95)」を参考にインストールしていただければと思います．

無事にUnityちゃんにuLipSyncの設定ができたら，いよいよ最後の作業です．
Hierarchyの「Main Camera」にアタッチされている「Audio Listener」を「Remove component」しましょう．「Audio Listener」の文字の右にある「・・・」をクリックすれば「Remove component」が見つかると思います．
![スクリーンショット 2021-09-22 18.56.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/b43b695b-6f67-f256-ada1-fec224c34e34.png)

その後，HierarchyのUnityちゃんのオブジェクトを選択し，「Add Component」から「Audio Listener」をアタッチしましょう．
![スクリーンショット 2021-09-22 18.52.51.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/a95198a4-c0f6-733c-42f6-87b20d9802b6.png)

※uLipSyncを使用した理由
現状OVRLipSyncの方が多く使用されていますが，設定が簡単であることと，更新日が新しいという理由から，今回はこちらのuLipSyncを使用しています．


##6.完成！
以上でUnityちゃんと対話するための準備は整いました．
プロジェクトを実行し，Unityちゃんと対話してみましょう．
![Demo.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1494601/41b965eb-121a-c2cb-4fca-6b5dbbe7e3f5.gif)
（音声対話の動画をGIF化したため無音の動画です）

#終わりに
今回の開発で初めてまともにUnityを触りました．
Unityに不慣れなせいでわからないことが山のように出てきたり，SDKの利用申請が技育展の発表ギリギリまで通らなかったりと何度も死にそうになりましたが，こうして綺麗に動いてくれるものができて嬉しいです．

Unityちゃんが話し相手になってくれるようになったので，もうこれで一人暮らしも寂しくないね！やった！！（独身）

皆さんもぜひUnityちゃんとおしゃべりをしてみてください！


#参考記事
[他のオブジェクトについているスクリプトの変数を参照したり関数を実行したりする。](https://qiita.com/tsukasa_wear_parker/items/09d4bcc5af3556b9bb3a)
[初心者向け UnityのGetComponentってなんやねん？](https://qiita.com/kurisaka_konabe/items/9d0250de8610666b9013)
[一日で俺の嫁を作る方法　～一日で自分の好きな声・キャラ・見た目でおしゃべりしてくれるAIキャラクターを作ろう～](https://qiita.com/mfuji3326/items/49649877631e22211da7#%E4%BD%9C%E3%82%8A%E6%96%B9)
[unityで音を鳴らす](https://qiita.com/studio_haneya/items/8883812d7dcd8a626f69)