Bluemixハンズオン Watsonを使ってAIアプリを作ってみよう！

Watsonに最適な宿泊先を教えてもらおう！

話題の "IBM Watson" を使ってAIアプリを作ります。
Bluemix の”Watson Conversation”と”楽天トラベル空室検索 API”をつないで、ブラウザベースのBOTアプリを開発します。
WebアプリはBluemixのNode-REDというGUIツールを使って、まるでお絵かきをするようにプログラミングしていきますので、プログラム経験の無い方でも安心して下さい。

Transcript

1. 1 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Watsonを使ってAIアプリを作ってみよう！ 2017年11月10日（金） 株式会社DIGC/アイク・ラボ 佐藤 一成 Bluemix ハンズオン 北海道Watsonユーザー会 BMXUG
2. 2 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 1. WatsonのAPI、Conversationの使い方がわかる 2. Watsonと外部APIを組み合わせてWebアプリがつくれる 今日のゴール
3. 3 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 1. WatsonのAPI、Conversationの使い方がわかる – （ハンズオン1）シンプルなチャットボットをつくる 2. Watsonと外部APIを組み合わせてWebアプリがつくれる – （ハンズオン2）「楽天ウェブサービス」へ登録する – （ハンズオン3）ホテル検索ができるチャットボットをつくる 今日のゴール
4. 4 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  Watsonと外部APIを組み合わせてWebアプリがつくれる 今日つくるもの 7月12日に東京駅周辺で 1泊したい！ 予算は1万円！ 「ホテルXX」ってところ が空いてるよ！ Watson君 （イメージ図）
5. 5 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 1. WatsonのAPI、Conversationの使い方がわかる – （ハンズオン1）シンプルなチャットボットをつくる 2. Watsonと外部APIを組み合わせてWebアプリがつくれる – （ハンズオン2）「楽天ウェブサービス」へ登録する – （ハンズオン3）ホテル検索ができるチャットボットをつくる 今日のゴール
6. 6 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. まずはWatsonについて
7. 7 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. http://www.ibm.com/smarterplanet/jp/ja/ibmwatson/  Watsonは、コンピューターでありながら、人と同じように情報から学び、 経験から学習するコグニティブ・テクノロジーです。  Watson = AI = Augmented Intelligence (拡張知能) Learning Understanding Reasoning 学習により専門知識 を身につける。 ヒトのコミュニケー ション(言語・音声・ 画像)を理解する。 事実から紐付けて 答えを見つけ出す。 （推論する） Watsonとは？
8. 8 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Watson API一覧 Personality Insights テキストから筆者の性格を推定する Language Translator(一部日本語未対応) 自然言語テキストについて他言語へ翻訳を行う Conversation アプリケーションに自然言語インターフェースを追加して エンドユーザとのやり取りを自動化 Natural Language Understanding(日本語未対応) 自然言語処理を通じてキーワード抽出、エンティティー抽出、 心情分析、感情分析、概念タグ付け、関係抽出、分類法種別、 作成者抽出などを行う Text to Speech テキスト文章を音声に変換する Speech to Text 音声をテキスト文章に変換する Visual Recognition 画像コンテンツに含まれる意味を検出する Natural Language Classifier テキスト文章の分類を行う(質問の意図推定など) Tone Analyzer(日本語未対応) テキストの感情、社交性、文体を解析する Retrieve and Rank (廃止) 自然言語の質問に対して回答の候補を返す 分析系 音声系 画像系 言語系 Document Conversion (廃止 ※Discoveryに統合) 文書を新しい形式に変換する Discovery（日本語対応 NEW!） 認知検索およびコンテンツ分析エンジンをアプリケーションに追加して、優れた意思決定を行うのに役立つ パターン、傾向、およびアクション可能な洞察を識別する （2017年11月現在）
9. 9 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  Conversationはチャットボットを実装するためのAPIです  ユーザの発言の意図を理解し、その意図に応じて応答メッセージを返します  会話に必要な情報をやりとりをしながら抜き出し、適切な応答を選択します Conversationとは チャットアプリ XXさん、おはよう ございます 10時－12時 お客様 MTG @箱崎 … 19時 新人歓迎会 @ 銀座 今日の予定を教えて Conversation を呼び出す 回答メッセージを受け取る 今日の予定を教えて 10時-12時 お客様MTG... 対話フローに沿って、意図と 目的語に対する応答メッセー ジを返す 意図：「知りたい」 目的語：「今日」「予定」
10. 10 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Conversation の仕組み 3つの要素を組み合わせて会話を構築する  Intents（インテント / 意図） 対話相手の要求・意図を認識する  Entities（エンティティ / 目的語） 要求の対象を明確にする  Dialogs（ダイアログ / 対話フロー） 対話の流れを設計する
11. 11 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. インテント  異なる表現や言葉のゆらぎを吸収し、意図を正しく理解させる  同じ行為を要求したとしても、様々な言い方があるため  例：食べたい、おなかがすいた、腹減った 同じ意図の文章を複数登録すると、 類似の表現を「食事」に関係あるこ とを理解するようになる
12. 12 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. エンティティ  インテントの「目的」となる対象物を特定させる  例：”何を”食べるのか。そば？パスタ？ラーメン？  同じ意味の単語でも、様々な言い方があるため、シノニム（類義語）も登録する  例：ラーメン、中華そば、支那そば ”何を”食べるか、を明確にするための 「food」のエンティティ
13. 13 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. エンティティの種類  My Entities：  ユーザーが自由に定義することができるエンティティー  System Entities：  Conversation APIが提供するエンティティー  Sys-time ：時間を認識 例：13時20分、20:43  Sys-date ：曜日や日付を認識 例：金曜日、今日、11月1日  Sys-currency ：通貨を認識 例：20 cents、$20  Sys-percentage ：割合を認識 例：15%、10パーセント  Sys-number ：数値を認識 例：百七十、3.1415
14. 14 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログ  ユーザーの要求（インテントとエンティティ）と、それに応じた回答を 組み合わせていく  各ノードはコンディションとレスポンスで構成される  コンディション：自分のノードに処理を遷移させるための条件 （インテントやエンティティを指定）  レスポンス ：ユーザーに返す応答文 then 近くのイタリアンを検索します then 何が食べたいですか お腹が空いた ラーメンがいい if : #食事 (インテント) then 何ラーメンがいいですか？ if : @パスタ (エンティティ) if : @ラーメン (エンティティ) ・・・
15. 15 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ハンズオン1 シンプルなチャットボットをつくる チャットボット こんにちは！ お元気ですか？ こんにちは うん、いい感じ！ 素晴らしい！ その調子で頑張ってください！ (イメージ図） やること ・Node-REDの環境構築 ・Conversation サービスの作成 ・Conversationでのワークスペース作成
16. 16 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Bluemixへログイン  ブラウザで「bluemix.net」と入力し、Bluemixへログインします ※アカウント未作成の方もこのURLから作成ページへ飛べます
17. 17 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  右上の「カタログ」をクリックし、「ボイラープレート」カテゴリにある 「Internet of Things Platfirn Starter」をクリックします Node-RED環境の準備
18. 18 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. アプリ名のところに 「noderedapp-名前」と入力 Node-RED環境の準備  アプリの名前を入力し、右下の「作成」ボタンをクリックします
19. 19 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Node-RED環境の準備  アプリが「実行中」になるまで待ちます  「実行中」になったら、右側の「アプリURLを開く」をクリックします こ の 裏 側 に あ り ま す
20. 20 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  Node-REDとは、デバイス、API、オンラインサービスなどの機能を 繋げてアプリケーションを作成していくオープンソースのプラットフォームです ノード (カプセル化された機能) Node-REDとは？
21. 21 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  Node-REDを最初に使う時には、認証情報の登録が必要です  Node-REDの編集者を制限し、他人からの改変を防ぐことができます  右下の「Next」ボタンをクリックし、ユーザー名とパスワードを入力します Node-REDのセットアップ 任意のユーザー名と パスワードを入力 （その下のチェックはつけない）
22. 22 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Node-REDのセットアップ  その後は何もせず、右下の「Next」、「Finish」をクリックします ※11/10の時点では若干表示画面が異なりますが、流れは同じなので、そのまま進めて下さい
23. 23 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Node-REDのセットアップ  少し待つと、認証情報が登録され、以下の画面が表示されます  右下の「Go to your Node-RED flow editor」をクリックし、先ほど登録し た認証情報を入力。入力を終えたら「ログイン」をクリックします
24. 24 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  このような画面が表示されます Node-REDのセットアップ  Node-REDの環境構築完了です！  ノードのドラッグ＆ドロップでアプリケーションを開発していきます
25. 25 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Bluemixの画面へ戻り、Watson APIを追加  Node-REDのアプリからWatsonを使うためには、Watson APIのサービスを 新たに作成し、Node-REDのアプリと接続する必要があります  Bluemixの画面に戻り、左側のメニューの「接続」をクリックしてから 右上にある「新規に接続」をクリックします
26. 26 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Watson APIの追加  「Watson」カテゴリーにある「Conversation」をクリックします
27. 27 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Watson APIの追加  「接続」で先ほど作成したアプリを指定し、右下の「作成」をクリックします
28. 28 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Watson APIの追加  アプリの再ステージを行い、「実行中」になるまで再度待ちます  「実行中」になったら、先ほど追加した「Conversation-XX」をクリックします
29. 29 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Conversationのワークスペースを開く  サービスの詳細画面が開きます  「Launch tool」をクリックし、Conversationツールを起動します
30. 30 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Conversationのワークスペースを開く  以下の画面が出てきた場合は、「Log in with IBM ID」をクリックしてください
31. 31 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ワークスペースの作成  新規にチャットボットを作成してみましょう  「Create」ボタンをクリックし、ワークスペースを作成します  ワークスペースは一連の会話のパッケージです ワークスペースの名前を入力 （例：サンプル・チャットボット） 名前を入力したら 「Create」をクリック
32. 32 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 作成するシナリオ チャットボット こんにちは！ お元気ですか？ こんにちは うん、いい感じ！ 素晴らしい！ その調子で頑張ってください！ (イメージ図）
33. 33 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. インテントの作成  「Create new」ボタンをクリックして、インテントを作成します  「Import」で既存のインテントをインポートすることも可能です
34. 34 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  「Intent name」に「#あいさつ」と入力し、インテントを作成してみましょう  あいさつの文書をいくつか入力してください ここに文章を入力して 例文を登録していく 典型的な文をいくつか入力すると 類似の言葉を「あいさつ」の話で あると理解するようになる 入力が終わったら 「Done」をクリック
35. 35 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. インテントの作成  画面右上のボタンをクリックすると、テストツールが開けます  インテントが正しく設定できたか、確認できます あいさつに関する文章 であることを理解して いる
36. 36 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. “Watson is training”と出てくるときは  インテントやエンティティを作成すると、自動的にWatsonのトレーニングが 開始されます  トレーニングが完了しないと変更が反映されません  トレーニングが完了してから、テストツールでの動作確認を行ってください
37. 37 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. エンティティの作成  エンティティタブをクリックし、中央にある「Create new」ボタンを クリックして、エンティティを作成します  「Import」で既存のエンティティをインポートすることも可能です
38. 38 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. エンティティの作成  「はい」と「いいえ」の返答を認識できるようにするために、 「yes」と「no」のエンティティを作成します エンティティ名 言葉の揺らぎや癖に対応できるように 同じ意味を指す単語（シノニム）を登録 「yes」とは別に 新規にエンティティを作成
39. 39 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログの作成  ダイアログタブをクリックし、中央にある「Create」ボタンをクリックして、 ダイアログを作成します
40. 40 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログの作成  ダイアログには、はじめから「ようこそ」と「その他」ノードが入っています どのインテント、 エンティティにも属さない 文章だった時に出す メッセージ （エラー処理） 会話が始まった時に 出すメッセージ
41. 41 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログの作成  「Add node」をクリックし、ノードを追加します  各ノードはcondition（条件）とresponse（対応）で構成されます <? input.text ?>は、ユーザーの 入力メッセージをオウム返しする 変数 このノードへ遷移するための条件： “ユーザの入力が「あいさつ」 に関する文章（インテント）だった場合” 複数の回答を順番に返したり、 ランダムに返したりできる ノード名
42. 42 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログの作成  返答が「はい」だった場合の応答メッセージを設定します  あいさつノードが選択されている状態で、「Add child node」をクリックし、 子ノードを追加してください 入力が終わったら 「×」をクリック
43. 43 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログの作成  返答が「いいえ」だった場合の応答メッセージを設定します  あいさつノードが選択されている状態で、「Add child node」をクリックし、 子ノードを追加します 入力が終わったら 「×」をクリック
44. 44 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログの作成  以下のようなフローの構成になっていればOKです  ノードの位置が異なっている場合は、メニューから「Move」をクリックし、適 切な場所に移動してください
45. 45 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログの作成  テストツールを起動して、作成したフローの動作確認をしてみましょう
46. 46 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 1. WatsonのAPI、Conversationの使い方がわかる – （ハンズオン1）シンプルなチャットボットをつくる 2. Watsonと外部APIを組み合わせてWebアプリがつくれる – （ハンズオン2）「楽天ウェブサービス」へ登録する – （ハンズオン3）ホテル検索ができるチャットボットをつくる 今日のゴール
47. 47 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 楽天トラベル  宿泊予約・航空券予約ができるオンライン総合旅行サイト https://travel.rakuten.co.jp/
48. 48 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 楽天トラベルAPI  今回はこの「楽天トラベル空室検索API」を使います！ https://webservice.rakuten.co.jp/document/#travelApi
49. 49 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ハンズオン2 「楽天ウェブサービス」へ登録する やること ・楽天ウェブサービスへ登録する ・「楽天トラベル空室検索API」の仕様を確認する
50. 50 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. APIの準備  楽天ウェブサービス（https://webservice.rakuten.co.jp/） にアクセスし、 「+アプリID発行」をクリックします  楽天会員でログインしてください
51. 51 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. APIの準備  アプリ新規作成フォームに必要事項を入力します アプリ名：任意の名前 （例：Watson-botアプリ） アプリURL：作成したアプリのURL （例：https://noderedapp-名前.mybluemix.net)
52. 52 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. APIの準備  アプリIDが発行されるので、コピーしておいてください  のちほど、APIコールの時に必要になります
53. 53 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. APIの使い方  ベースURLに、パラメータを付加してHTTP(S)リクエストを送信する  楽天トラベル空室検索APIの場合 • ベースURL： https://app.rakuten.co.jp/services/api/Travel/VacantHotelSearch/20170426 • パラメータ（必須）：アプリID、地区情報 • パラメータ（任意）：チェックイン日、チェックアウト日、上限金額…
54. 54 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 1. WatsonのAPI、Conversationの使い方がわかる – （ハンズオン1）シンプルなチャットボットをつくる 2. Watsonと外部APIを組み合わせてWebアプリがつくれる – （ハンズオン2）「楽天ウェブサービス」へ登録する – （ハンズオン3）ホテル検索ができるチャットボットをつくる 今日のゴール
55. 55 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ハンズオン3 ホテル検索ができるチャットボットをつくる やること ・Conversationのワークスペース作成 ・Node-REDでのアプリ構築
56. 56 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. Webアプリ Node.js Conversation 入力 応答 楽天トラベル空室検索API  Conversationで「宿泊日」、「宿泊日数」、「地域」、「予算」を聞き、 それをパラメータとして楽天トラベルAPIを呼び出すアプリを作ります API呼び出し アプリの構成 検索結果 1．Conversationで、ユーザに条件を確認する （宿泊日、宿泊日数、地域、予算） 2．確認した条件を アプリ内で保持する 3．条件を元に 楽天トラベルAPIを呼び出す
57. 57 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ワークスペースのインポート  Conversationのワークスペース画面に移動して、ホテル検索用の ワークスペースをインポートします。  ファイルは「conversation_complete.json」を指定してください
58. 58 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ワークスペースIDの確認  作成したワークスペースをAPIから利用するために「Workspace ID」を 確認します  Conversationツールのワークスペース一覧へ戻り、 Workspace IDをコピーしておきます Workspace IDをコピーして控えておく どちらかをクリックし、 ワークスペース一覧画面に戻る どちらかをクリックし、 ワークスペース一覧画面に戻る
59. 59 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 2. 「bot-flow.txt」 ファイルを全コピーし、貼り付け 1.右メニューから [読み込み]→[クリップボード]を選択 3.読み込みボタンをクリック Node-REDフローのインポート  Node-REDの編集画面に戻ります  Webアプリ用のNode-REDフローをインポートします  ダウンロードした「bot-flow.txt」をコピーし、貼り付けてください
60. 60 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 1.ダブルクリックして開き、 workspace_idを設定する 3.ノードの左横のボタンをクリック 4.デバッグタブに回答が返ってくるのを確認する Node-REDでConversationを動かす  ConversationがNode-REDでどのように動くか確認してみましょう 2. デプロイボタンを押す。
61. 61 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 前ページと同様に workspace_idを設定する 楽天アプリIDを設定する ※次ページ参照  その下にあるフローの、Conversationノードのworkspace_id と 楽天API アプリIDを設定します 資格情報の設定
62. 62 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. 楽天アプリID設定 2. 「XXX…」の部分をメモしておいた applicationIdで上書きする。 3. デプロイボタンを押す。  楽天トラベルAPIを利用するためには「楽天アプリID」の設定が必要です  メモしておいたIDを、URLの末尾に上書きして設定します  (XXXXXXの部分を上書きしてください) 1. ノードをダブルクリック
63. 63 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  これでアプリは完成です。お疲れさまでした！  Node-REDのURLを元に、httpノードで設定したパスを指定してアプリに アクセスします  http://noderedapp-名前.mybluemix.net/bot 完成！
64. 64 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. まだ余力のある方へ  ダウンロードした「conversation.json」をインポートすると、一部虫食い状態の ワークスペースがインポートされます  次ページ以降に従って、ホテル検索のワークスペースを完成させてみてください ここで「conversation.json」を指定
65. 65 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. インテントの作成  「ホテル検索」というインテントを作成します  ”ホテルを探したい”という意味の文章をいろいろと登録してください  作成したら、正しく登録できたかテストツールで動作確認してみましょう ホテル検索に関する 文章だと認識されている
66. 66 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログにインテントを設定する #ホテル検索 と入力  ダイアログ編集画面に移動します  ホテル検索に関するする文章が入力されると会話が続くようにするために、 ダイアログの「ホテル検索」ノードの条件に「#ホテル検索」と入力します ホテル検索に関する 文章だと、 会話が続いていく
67. 67 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. システムエンティティの確認  エンティティ編集画面に移動します  会話中に日付を認識する「@sys-date」と、数字を認識する 「@sys-number」が有効になっているので、「今日」や「7月12日」のような 表現でもWatsonが認識してくれます 「今日」が 2017−07-12だと 認識している @sys-dateがオフだと 「今日」が日付だと 認識されない
68. 68 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd. ダイアログの追加  「地域確認」ノードの子ノードとして、「値段確認」ノードを追加します ノード名：値段確認 条件：@sys-number レスポンス：予算は1泊あたり<? @sys-number ?>円ですね。 ではこれより、宿泊可能なホテルを検索します。
69. 69 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.  これでConversationの設定は完了です  作成したワークスペースのWorkspace IDをNode-REDのconversationノードで 指定すると、Webアプリから利用できるようになります
70. 70 資料： https://goo.gl/zizSgU © 2017 DIGC Co., Ltd.