こんにちは、ナレコム前川です。
今回は、Amazon Sumerian の公式チュートリアルの
Using the Dialogue Component and Amazon Lex to Build a Chatbot を進めていきたいと思います。
ここでは、以下のことについて学んでいきます。
・AWS configuration
・Amazon Cognito identity pool ID
・Dialogue component
・State Machine
それでは、進めていきましょう。
1. Amazon Cognito Identity Pool ID の作成
シーンを作成する前に、Pool ID を作成していきます。
① AWS アカウントにサインインし、 AWS CloudFormation stack template にアクセス。
② リージョンを US East (N. Virginia) もしくは EU (Ireland) に設定。
※ 私がアクセスした際には、既に US East（バージニア北部）になっていました。
① AWS アカウントにサインインし、AWS CloudFormation stack templateにアクセス。
② リージョンを US East (N. Virginia) もしくは EU (Ireland) に設定。
※ 私がアクセスした際には、既に US East（バージニア北部）になっていました。
③ スタック名を更新し、確認項目にチェックを入れたら作成。
④ 作成が完了したことを確認。
⑤ 出力から Pool ID を確認。
2. Amazon Lex Bot の作成
ここでは、チュートリアルで必要となる Amazon Lex Bot の作成を行っていきます。
今回は、AWS CloudFormation stack template に既に含まれている Lex Bot を使用します。
このサンプルボットを使用すると、Bot と会話してホテルやレンタカーの予約ができます。
① Amazon Lex にアクセスし、Create から BookTrip を選択し、作成。
作成できたら以下のような画面が開くと思います。
② Setting から Alias を Test に設定。
③ 設定したら、Publish をクリックして公開。
3. Chat Bot の作成
これから Chat Bot の作成を行っていきます。
シーンのセットアップ
① ダッシュボードから Default Lighting を選択。
① ダッシュボードから Default Lighting を選択。
② シーン名を「Chat Bot Tutorial」にし、シーンを作成。
※ シーン名は自由に決めて作成してください。
③ Entities パネルのシーン名を選択し、AWS configuration から Pool ID を設定。
④ Import Assets から Cristine を追加。
⑤ Assets パネルから Cristine をキャンバスに追加。
Dialogue Component の追加
① Cristine を選択し、Add Component から Dialogue Component を追加。
② Name に BookTrip、Alias に Test を入力。
4. State Machine の設定
ここでは、Chat Bot の振る舞いを作成するためにステートマシンの設定を行っていきます。
① Cristine を選択し、State Machine コンポーネントの +ボタンをクリック。
② 名前を「ChatBot」に変更。
③ State1 の名前を「Start」に変更し、AWS SDK Ready アクションを追加。
この設定によってシーン開始時に AWS サービスと接続を行います。
ステートの追加
ここでは、5つのステートを追加し、設定していきます。
State : Wait for Input
① Add State から新しいステートの追加。
② ステート名を「Wait for Input」に設定。
① Add State から新しいステートの追加。
② ステート名を「Wait for Input」に設定。
③ Key Down アクションを追加し、Key に Space を設定。
State : Start Recording
① ステートを追加。
② ステート名を「Start Recording」に設定。
③ Start Microphone Recording と Key Up アクションを追加。
④ Key Up の Key に Space を設定。
State : Stop Recording
① ステートを追加。
② ステート名を「Stop Recording」に設定。
③ Stop Microphone Recording アクションを追加。
State : Process with Lex
① ステートを追加。
② ステート名を「Process with Lex」に設定。
③ Send Audio Input to Dialogue Bot アクションを追加。
① ステートを追加。
② ステート名を「Process with Lex」に設定。
③ Send Audio Input to Dialogue Bot アクションを追加。
※ Log user input と Log bot response にはチェックを入れないでください。
State : Play Response
① ステートを追加。
② ステート名を「Play Response」に設定。
③ Start Speech アクションを追加。
④ Use Lex Response にチェックを入れる。
最後にステート同士を以下のように矢印で繋いでください。
また、Start ステートが Set As Initial State になっていることを確認してください。
それでは、試しにシーンを実行してみましょう。
マイク使用の許可を求められるのでそちらを許可してください。
「Book a hotel」とマイクに向かって言うと返事が返ってきます。
スペースキーを押しながら発話を行います。
返答が返ってくる質問項目があらかじめ決まっているので、 コチラ を参考にしてください。
また、新たに質問項目や回答を追加したい場合は、Amazon Lex から設定できます。
実行動画は以下です。
5. TextBot Behavior の作成
ここでは、文章を入力するとアバターが応答してくれるように設定していきます。
① Create Entity から </> を追加。
② Inspector パネルの HTML を展開し、Open in Editor をクリック。
③ 以下のプログラムと置き換える。
キャンバスの下にテキストボックスがあるのを確認してください。
Behavior の複製
① Assets パネルから ChatBot を選択し、複製。
② Cristine を選択し、State Machine コンポーネントに ChatBot 2 を追加。
③ 先程作成した ChatBot を削除。
ChatBot 2 の修正
① ChatBot 2 を編集モードにし、名前を「TypeBot」に変更。
② Start Recording と Stop Recording のステートを削除。
③ Key Down ステートを削除して、DOM Event Listen を追加。
④ 以下のように設定。
⑤ 新しいステートを追加し、名前を「Get Text Input」にして Get Html Text アクションを追加。
⑥ Entity (optional) に HTML entity をドラッグ＆ドロップ。
⑦ Html element selector が input になっていることを確認。
⑧ Process with Lex を選択し、Send Audio Input to Dialogue Bot を削除。
⑨ Send Text Input to Dialogue Bot を追加。
⑩ 以下のように矢印を繋ぐ。
最後にシーンを実行します。
「Book a hotel」や「Book a car」と入力すると返答があります。
入力してどのような返答があるのか確認してみましょう。
今回のチュートリアルは以上です。
お疲れ様でした。
