NeosVRでリアルタイム翻訳機を使う

# はじめに

こんにちは！tuttuです！
twitterで紹介した、こちらのリアルタイム翻訳機の導入方法を説明します！
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr"><a href="https://twitter.com/hashtag/NeosVR?src=hash&amp;ref_src=twsrc%5Etfw">#NeosVR</a> 海外の人がつくったリアルタイム翻訳機だよ！すごすぎ！<br>今日はちょっと趣向を変えて紹介動画にしてみたよ！ <a href="https://t.co/hH2eMJ0Rpt">pic.twitter.com/hH2eMJ0Rpt</a></p>&mdash; tuttu@VRChat始めました (@tuttu74459297) <a href="https://twitter.com/tuttu74459297/status/1227645786256637952?ref_src=twsrc%5Etfw">February 12, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

ちなみにこれは、海外のAnomalousさんが作ったもので、本人の紹介動画もあります。
https://www.youtube.com/watch?v=-Ygun89yHZU


わかりづらいところ、間違っているところがあれば随時加筆修正するので、
お気軽に教えてください！

# まとめ

最初に要点を書いておきます。

1. 環境構築: C# .NET Framework 4.6.2, 4.8 で動作確認済み
2. Azure認証キーの取得(無料試用版あり): Speech API (Cognitive Service)
3. ソースコードのclone: https://github.com/Anomalous/AnomalousNeosExperiments/tree/master/Translator
4. NeosTranslateDataModel.csの認証キーと言語を設定
5. Translatorをローカルで立ち上げ
6. (Neosにて)ツール配布ワールドでツールを取得: http://cloudx.azurewebsites.net/open/world/U-Anomalous/R-55501fd5-8e98-40db-9dd4-e2cae7ea41c6
7. ワールドの動画に沿って、自分の名前を設定

1～5は現実世界で行い、6,7はNeosVRで行います。
これらについて次の章から詳しく見ていきましょう！


# 動作確認環境

- Windows10
- Oculus Quest + Virtual Desktop

また、PCにマイクの音声が届いていることを確認しておきましょう。

# 現実世界編

## C#環境構築


### Visual Studioのインストール

Visual Studioをインストールするのが一番手っ取り早いかと思います。
https://qiita.com/grinpeaceman/items/b5a6082f94c9e4891613
こちらのページの「Visual Studioインストール」まで進めてください。

(以下の話はVisual Studio 2019で進めています)

※補足
ふららんさん曰く、Visual Studio 2017で起動しなかったとのこと。
2019を使うのが無難かもしれません。
各Visual Studioの対応機能については知見がないので、わかる方がいたら教えていただけるとありがたいです。
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">tuttuさんのツイートに貼ってある記事の補足。VisualStudio2017ではエラーが出てサーバー立ち上がらないです。<br>記事通りVisualStudio2019で起動すればサーバー立ち上がります。 <a href="https://t.co/LTWhi2FiUk">https://t.co/LTWhi2FiUk</a></p>&mdash; ふららん(furarann)@Nket広報担当　今日も一日生き延びてえらいっ！集会やってます！ (@furarann_VR37) <a href="https://twitter.com/furarann_VR37/status/1229336779959848960?ref_src=twsrc%5Etfw">February 17, 2020</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

### .NET Frameworkのインストール

次に、.NET Frameworkをインストールします。

4.6.2～4.8のバージョンであればどれも動くと思いますが、僕は4.6.2と4.8で動くことを確認しました。
(参考: [.NET Framework のバージョンの互換性](https://docs.microsoft.com/ja-jp/dotnet/framework/migration-guide/version-compatibility))

[こちら](https://dotnet.microsoft.com/download/dotnet-framework/net48)から4.8のDeveloper Packのインストーラーをダウンロードし、
![net0.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/6ef8a2c7-59e8-1dbc-6ded-306003db4c88.png)


インストーラーを起動してインストールを進めます。
![net1.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/cb61edef-51fb-1644-721c-c2b37f30bcb4.png)



## Azure Speech API 認証キーの取得

Microsoft/Facebook/Github/LinkedIn のいずれかのアカウントが必要です。
(Microsoftのアカウントは、WindowsのOSセットアップのときに作っていることが多いです)
持っていなければ、[こちら](https://support.microsoft.com/ja-jp/help/4026324/microsoft-account-how-to-create)から作りましょう。

[Azure Cognitive Serviceのページ](https://azure.microsoft.com/ja-jp/try/cognitive-services/)に行き、Speech APIタブをクリック
![azure1.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/b7bfd0d4-7395-3d5f-2266-ab2901147c40.png)


Speech Serviceの「APIキーの取得」をクリック
![azure2.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/831bd99f-a70b-f701-c0d5-a610626eed8b.png)


「7日間の試用期間」をクリックします。
(有効期限があるので、本格的に使う場合は課金する必要があります)
ここでログインを求められるので、持っているアカウントでログインします。
ログインすると、認証キーが2つ表示されます。
こちらの認証キーは後ほど使います。
![azure3.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/2f071e31-7a04-dd37-7daf-8fca63315d8b.png)

![azure4.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/f30b945b-39f7-fbec-3e1b-9bacfbffa837.png)


## 翻訳機サーバーの立ち上げ

### ソースコードのダウンロード

https://github.com/Anomalous/AnomalousNeosExperiments
こちらのソースコードをダウンロードします。
gitがあればcloneしてください。

ない場合は、zipでダウンロードし、好きな場所に解凍します。
(基本的には日本語を含まないパスに解凍するのが良いです)
![translator.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/0ed71ee3-a160-63dc-60cc-82d424a9d6eb.png)


### Visual Studioで開く

Visual Studioを立ち上げ、「プロジェクトやソリューションを開く」から先ほどのソースコードを開きましょう。
![vs1.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/ba6606dc-3c8f-92f1-1c61-ac0356d32b0c.png)


cloneもしくは解凍したAnomalousNeosExperimentsの下(もしくはAnomalousNeosExperiments-masterの2つ下)にTranslatorというフォルダがあります。
その中にある「NeosTextTranslator.sln」をVisual Studioから開きます。
![vs2.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/e25e03b3-0a34-f177-44d1-290f047adfc3.png)


### 認証キーや言語の設定

開いたNeosTextTranslatorのプロジェクトに対し、先ほどの認証キーや言語の設定をしていきます。
1. NeosTranslateDataModel.cs を開く
2. 先ほど取得したAzureの認証キー(2つあるうちのどちらでも良い)を`DEFAULT_AZURE_SUBSCRIPTION_KEY`にセット
3. 入力側(話す方)の言語を`TRANSLATOR_INPUT_LANGUAGE`にセット(これを読んでいる人は`ja-JP`で良いはず)
  - 翻訳先の言語はNeos側で設定します
![vs3.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/4617044d-f89c-cd81-6545-5cf2d9e1ceac.png)


### サーバーの立ち上げ

Visual Studio上のツールバーにある「開始」を押します。
![vs4.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/0e147711-c3f6-d015-5112-24533d719817.png)


すると黒い画面が立ち上がれば成功です。
![vs5.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/9ab31354-02b5-6b25-5220-aba5066da57c.png)


試しに、http://localhost:8083/SetLanguage?Language=en などを叩いてみると、サーバーが反応していることを確認できます。
![vs6.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/1a6e6e84-8e97-5067-4ee3-5ec1d7932e63.png)


# NeosVR編

NeosVRそのものの始め方は
https://neosvrjp.memo.wiki/
を参考にしてみてください！

最近開設された、日本人向けNeosVRコミュニティのDiscordもあります。
https://discord.gg/GH8YRbd

## 翻訳機配布ワールドで翻訳機をゲット！

http://cloudx.azurewebsites.net/open/world/U-Anomalous/R-55501fd5-8e98-40db-9dd4-e2cae7ea41c6
こちらのリンクを開くと、翻訳機を配布しているワールドに飛べます。
(NeosVRを立ち上げた状態で開くと確実です)

ワールドでは、Anomalousさんの動画と翻訳機、そして翻訳機のインスペクターがお出迎えしてくれます。
![2020-02-15 19.30.21.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/f0c3b563-f075-bda2-62c4-c190c8908afd.jpeg)


この場で翻訳機をセットアップ(下記)してしまい、保存しましょう。

## 翻訳機のセットアップ

やることは2つです。
1. 翻訳機にユーザー名を登録する
2. 翻訳先の言語を登録する

まず翻訳機にユーザー名を登録する必要があります。
ChatTranslatorの**settings > RunAsUser の**インスペクターが表示されているので、この中にあるValueを自分の名前に書き換えましょう。
(ワールドで開かれているインスペクタそのまま編集するのがベストです)
![2020-02-15 19.32.48_LI.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/c40ab986-cc72-bc76-fc16-90cc1edaed4a.jpeg)




続いて、翻訳先の言語を登録します。
翻訳機の上に`ja`と入っていますが、試しにこちらを`en`に変更してみましょう。
変更したら、`Set Language`ボタンを押します。
(その他の言語は[こちら](https://docs.microsoft.com/ja-jp/azure/cognitive-services/speech-service/language-support)にコード表があります)
![2020-02-15 19.33.37.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/884d5685-6776-dd44-dcbe-f9ab1e765b7d.jpeg)

ボタンを押した直後に、こんな感じの選択画面が出てくるかもしれません。
**今回は**立てたサーバーへの通信を許可するため、「Allow」を押してください。
(むやみな通信の許可は危険なので、今回以外では必要だとわかっている場合のみAllowしましょう)
![qUuYagIvUw.55.30.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/45cbed68-36fe-f547-1725-0fd99a608bee.jpeg)


すると、ここまでうまくできていれば翻訳機が動きます！
完了したら、翻訳機をインベントリーに保存しましょう。
![2020-02-15 19.34.46.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/586728/c78aafde-39b0-dcab-f1a7-462f4353920c.jpeg)


(ユーザー作成ツールの保存方法は[こちら](https://neosvrjp.memo.wiki/d/%a5%ac%a5%a4%a5%c92)を参考に)

# 動かないときのチェックポイント

- サーバーを立ち上げるときにエラーが出る
  - .NET Frameworkのバージョンが違うかもしれません。僕は最初4.6.1でやろうとしてうまく立ち上がりませんでした
  - ソースコードの変なところを編集してしまったかもしれません。認証キー周りのソースコードを見直してみましょう
- 最後まで完了したけど翻訳機が反応しない
  - ユーザー名を翻訳機に正しく設定できていない可能性があります
      - 翻訳機のインスペクタを開き、settings > RunAsUser の中にあるValueの値を確認してみましょう
  - 通信を「Deny」(拒否)してしまった可能性があります
      - この場合、localhostをブラックリストから削除します。Tools > Debug > Web hosts と開き、localhostが「Deny」となっていたら、隣のRemoveボタンを押しましょう
- Set Languageを押したら青い文字は表示されたけど、翻訳結果が出てこない
  - ソースコードに設定を入れるときに、Azureの認証キーや言語の設定を間違ってしまった可能性があります
  - 音声がPCに届いていない可能性があります。PCの設定からマイクを確認してみましょう