トマシープが学ぶ

Unity/VR/AR/デザイン好きのミーハー 記事内容は自分用のメモです

音声認識で3D文字表示【FlyingText3D】

前回、声認識してcharacter particleというアセットで言葉を可視化するとこまではできました。

bibinbaleo.hatenablog.com

Flying Text3D

 ただ、やっぱり3Dで表示したかったので、思い切ってアセットを買いました。

 20ドルぐらい

レビューでもコエカタマリンできたって書いてあったので安心して買いました。

f:id:bibinbaleo:20180113161121p:plain

使い方

空のゲームオブジェクトにFlyingtext3dスクリプトを付けます。

add Fontで.bytes形式のフォントファイルを入れます。

f:id:bibinbaleo:20180113160829p:plain

そして下のCreate~で実行中じゃなくてもボタン一つで3D文字が作れます。

f:id:bibinbaleo:20180116212806p:plain

わお!(日本語化は下に書いてます)

f:id:bibinbaleo:20180116212811p:plain

また自分でスクリプトを作って

FlyingText.GetObject("I'm bibinba");

とstart関数などに書くと

f:id:bibinbaleo:20180113164137p:plain

表示されました!簡単。

FlyingText.GetObjects("I'm bibinba");

GetObjects(sをつける)とすると一文字位置文字バラバラになります。

f:id:bibinbaleo:20180113164620p:plain

フォント追加

IPAexフォント Ver.003.01(IPAexFont Ver.003.01) | IPAexフォント/IPAフォント

ttfフォントを.bytes拡張子にしたら読み込めます。

f:id:bibinbaleo:20180113160835p:plain

手動でやってもいいですが、Flyngtextコンポーネントの下のほうにConvertするところがあるのでそこでもできます。

f:id:bibinbaleo:20180116212815p:plain

あとは上のほうのaddFontから加えれます。

日本語化

そのままだと私の環境では日本語が文字化けします。

f:id:bibinbaleo:20180113160832p:plain

f:id:bibinbaleo:20180113160353p:plain

f:id:bibinbaleo:20180113160401p:plain

UTF-16にしないといけないそうです。

Note that if you’re using characters in strings outside the ASCII range and you’re using C#, your script must be saved with UTF-16 encoding. Unityscript users can use UTF-8 or UTF-16.

スクリプトファイルの文字エンコーディングについて
日本語(マルチバイト文字)を扱う場合、文字エンコーディングは以下にする必要があります。(ドキュメントのP.17参照)
- C#: UTF-16
- UnityScript: UTF-8 または UTF-16

私の場合はこちらのスクリプトをassetフォルダ以下において、Unityを再起動したら使えるようになりました。

github.com

UTF-8に変換してくれるスクリプトだそうです。

DEBUG.LOG (スクリプトファイルのutf-8変換)

f:id:bibinbaleo:20180115160231p:plain

UTFあたりはよくわかりませんね・・・

altebute.hatenablog.com

物理など

設定からColliderや

f:id:bibinbaleo:20180113164245p:plain

rigidbodyを付けることもできます

f:id:bibinbaleo:20180113164251p:plain

床の上に落ちてくれます。

f:id:bibinbaleo:20180113164154p:plain

シーン内で手動で床をドン!ってやったらバラバラになった!

f:id:bibinbaleo:20180113164726p:plain

 

音声認識を表示

f:id:bibinbaleo:20180115160427p:plain

こんな感じのスクリプトで、音声認識で受け取ったstringをランダム位置に上から文字が下りてくるようにしました。

gist.github.com

なんかエラー出てたけど翌日になったら動いた。

f:id:bibinbaleo:20180113171735p:plain

最初はupdateObject関数を使っていたのですが、それだと同じ場所に文字が変わるだけなので、認識したときに一回だけ新しい場所から文字が降ってくるようにしました。

if (text != aa.kekka)
{
textObject = FlyingText.GetObject(aa.kekka, random, Quaternion.identity);
}
text = aa.kekka;

こんな感じでやったら変数の値が変わっているのを察知できました。

物理

rifidbodyとConvexmeshを付けます。

f:id:bibinbaleo:20180115162735p:plain

Physics Materialでどれくらい跳ねるかとか摩擦とかを設定できます。

f:id:bibinbaleo:20180115162835p:plain

また重力を減らして、ゆっくり落ちてくるようにするには、スクリプトを書いてもいいがProject setting>PhysicsからGravityで一括で変えることができる。

f:id:bibinbaleo:20180115162838p:plain

f:id:bibinbaleo:20180115162738p:plain

ちなみにみゅみゅさんの生放送ではtwitterニコニコ生放送などのコメントがリアルタイムで上から落ちてきて、掴んで投げたりしています。楽しそう!

www.nicovideo.jp

コメントの取得はニコニコに関してはアセットを公開してくださっている方がいます。

qiita.com

youtubeも記事はあった!

blog.sky-net.pw

まあそもそもコメント来ないから使わないけど。

当たり判定

床に当たった時にドンっていう音を発生させたい。

生成される文字オブジェクトにvoid OnCollisionEnter (Collision col)っていうスクリプトつけるのどうするんだろうと思ったけど、床につければいいのか。

ちなみにflyingtextにつけるスクリプトに書いても反応なかった。

とりあえずできました。2回床に当たるときはちゃんと2回音が鳴ってます。

文字をつかむ

VRTKを入れて文字をつかめるようにしたい。

ただ生成されるテキストにInteractableObjectなどのスクリプトを付けないといけないのだが、付け方がわからない。

f:id:bibinbaleo:20180115211749p:plain

スクリプトで動的につける方法が二つぐらいあるみたい。

tsubakit1.hateblo.jp

ただaddcomponentはうまくいかないし(外部のコンポーネントだとエラーが出る??)、RequireComponentはあらかじめ何かひとつスクリプトをつけないといけない。

 textObject.AddComponent(typeof(スクリプト));

でできた。

www.wisdomsoft.jp

qiita.com

ゲームを実行してから、生成されたものにGrabbable〜などをつけたら掴むことはできるけど、これを動的にやるのはどうするんだろう???

f:id:bibinbaleo:20180115211752p:plain

ちなみにつかめるようにするには、Window>VRTK>setup interactable~を開いて、オブジェクトを選択した状態でsetupボタンを押したら設定したようにつかめる。

f:id:bibinbaleo:20180115211757p:plain

頭から出す

前回同様、頭(自分)の位置から言葉を出して、ものに当てたい。

頭の位置を取得してそこから発射して、AddForceでその方向に力を加えたら良さそう。

Vector3 head = eye.transform.position;
Vector3 force = eye.transform.forward*300;
textObject = FlyingText.GetObject("スタート", head, Quaternion.identity);
textObject.GetComponent<Rigidbody>().AddForce(force);

こんな感じで一応最初のスタートは発射されました。

 

*300で力の強さが調整できます。ふわーんって発射したいな

qiita.com

unity3d.sakura.ne.jp

色の変化

色をランダムで変えようと思ったのですができません!!!

まず直接変えるには<color=#7e1113>みたいなカラーコードを文字列のところに打つ必要があるのですが、Unityでカラーコード形式のランダム数値を作る方法がググっても出てこない。

FlyingText.GetObject("<color=#7e1113>スタート");

qiita.com

次にマテリアル経由で変える方法もやったのですが、GetObject関数の中にマテリアルを入れたらエラーが出る。

f:id:bibinbaleo:20180115161307p:plain

全部のパラメーターを書かないといけないっぽい。

textMaterial.color = rand;
Vector3 random = new Vector3(Random.Range(-12.0f, 6.0f), 4, Random.Range(1.6f, 6.0f));
textObject = FlyingText.GetObject(aa.kekka,textMaterial,null,1.0f,0.3f, 10,random, Quaternion.identity);

ということで書いたら、変わるけど、全部の色が変わる。

そうか、マテリアルは全部共通だもんね。

じゃあ"<color=#7ae090>スタ<color=#009090>ート"こういう感じで別の色にしたらどんな感じでマテリアル生成されるの?って思ってやったら一色なんですけど!はあ?なんですけど

gist.github.com

よくわからないけど、必須スキルじゃないから無視しよう。

あとマテリアル変えるだけならGetObject関数の中にマテリアル書かなくても、勝手にマテリアル変わりますやんか。

最後に

ツイートが若干バズったせいで、自分の気持ち悪い声を1000回近く再生されることになった。

f:id:bibinbaleo:20180115215410p:plain

しかも最初の言葉が「世の中そんなに甘くないんだ!」だし。辛い。ちなみにこのセリフはおそ松さんのセリフです。

f:id:bibinbaleo:20171207221924p:plain

このブーメランをやりたいんだ!

f:id:bibinbaleo:20171207221919p:plain

詳しくはこちら

bibinbaleo.hatenablog.com

 

あとこちらの方は、音声認識とこのFlyingTextを使って作品を作ったそうです。

qiita.com

qiita.com