Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
DialogflowとCloud Functions で作る Google アシスタント アクション
Search
flatfisher
September 01, 2018
Programming
5
1.5k
DialogflowとCloud Functions で作る Google アシスタント アクション
こちらのスライドは GDG DevFest Tokyo 2018の「DialogflowとCloud Functions で作る Google アシスタント アクション」のスライドです
flatfisher
September 01, 2018
Tweet
Share
More Decks by flatfisher
See All by flatfisher
TIPSTARを支えるGoとGoogle Cloud
flatfisher
1
510
Other Decks in Programming
See All in Programming
Amazon S3 TablesとAmazon S3 Metadataを触ってみた / 20250201-jawsug-tochigi-s3tables-s3metadata
kasacchiful
0
170
Bedrock Agentsレスポンス解析によるAgentのOps
licux
3
850
お前もAI鬼にならないか?👹Bolt & Cursor & Supabase & Vercelで人間をやめるぞ、ジョジョー!👺
taishiyade
6
4k
AWS Organizations で実現する、 マルチ AWS アカウントのルートユーザー管理からの脱却
atpons
0
150
color-scheme: light dark; を完全に理解する
uhyo
5
390
Java Webフレームワークの現状 / java web framework at burikaigi
kishida
9
2.2k
Djangoアプリケーション 運用のリアル 〜問題発生から可視化、最適化への道〜 #pyconshizu
kashewnuts
1
250
WebDriver BiDiとは何なのか
yotahada3
1
140
Domain-Driven Transformation
hschwentner
2
1.9k
GoとPHPのインターフェイスの違い
shimabox
2
190
密集、ドキュメントのコロケーション with AWS Lambda
satoshi256kbyte
0
190
SpringBoot3.4の構造化ログ #kanjava
irof
2
1k
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
Making the Leap to Tech Lead
cromwellryan
133
9.1k
Product Roadmaps are Hard
iamctodd
PRO
50
11k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
30
2.2k
Testing 201, or: Great Expectations
jmmastey
42
7.2k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
How to Ace a Technical Interview
jacobian
276
23k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
40
2k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
114
50k
Code Reviewing Like a Champion
maltzj
521
39k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Docker and Python
trallard
44
3.3k
Transcript
Proprietary + Confidential DialogflowとCloud Functions で作る Google アシスタント アクション flatfisher
Proprietary + Confidential Kyohei Tsuda @canoefishing Google Developer Groups Ishinomaki
Call me fish!
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 今日話すこと • Google アシスタントについて • DialogflowとCloud Functions をアクションの開発 • Tips
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 今日話すこと • Google アシスタントについて • DialogflowとCloud Functions をアクションの開発 • Tips
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 今日話すこと • Google アシスタントについて • DialogflowとCloud Functions をアクションの開発 • Tips
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 今日話さないこと • 最新動向 • Transactions API や細かいSDKの話 • テンプレートを使ったアクションの開発
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem アクション? アプリではなくアクションと表記
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 作成したアクションの紹介
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 土用の丑の日にはうなぎリクエストが殺到
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem コミュニティプログラムでマイルストーンの獲得
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem アクションを開発する3つの方法 • Actions SDKを利用する ◦ 自然言語処理などを含め全て自分で作成したい人向け • Dialogflowを利用する ◦ 自然言語処理はGoogleの技術に任せたい人向け ◦ 機能の中心部分に集中して開発することができる • テンプレートを利用する ◦ クイズアクションを作成したい人向け
Dialogflow
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem • 自然言語処理を提供しているサービス • Botサービスと簡単連携 ◦ Slack, LINE, Facebook Messenger など Dialogflow
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Dialogflowのすごいところ • コードを書かずに自然言語処理の実装ができる • 対応言語が豊富 • あらゆるチャットボットサービスに対応 • SDKが豊富 • アナリティクス機能(設定不要)
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem できること&できないこと(BMIを計算するBOTの例) • ユーザーの発言から特定の文字を取得する ◦ 身長や体重を取得したい • ユーザーが身長と体重を答えるまで聞き返す • 取得した身長と体重からBMIを計算する
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem できること&できないこと(BMIを計算するBOTの例) • ユーザーの発言から特定の文字を取得する ◦ 身長や体重を取得したい できる • ユーザーが身長と体重を答えるまで聞き返す できる • 取得した身長と体重からBMIを計算する できない
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Dialogflowは必要な値を取得するところまで、計算処理などはサーバーで! BMIを知りたい 身長は? 182cmです 体重は? 79kgです 身長と体重を送信 BMIは23です BMIは23です
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem できること&できないこと まとめ • 会話の分析や静的な処理ができる ◦ 発言からユーザーが何をしたいのかを分析 ▪ ユーザーは挨拶をしたいのか ▪ ユーザーは航空券を検索したいのか ▪ ユーザーは音楽を聞きたいのか ◦ ユーザーの発言にどんなパラメータが入っているか分析 ▪ メールアドレス、身長、体重、日時、通貨... ◦ BOTに必須パラメータがあれば発言するまで聞き返す ▪ BMIを計算するBOTの場合、身長と体重を言うまで聞き返す ◦ 答えが決まっている会話 ▪ 「こんにちは」と言われたら「こんにちは」と返す • 動的な処理ができない ◦ BMIの計算 ◦ 航空券の検索や予約
Dialogflowを使ったアクションの作り方
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem はじめる前に必要なもの • GCPアカウント ◦ クレジットカードを登録されていることが望ましい ◦ G Suiteアカウントではないものが望ましい
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 新規Agentを作成する
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Google Assistantと連携する
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem TESTをクリック
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem アクションが起動すれば成功です
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 3つの基本機能を理解する • Intent • Entity • Fulfillment
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Intent -会話の設計を行う- • 会話を開始する文(トリガー)を決める ◦ 「こんにちは!」 ◦ 「BMIを知りたい」 ◦ 「肉とじゃがいもで作れる料理は?」 • 会話を成立させるための条件を決める ◦ 身長と体重を必須にする • レスポンス ◦ 答えが既に決まっている場合 ▪ 「こんにちは」と返す ◦ 答えが決まっていない場合 ▪ BMIの計算やレシピ取得はサーバーにお願いする
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 1つの目的につき、1つのIntentを作成 • 挨拶をするIntent • BMIを計算するIntent • レシピを検索するIntent 挨拶 BMI レシピ
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 発言に応じて適切なIntentに案内してくれる 挨拶 BMI レシピ BMIを知りたい 身長と体重は?
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Intentを作成してみる
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem シミュレーション画面に戻ります
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem こんにちは以外にも反応させたい
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 設定していない言葉も「こんにちは」と理解できるようになる
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem レスポンスのバリエーションを増やす
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem ランダムに返答してくれます
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Google アシスタントのUI
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 作成した覚えのない謎のIntent
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Default Fallback Intent
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Default Welcome Intent
ピザを注文するアクションを作成
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem ピザを注文するIntentを作成
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 注文時刻を尋ねる設定をする
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 尋ね方を設定
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 聞き出した後のレスポンスを設定
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem シミュレーション画面でテスト
Entity
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem メニューEntityを作成
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Size Entityを作成
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem IntentにPizza EntityとSize Entityをセット
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem IntentにPizzaEntityとSize Entityをセット
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem シミュレーション画面でテスト
Fulfillment
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Fulfillment を設定
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Fulfillment を設定
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Fulfillment に送信されるJSONの例
ピザの注文を受けたらLINEに通知する サンプルを作ってみる
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem actions-on-google-nodejs ライブラリ
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 環境準備 • Cloud Functions でHello Worldを返すサンプルを用意 • npm install actions-on-google - - save や yarn add actions-on-google でライブラリのインストール
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Intentを受け取る
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem デプロイとエンドポイントURLの取得 • コードをデプロイ ◦ gcloud functions deploy $name --region=asia-northeast1 --trigger-http --project project • バックエンドURLの取得 ◦ httpsTrigger: url: https://asia-northeast1-...
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem シミュレーション画面でテスト
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 受け取った情報をLINEに送信
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem ピザの注文があるとLINEに通知が来る
開発 Tips
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 料金プランはあるの? • Dialogflow Standard Edition ◦ 無料 ◦ APIリクエスト数に制限がある ◦ APIリクエストが少ない小規模なプロジェクトや Dialogflowを試したい人向け ◦ コミュニティと電子メールによるサポート • Dialogflow Enterprise Edition ◦ 従量課金制 ◦ APIリクエスト数に制限が無い ◦ 大規模なプロジェクト向け ◦ コミュニティ、電子メール、Google Cloudサポートによるサポート
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 新機能をキャッチアップしたい • Youtube Google Developers チャンネル • Actions on Google 公式Docs • Dialogflow 公式 Docs • Dialogflow ブログ • Dialogflow リリースノート • GitHubのソースコード • Twitter公式アカウント
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem Google GroupsやSlackで質問できます https://groups.google.com/forum/#!forum/assistant-developer-community-japan
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem リリース申請に必要なもの • アクションの情報 ◦ 説明 ◦ カテゴリ ◦ ロケーション ◦ 言語 • アクションを呼び出すトリガーと名前 ◦ 早いものがちです! • アクションの画像 ◦ 大きいイメージと小さいイメージが必要 ◦ エンジニアにとっては1番苦労するかも ◦ 大きなこだわりがない場合は いらすとや の画像を使う • 開発者情報 • プライバシーポリシーを明記したページ ◦ Google サイトや Google Docsで作成したものを公開すればOK ◦ 各内容に詰まった場合は既にリリースされているページを参考にする
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem 申請に落ちてしまう例 • プライバシーポリシーが無効 ◦ URLと公文が正しいか確認する • 申請された文言でアクションが起動しない ◦ お手持ちのスマートフォンかスピーカーなどで再度確認する • ユーザーを混乱させてしまうような会話になる ◦ 会話設計を見直そう • 日本語の会話のはずなのに英語が混じった ◦ 英語が混じらないか確認する、特にINTENTのレスポンス • ユーザーが何をしていいか分からない ◦ 会話開始時に使い方を明記しよう • 会話の終了方法が分からない ◦ 会話を終了するトリガーインテントを用意する • アクションの名前が不適切 ◦ ユニークかつ呼びやすい名前に変更する https://qiita.com/flatfisher/items/f6afa2a9055e5ee3cf87
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem TypeScriptで開発したい方へ https://github.com/flatfisher/cloud-functions-typescript-template
今日学んだことをおさらい
Source: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis
non erat sem おさらい • Dialogflowの基本的な使い方 ◦ Intentの作成 ◦ Entityの作成 ◦ Fulfillmentの設定 • Google Cloud Functions を使ったバックエンド処理 ◦ 外部APIとの接続ができたので結構なんでも作れます • 開発 Tips
興味がある人は今夜作りましょう! https://media.giphy.com/media/RRerwvHrb0nxm/giphy.gi f
Proprietary + Confidential Thank you Kyohei Tsuda @canoefishing Google Developer
Groups Ishinomaki