--- title: 音声認識でジャルジャルの国名分けっこを実装した話 tags: 音声認識 WebSpeechAPI 文字起こし JavaScript author: takacpu55 slide: false --- #はじめに こんにちは。[ぱそきいろ](https://twitter.com/takacpu55)です。 みなさん、M1は見ましたか? 賛否は色々別れるかとは思いますが、個人的にジャルジャルの「国名分けっこ」がNo.1だったと思います。 そこでWebSpeechAPIを使って実際に「国名分けっこ」をするサイトを作ってみました。 もしよかったら見ていってください。 #プロダクトデモ

国名分けっこを実装 pic.twitter.com/HvhnSV9zmp

— ぱそきいろ (@takacpu55) 2018年12月17日
完成品です。 声に合わせて、国の続きを言ってくれてることが分かります。 #音声認識 はじめは、Google Cloud Speechを使おうと思ってたのですが、ハマりどころが多すぎて[こちら](https://qiita.com/kolife/items/a0af7702eef05994fbfb)のサイトを参考にして文字起こしをすることにしました。 それにしても、17行で音声認識をできるなんてすごいですね。 ありがとうございます。 #国名分けっこについて すでにやられてる人がいるんですね。 [ジャルジャルの「国名分けっこ」を実装してみた](https://qiita.com/wadadon/items/72854db235a4c58d341d) ただ、僕は音声認識をして見たかったので、上記の音声認識にプラスする形で実装しました。 取得した文字をひたすらif文で条件分岐し、対応する文字を表示させています。 ただし、例えば「アメリカ」の「アメ」だったら「雨」と認識されてしまうので何も考えずに分けるわけにはいきませんでした。一つづつ試して完成させました。 (「オーストラリア」の「オース」は「大須」と判断されました。) #コード 最後にコードを載せます。 jsとかhtmlを触ったことないので、開発環境がなく、メモ帳で書きました← インデントが揃ってなくて見にくいのはご容赦ください。 ```Javascript:fileName.js 国名分けっこ

国名分けっこ

``` #まとめ jsやhtmlをちゃんと触ったことがないので、殺風景な完成品となってしまいました。 また、Web系の知識が乏しいのでデプロイの方法とかが分からなかったです。コードは全部載せてあるので、興味がある人は試してみてください。