Actions on Googleのテンプレートを使って簡単なクイズアプリを作ってみた

ハッカソンでGoogle Homeを使うことになったので、まず手始めにテンプレートのクイズを動くようにしてみた
Actions on Googleのレイアウトが変わっていたので、とりあえず手順だけ挙げてみました

# 必要なもの
* Googleアカウント
* ブラウザ(Chrome推奨です。safariとかfirefoxでも動きました)

# 1.Actions on Googleのページへアクセスしてプロジェクトを作成する
* [こちら]( https://console.actions.google.com/)からActions on Googleのページにアクセスする
* Googleアカウントでログインができたら「New Project」を押してプロジェクトを作成する
![326e5614f0e74f63ab7058b65f6f93cf-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/69372c58-e671-c85a-4a35-1ec5a3eec4ee.png)

* 各項目を設定して、「Agree and continue」ボタンをクリックする
![44715d5bce8fd0736d9a3d02e34861eb-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/0891f61d-c232-18b6-6165-801ab05ececb.png)

* プロジェクト名や言語の設定を行なった後に「Create projejct」ボタンをクリックする
![b681bd27f13805ee68c79cd9a5f62915-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/2d01f4ad-2baa-da80-ca6a-d6b830dd9687.png)

* 作成できるアプリの一覧画面が表示されるので、「Templates」を選択する
![02532a4bab9a34b2bfb89548a8c123c2-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/97cb9186-80a3-c075-5bab-e6d261aacb3a.png)

* Templateがいくつかあるので、今回はTriviaでクイズアプリを作成する
※Personality Quiz 2 は日本語未対応みたいです
![212b5d77f08e73444ae38e317aa54233-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/02adae33-894d-0776-cc85-3c36b5b6b77b.png)

これでプロジェクト作成完了です！
この後はクイズアプリのテンプレートを作成していきます。

# 2.クイズアプリを作成する

* 言語が英語しか設定されていない場合は、「Modify languages」ボタンをクリックして言語の設定を行う
![df5747602c493302f81633d4b7f17a1d-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/d3b4f852-e63f-c960-3e20-3f624e8f5fbc.png)

* 「Japanese」を選択後、「Save」ボタンをクリックする
* 設定が反映されたら「Overview」をクリックして初期画面に戻る
![ebe7ad79a433e4261287658d71173e5d-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/a1e80096-b678-6b26-9a14-bbba21bbd2f8.png)

* Quick setupを選択してスマートスピーカーを呼ぶときの名前を設定する
(「OK Google 〇〇につないで」の〇〇の部分です)
![a99c9e57f75323771507d9c0e491bb1c-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/fa29cfb3-965a-642f-4aa5-88d1164e2df9.png)
* 名前の設定が終わったらsaveを行って、左にあるActionsを選択する
![b96d205cd74d526f47dcd70cd98df76a-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/e9418d23-fe19-3daa-7bd4-4390576c12d4.png)

* 「Get Started」ボタンをクリックする
![5fa5f019054ce8067b0140d0c380e09a-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/4d2dbae5-4fbb-8976-6f8e-c21fe939ef18.png)

* 「Trivia Template」リンクをクリックして、出題される問題のテンプレートを表示する
(問題のテンプレートはGoogleスプレッドシートで作成されています)
![5dc6e46c1c365dde3c9330bc426873b7-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/0c4c2c99-73c5-aa0c-9ac8-999a63f96eae.png)

* 「コピー作成」ボタンを押して自分のGoogle スプレッドシートにテンプレートのコピーを作成する
![f737d59484752c624a964f6ced04dc22-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/1709c788-ba61-3977-9929-b1ad7060ca0f.png)

* スプレッドシートが作成されたら「共有ボタン」→「共有可能なリンクを取得」で作成されたリンクをコピーする
![9d797b92f8fabbe1308de91deeee3c95-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/933a1144-a22c-f07d-0dd9-7c908937978d.png)

* コピーができたらAction Consoleの画面に戻り、先ほどコピーしたURLを貼り付け、「UPLOAD」ボタンをクリックする
![1c5875044eb4a8c6ea73513a2aef91c0-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/d78d85eb-2442-b910-1fac-e7f325876aac.png)

# シミュレータでテストを行う
* アップロードが完了すると「Upload Successful!」と表示されるので、「Go to simulator」ボタンをクリックして、テストを行う
![da575c2db016e93b3f46332b4494d186-png.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533556/b152c257-6329-c22f-729d-831b677be466.png)

シミュレータでテストを行って、問題が発話されたらクイズアプリ完成です。
お疲れ様でした！

# 最後に
今回簡単にGoogle Homeのアプリを作ることができたので、次はDialogflowを使ってチャットアプリを作っていこうと思います。

ただTriviaのテンプレートだと選択肢の2つ目と3つ目の間に「ゲームを終了します」と発話されちゃうので、これをどうにかしたいところです。。。


こちらの記事を参考にさせていただきました。ありがとうございました。
[3分でつくるGoogle Home自作アプリ](https://qiita.com/donchan922/items/4d499bfa8d72981702be)