Watson Assistant Actions Skill によるノーコードチャットボット開発入門

無料で使えるIBM Cloud ライト・アカウントを用いて、チャットボットとして定番のWatson Assistantから、Actions Skillを用いてWebサイトに埋め込み設置可能なチャットボットをノーコードで作る手順のハンズオン資料です。

無料で使えるIBM Cloud ライト・アカウント
https://www.ibm.com/jp-ja/cloud/free
Watson Assistant
https://www.ibm.com/jp-ja/cloud/watson-assistant
IBM Champion Program
https://developer.ibm.com/champions/

※本資料は、2021年6月現在のものです。予めご了承ください。

Transcript

1. Watson Assistant Actions Skill ワクチン接種会場案内を題材に、Actions Skill によるノーコードチャットボット開発入門 2021/6/25 2021 IBM Champion , Kohei Nishikawa 1
2. この資料で作成するもの Webサイトに埋め込む用のシンプルなチャットボットを作ります。 IBM Watson Assistant を用いて、年齢別の接種会場案内や副反応について回答するチャットボットを作ります。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 2
3. 事前準備 クレジットカード不要で無料利用ができる「IBM Cloud ライト・アカウント」を取得してください。16歳以上が登録可能です。 https://www.ibm.com/jp-ja/cloud/free 上記URLにアクセスし、「無料アカウントを 作成する」をクリックします。 画面指示にしたがって、お名前やメールアドレスを登録します。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 3
4. IBM Cloud ログイン直後の画面 IBM Cloud に登録し、ログインすることで、下図のように「ダッシュボード」が表示されます。「ダッシュボード」ともう１つ有効化 済みの各機能を確認できる「リソース・リスト」はよく使います。切替方法を覚えておくと良いです。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 4
5. Watson Assistant を探す IBM Cloud にログインし、画面右上の「カタログ」をクリックします。画面左側で、「サービス」をクリックすると、カテゴリーが 表示されます。「AI/Machine Learning」にチェックを入れます。表示される「Watson Assistant」をクリックします。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 5
6. Watson Assistant を有効化 下図のように表示されます。「ロケーションの選択」で「ダラス」が最新機能が適用される環境です。「作成」をクリックします。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 6
7. Watson Assistant ツールの起動 下図のように表示されます。「Watson Assistantの起動」をクリックします。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 7
8. Watson Assistant ツールの初回起動 下図のように表示されます。枠部分の「Skills」のアイコンをクリックします。 なお、この画面は「Dialog Skill」と言って、この資料で扱う「Actions Skill」よりも複雑な操作や細かい作りこみができます。 このアイコン 2021/6/25 2021 IBM Champion , Kohei Nishikawa 8
9. Skillの作成 「Create skill」をクリックします。 「Actions skill」を選び、「Next」をクリックします。 ここをクリック ここをクリック ここをクリック 2021/6/25 2021 IBM Champion , Kohei Nishikawa 9
10. Actions skillの作成 「Name」にActions skill名を入れ、「Language」で「Japanese」を選びます。「Create skill」をクリックします。 「Create a new action」をクリックします。 ここに入力 言語選択 ここをクリック ここをクリック 2021/6/25 2021 IBM Champion , Kohei Nishikawa 10
11. Actionの作成と1つ目のステップ Actions skillでは、チャットボットを利用する利用者(customerと 言います)が行うであろう質問と、それに対応する返答を設定します。 「New Action」の画面で、最初の質問を決めます。 「Save」をクリックします。そうすると、左図のように表 示されます。 「Assistant says」に、利用者に表示する返答を入 力します。 「Define customer response」をクリックし、利用 者の次の行動について設定します。 ここに入力 ここをクリック ここをクリック 2021/6/25 2021 IBM Champion , Kohei Nishikawa 11
12. 利用者側の回答定義(Edit response) 「Define customer response」をクリックした後、「Options」を クリックします。「Edit response」が表示されます。 ここをクリック 「Options」では、チャットボットで利用者に文章を 入力させずに、回答を選ぶだけで次の操作に進ま せることができます。「Options」における「Edit response」には、選ばせる回答を１つ１つ記載し ます。記載後、「Apply」をクリックします。 ごみ箱をクリックすると 消せます。 次の3つをOption1～Option3に記述し、「Apply」 をクリックします。 • 65歳以上 • 50～64歳 • 16～49歳 2021/6/25 2021 IBM Champion , Kohei Nishikawa 12
13. 1つ目のステップの完成 これで、1つ目のステップを定義することができました。 「Next step」をクリックして、2つ目以降のステップを作成しましょう。 2つ目 >> 65歳以上を選んだ場合の返答 3つ目 >> 50～64歳を選んだ場合の返答 4つ目 >> 16～49歳を選んだ場合の返答 ここをクリックして、2つ 目のステップ作成 2021/6/25 2021 IBM Champion , Kohei Nishikawa 13
14. 2つ目のステップ作成 ここをクリックして、with conditionsに変更 1つ目のステップを選択 is はイコールのこと 1つ目のステップで 定義した、「65歳 以上」を選択 「Conditions(条件)」を満たした 場合の利用者に表示するメッセージ を、「Assistant says」に記述 Conditionとは条件のこと ここをクリックして、3つ 目のステップ作成 ここでは、「Step2 is taken」で「with conditions」を選び、1つ目のステップにおける利 用者の返答について、指定したConditions(条 件)を満たす場合の対応(Assistant says)を設 定していきます。 Conditions 1つ目のステップで、「65歳以上」と利用者が 回答した場合 Assistant says 65歳以上に対する返答を記述。 「Next step」をクリックして、3つ目のステップへ。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 14
15. 3つ目のステップ作成 ここをクリックして、with conditionsに変更 1つ目のステップを選択 is はイコールのこと 1つ目のステップで 定義した、「50～ 64歳」を選択 「Conditions(条件)」を満たした 場合の利用者に表示するメッセージ を、「Assistant says」に記述 Conditionとは条件のこと ここをクリックして、4つ 目のステップ作成 ここでは、「Step3 is taken」で「with conditions」を選び、1つ目のステップにおける利 用者の返答について、指定したConditions(条 件)を満たす場合の対応(Assistant says)を設 定していきます。 Conditions 1つ目のステップで、「50～64歳」と利用者 が回答した場合 Assistant says 50～64歳に対する返答を記述。 「Next step」をクリックして、4つ目のステップへ。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 15
16. 4つ目のステップ作成 ここをクリックして、with conditionsに変更 1つ目のステップを選択 is はイコールのこと 1つ目のステップで 定義した、「16～ 49歳」を選択 「Conditions(条件)」を満たした 場合の利用者に表示するメッセージ を、「Assistant says」に記述 Conditionとは 条件のこと ここでは、「Step4 is taken」で「with conditions」を選び、1つ目のステップにおける利 用者の返答について、指定したConditions(条 件)を満たす場合の対応(Assistant says)を設 定していきます。 Conditions 1つ目のステップで、「16～49歳」と利用者 が回答した場合 Assistant says 16～49歳に対する返答を記述。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 16
17. 保存とプレビュー ここまで行った操作を保存しましょう。「画面右上」のフロッピーディスクのアイコンを クリックすると、保存することができます。 プレビューを行って、動作を確認します。「画面右下」の「Preview」をクリックします。 プレビューでは、「New Action」で指定した利用者からの質問を手動入力して 確認します。Webサイトに埋め込み用の動作確認は別に行いますので、ここでは、 1～4の各ステップが動作することを確認します。 「Restart conversation」をクリックすることで、最初の状態に戻り、各ステップを 試すことができます。 ここをクリック ここをクリック 2021/6/25 2021 IBM Champion , Kohei Nishikawa 17
18. Assistantの作成 画面右上の「ｘ」をクリックします。 画面左上の「Assistants」のアイコンをクリックします。 「Create assistant」をクリックします。 ここをクリック ここをクリック ここをクリック 2021/6/25 2021 IBM Champion , Kohei Nishikawa 18
19. Assistantの作成 「Create assistant」画面が表示されます。 最低限、「Name」に入力し、「Create assistant」をクリックします。 Assistantを使うことで、ノーコードで、チャット ボットを作成することができます。 ここをクリック ここに入力 2021/6/25 2021 IBM Champion , Kohei Nishikawa 19
20. Assistant にskillを追加 「Add an actions or dialog skill」をクリック します。 「Add Actions or Dialog skill」が表示され ます。作成済みのskillから、「TYPE: Actions - Japanese」となっている、N市サポートスキル をクリックします。 ここをクリック 作成済みのActions skill をクリック 2021/6/25 2021 IBM Champion , Kohei Nishikawa 20
21. Integrationsの実施 作成したAssistantで、画面右側に表示される「Integrations」を使用します。今回はWebサイトに埋め込んで 設置するチャットボットを想定していますので、「Integrate web chat」をクリックしましょう。 ここをクリック 2021/6/25 2021 IBM Champion , Kohei Nishikawa 21
22. Web chatの作成 「Integration name」、その ままで良ければ、画面右上の 「Create」をクリックして次に進 みます。 「Integration name」を変 更しても構いません。 Integration web chat に よるチャットボットの設置は、ク レームやご意見、トラブル対応 等を管理する「サービスデスク」 と呼ばれる分野の業務システ ムと連携することも可能です。 ここをクリック 2021/6/25 2021 IBM Champion , Kohei Nishikawa 22
23. Styleの変更 Webサイトに埋め込むチャット ボットの見た目を「Style」タブ で変更します。 枠内の各項目を変更すること で、右側に表示されるプレ ビューが変化します。 チャットボットに表示されるIBM の文字を削除するには、有料 の「Plus」プランに切り替えが必 要です。 ここの項目を変更すると、 プレビューが変化 左側の項目値に合わせて 表示される この英文を変更するには、 「Home screen」タブへ 2021/6/25 2021 IBM Champion , Kohei Nishikawa 23
24. Home screenの 変更 チャットボットを表示した際に、最初に表示する 画面を設定します。 「Greeting message」では、最初に表示さ れる挨拶文を指定できます。図のように、日本 語の文章を設定することができます。 また、Conversation starter 1～3は必須で す。「Conversation starter 1」は先ほど作 成したActionが良いでしょう。 Conversation starter2～3 を空にはできな いので、何か入れておきます。 もちろん、実際にチャットボットを公開する前に、 Conversation starter2～3向けのAction を作っておくことが必要です。 ここの項目を変更すると、 プレビューが変化 動作確認 も可能 チャットボットを初期状態に戻すには、 「Restart conversation」をクリック クリックすると、作成 したActionが起動 こちらに質問文を 入力してもAction が起動 2021/6/25 2021 IBM Champion , Kohei Nishikawa 24
25. Embedで埋め込み用コードの取得 「Embed」タブに切り替えることで、Webサイトにチャットボットを埋め込み、設置するためのコードが表示されます。 Webサイトの管理者に送付し、チャットボットを設置してもらってください。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 25
26. Web chatの保存と削除 「Web chat」について変更、つまりカスタマイズを 実施しましたので、「Save and exit」をクリックし、 保存します。 ここをクリック Assistant 画面に戻ります。画面内の枠部分を クリックすることで、追加した「Web chat」を削除し たり、Assistantに関連付けた「skill」を解除する ことができます。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 26
27. Actionの追加 Assistantの画面で、関連付けられている「skill」をクリックすることで、「New action」が表示され、Actionの追加が可能 です。「Web chat」の「Conversation starter2」と「Conversation starter3」に該当する「Action」を追加しましょう。 関連付けられた skill名をクリック ここをクリックして、 Actionを追加 2021/6/25 2021 IBM Champion , Kohei Nishikawa 27
28. チャットボットの設置例 「Embed」で表示されたJavaScriptを埋め込むことで、下図のように表示され、画面右下のアイコン(枠部分)をクリックする ことで、チャットボットが表示されます。 2021/6/25 2021 IBM Champion , Kohei Nishikawa 28
29. お問い合わせ先について 2021/6/25 2021 IBM Champion , Kohei Nishikawa 29 資料作成者 西川 浩平 Twitter @kolinz Facebook https://www.facebook.com/kohei.nishikawa その他 https://8card.net/p/knishikawa 2021 IBM Champion for Developer / 開志専門職大学 未来創造研究センター