Alexa Skills Kit SDK for Python (Beta) でEcho Spotのスキルをつくろう!- こんにちはこけしスキル編 – #EchoSpot #Alexa #kokexa

AWS運用自動化サービス「Cloud Automator」

http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_Kokeshi.png
 こんにちは、サーバーワークスのこけしの人、坂本(@t_sakam)です。今回は、先日リリースされたAlexa Skills Kit SDK for Python (Beta) を使って、昨日(7月26日)発売したEcho Spot用のスキルを作ってみたいと思います。

 今回は、公式のGitHubにあるサンプルを少しアレンジして、簡単なEcho Spot用の「画像が表示されるスキル」を作ります。こけしの系統である「ナルコ」か「トーガッタ」を選ぶと、Echo Spotの画面に「鳴子系か遠刈田系のこけしの顔が表示される」という簡単なスキルです。
 それでは、作ってみましょう!

Amazon Developer ServicesのAlexa Skills Kitでスキル作成

スキルの作成

 まずはAmazon Developer Servicesにログインします。[Alexa Skills Kit]タブ – Alexa Skills Kitのトップのスキル一覧ページで[スキルの作成]ボタンをクリックします。
 [新しいスキルを作成]ページでスキル名を「こんにちはこけし」、デフォルトの言語を「日本語」に設定します。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_002.png
 [スキルに追加するモデルを選択]の箇所では「カスタム」を選択し、[スキルを作成]ボタンをクリックします。

呼び出し名の入力

 左のメニューから[呼び出し名]を選択します。[スキルの呼び出し名]の箇所で「こんにちはこけし」と入力します。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_003.png

カスタムインテントを作成

 左メニューの[インテント(3)]の横の[追加]リンクをクリックします。ラジオボタンで[カスタムインテントを作成]を選択します。「HelloKokeshiIntent」と入力し、[カスタムインテントを作成]ボタンをクリックします。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_004.png

カスタムスロットタイプを作成

 左メニューの[スロットタイプ(0)]の横の[追加]リンクをクリックします。ラジオボタンで[カスタムスロットタイプを作成]を選択します。「KOKESHI_ITEM_LIST」と入力し、[カスタムスロットタイプを作成]ボタンをクリックします。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_005.png

スロット値の設定

 作成された「KOKESHI_ITEM_LIST」にスロット値を設定します。「このスロットタイプの新しい値を入力」と書かれた入力ボックスに「ナルコ」と入力し、左の[+]ボタンをクリックします。続けて、「トーガッタ」と入力し、左の[プラス]ボタンをクリックし、スロット値を設定します。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_006.png

インテントスロットとサンプル発話の設定

 [インテントスロット]一覧の1番目の「新しいスロットを作成」と書かれた入力欄に「Kokeshi」と入力し、[+]ボタンをクリックします。左のスロットタイプは先程作成した「KOKESHI_ITEM_LIST」を選択します。

 上のサンプル発話は「このインテントの呼び出しに使われると考えられる発話」と書かれた入力ボックスに「{Kokeshi}」と入力し、左の[+]ボタンをクリックします。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_007.png

インターフェイスの設定

 左メニューから[インターフェイス]を選択します。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_008.png
 このスキルは、画面と音声対話の両方を使用するので[Displayインターフェイス]を有効にします。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_009.png
 有効後は、画面操作向けの[ビルトインテント]が左メニューで増えています。

スキルIDをコピー

 左メニューから[エンドポイント]を選択します。ラジオボタンで[AWS LambdaのARN]を選択します。すると、このスキルのスキルIDが表示されます。あとで使うので、コピーして控えておきます。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_010.png

モデルの保存とビルド

 ここまでできたら、いったんモデルの保存とビルドをおこなっておきます。上の方にある[モデルを保存]ボタンをクリックします。保存が終わったら、[モデルをビルド]ボタンをクリックします。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_011.png

Alexa Skills Kit SDK for Python

 開発環境(EC2)で、スキル用のディレクトリ「hello_kokeshi」を作成し、作成したディレクトリに移動します。
 このディレクトリに以下のコマンドでAlexa Skills Kit SDK for Pythonをインストールします。

http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_012.png

Serverless Framework

 Serverless Frameworkで必要なファイルを自動生成します。

http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_013.png
Serverless Framework参考記事
http://blog.serverworks.co.jp/tech/2016/09/07/serverless-framework-1-beta-1/

「serverless.yml」ファイルの編集

 自動生成された「serverless.yml」ファイルを以下の画像のように編集します。ここで先程控えておいたスキルIDを使います。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_014.png

handler.py

 Alexa Skills Kit SDK for Python (Beta) の公式Githubにあるサンプル「Hello World」のコードをコピーし、画像を扱うのに必要なクラスを追加で読み込んだり、Echo Spotで画像を表示したい箇所や、文言を編集します。

サンプル「Hello World」
https://github.com/alexa-labs/alexa-skills-kit-sdk-for-python/blob/master/samples/HelloWorld/skill_using_decorators/hello_world.py
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_015_01.png
 以下のコードの赤枠の箇所で、画面付きのデバイスかどうかをチェックして、処理を分岐しています。そうしておかないと、画面なしのデバイスで実行した場合にうまく動かないためです。画面付きのデバイスから実行された場合は、バックグラウンドにこけしの顔の画像を表示するようにしています。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_015_02.png

デプロイ

 Serverless Frameworkでデプロイします。

http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_016.png

仕上げ

LambdaファンクションのARNをコピー

 AWSのマネジメントコンソールにログインします。作成されたLambdaファンクションを表示し、画面右上のARNをコピーして控えておきます。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_017.png

エンドポイントを設定

 Amazon Developer ServicesのAlexa Skills Kitのエンドポイントのページに戻ります。先程控えたLambdaファンクションのARNを[デフォルトの地域]に入力し、画面上の[エンドポイントを保存]ボタンをクリックして、設定を保存します。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_018.png

公開設定

 画面上の[公開]タブをクリックします。まだスキルは公開しませんが、ベータテストに招待した人がAlexaアプリでみたときにわかりやすいようにアイコンなど一応設定しておきます。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_019.png
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_020.png
 ベータテストに招待された人がAlexaアプリで確認すると以下のようになります。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_021.png

テスト

 画面上の[テスト]タブをクリックしてテストしてみましょう。

ナルコを選んだ場合

http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_025.png

トーガッタを選んだ場合

http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_026.png

ヘルプ

 ヘルプのときはサンプルの「Hello World」の文言しかいじっていないので、カードの表示となっています。
http://corporate-tech-blog-wp.s3-website-ap-northeast-1.amazonaws.com/tech/wp-content/uploads/2018/07/EchoSpot_027.png

まとめ

 今回は、Alexa Skills Kit SDK for Python (Beta) を使って、昨日発売したEcho Spot用のスキルを作ってみました。

 サンプルの「Hello World」を少しいじった簡単なスキルですが、よいスキルができたのではないでしょうか?
 画像を使うことによって伝えられる情報が増えるので、Alexaの活用方法がますます広がりそうですね! SDKにPythonが加わったのも、Pythonユーザーには嬉しい限り!

 いや〜、ASK SDK for PythonとEcho Spotって本当にいいものですね!

AWS運用自動化サービス「Cloud Automator」