VoiceLunchJP#27で発表したVoiceflowの2022年の新機能・変更点のご紹介です。
https://voicelunchjp.connpass.com/event/268568/
#voicelunchjp #vfjug
Updates 2022#voicelunchjp #vfjug #voiceflow
View Slide
自己紹介@VoiceflowHQ | #VFJUG
自己紹介@VoiceflowHQ | #VFJUGKuniaki Shimizu (@kun432)● 神戸在住のインフラエンジニア● Kubernetes/AWS/Terraformなど● 最近フリーランスになりました● Voiceflow歴4年弱ぐらい○ 調べてみたら2019年初から● #VoiceLunchJP / #AAJUG● #VFJUGやってます
https://www.facebook.com/groups/vfjug/Voiceflow日本語コミュニティ@VoiceflowHQ | #VFJUG
『Voiceflow & VUI 〜虎の巻〜』● 国内初・Voiceflow同人誌● 入門〜中級・上級、プロトタイピング・VUIデザイン〜IoT/クラウド連携、など幅広いトピックをカバー!● 豪華執筆陣とVoiceflow公式による寄稿も!紙版+電子版セット1,500円(+税抜)※別途送料@VoiceflowHQ | #VFJUG販売終了しました。ありがとうございました。
今日のお題@VoiceflowHQ | #VFJUG
Updates 2022@VoiceflowHQ | #VFJUG● Voiceflowの進化は速い!● 2022年にリリースされた主な新機能/変更点の一部をご紹介します。
@VoiceflowHQ | #VFJUGDisclaimer● 2022年12月初時点の情報です。今後変更される場合があります。● 個人の調査により作成しています。内容の不備等が含まれる場合がある点に予めご留意ください。
2022年の新機能と変更点@VoiceflowHQ | #VFJUG
@VoiceflowHQ | #VFJUG2022年の主な新機能/変更点1. ユーザーインタフェースの刷新2. ユーザーペルソナ3. Webチャットプロジェクト4. カスタムアシスタントのNLUが選択可能※https://www.voiceflow.com/category/product-release などを参考にしています。※大小含めるともっとあります。
@VoiceflowHQ | #VFJUG1. ユーザーインタフェースの刷新
@VoiceflowHQ | #VFJUG2019
@VoiceflowHQ | #VFJUG2020〜2021
@VoiceflowHQ | #VFJUGand 2022!
@VoiceflowHQ | #VFJUG1. ユーザーインタフェースの刷新GUIの課題● たくさんのブロック、たくさんの線…● プロジェクトが大きく/複雑になると管理できない● 似たような処理・同じ処理が複数箇所に
@VoiceflowHQ | #VFJUG効率良く管理したい!
@VoiceflowHQ | #VFJUG1. ユーザーインタフェースの刷新● デザイナーがさらにデザインしやすいように● 個人的におすすめ○ Actions○ トピック/コンポーネント/ライブラリ● Alexa向けの変更も重要
@VoiceflowHQ | #VFJUGActions● 分岐先でよくやること○ 分岐ごとにコンテキストが変わる○ 分岐ごとに変数をセットする などなど● 分岐が増えると線をたくさん引いたり。分岐ごとに同じ処理を繰り返したり。● Actionsを使うと↑をブロックの中で指定できてすっきり
@VoiceflowHQ | #VFJUGActions
@VoiceflowHQ | #VFJUGトピック/コンポーネント/ライブラリキーワード 意味 ユースケース:銀行アプリの場合トピックインテントごとにフローを分けてそれぞれを小さく管理する● メインフローから・残高照会フロー・振り込みフローコンポーネント何度も使う処理をパーツ化して、再利用が可能※同じものをそのまま繰り返し使う場合● API初期設定● APIリクエスト処理● 処理結果発話フローライブラリ何度も使う処理をテンプレート化して、再利用が可能※コピーして少し変えて使う場合● APIリクエストをテンプレート化● 残高照会や振込処理ごとにテンプレートから複製してパラメータだけ変更
@VoiceflowHQ | #VFJUG例:トピックホーム注文開店時間コンテキスト(インテント)ごとに別のフローとして管理できる
@VoiceflowHQ | #VFJUGAlexa向けの変更● Alexa特有のブロックや設定が廃止○ Purchase/Cancel(ISP)○ Reminder(リマインダー)○ UserInfo(ユーザ情報取得)○ Permissions(権限)○ Account Linking(アカウントリンク)○ スキルイベント○ などなどじゃあどうすれば・・・
@VoiceflowHQ | #VFJUGAlexa向けの変更Directive/Eventを使いましょう!
@VoiceflowHQ | #VFJUGAlexa向けの変更● 以前○ 各機能ごとにAPI/SDKクライアントが用意されていた○ 1機能としては実装しやすい(ブロックにしやすい)○ API以外の部分は自分で実装● 現在○ 「Skill Connections」に統一されつつある様子○ JSONオブジェクトを投げると、スキルの「外」でユーザとのやりとりや必要な処理をやってくれる○ 結果がJSONオブジェクトでスキルに返ってくる
@VoiceflowHQ | #VFJUGAlexa向けの変更● 以前○ 各機能ごとにAPI/SDKクライアントが用意されていた○ 1機能としては実装しやすい(ブロックにしやすい)○ API以外の部分は自分で実装● 現在○ 「Skill Connections」に統一されつつある様子○ JSONオブジェクトを投げると、スキルの「外」でユーザとのやりとりや必要な処理をやってくれる○ 結果がJSONオブジェクトでスキルに返ってくるDirectiveEvent
@VoiceflowHQ | #VFJUGAlexa向けの変更● Directive
@VoiceflowHQ | #VFJUGAlexa向けの変更● Event
@VoiceflowHQ | #VFJUGAlexa向けの変更難しそう・・・
@VoiceflowHQ | #VFJUGAlexa向けの変更● 各機能ごとのチュートリアルがドキュメントにあります。https://developer.voiceflow.com/docs
@VoiceflowHQ | #VFJUG2. ユーザーペルソナ
@VoiceflowHQ | #VFJUG● パーソナライズされた会話フロー○ 初めて使う/何度も使っている○ 東京に住んでいる/大阪に住んでいる○ 今日が誕生日/それ以外● 違った条件ごとにテストしたい特定の条件のユーザペルソナを設定してテストができる!2. ユーザーペルソナ
@VoiceflowHQ | #VFJUG1回目 2回目以降2. ユーザーペルソナ
@VoiceflowHQ | #VFJUG3. Webチャットプロジェクト
@VoiceflowHQ | #VFJUG3. Webチャットプロジェクト● VoiceflowだけでWebサイト埋め込みチャットボットをサクッと作れる!○ プロジェクトを「Webチャット」タイプで作る○ 会話フローを作る○ HTML/JavaScriptが出力されるので、Webサイトにペーストするだけ!めっちゃかんたん!
@VoiceflowHQ | #VFJUGTranscriptsでチャット履歴が見れる
@VoiceflowHQ | #VFJUG今後も期待!
@VoiceflowHQ | #VFJUG4. カスタムアシスタントのNLUが選択可能
@VoiceflowHQ | #VFJUG4. カスタムアシスタントのNLU選択Enterpriseプラン限定の機能です!🙇※まだちょっと詳細までは完全に把握できていませんのでご留意ください。
@VoiceflowHQ | #VFJUG4. カスタムアシスタントのNLU選択● カスタムアシスタントのNLUを選択できる● Dialogflow ES/CXはデプロイまでできるそれ以外は対話モデルのインポート/エクスポート○ Voiceflow(デフォルト)○ Dialogflow ES/CX○ IBM Watson○ Microsoft LUIS○ Rasa○ Salesforce Einstein○ Amazon Lex○ Nuance Mix
@VoiceflowHQ | #VFJUG4. カスタムアシスタントのNLU選択● 個人的にDIalogflow ES/CX連携はかなり期待○ ワンクリックでデプロイできる○ 他のNLUと比較しても日本語対応が充実■ ビルトインのエンティティが非常に豊富○ Dialogflow IntegrationsでSNS・電話・Webチャットなどとの連携を数クリックで設定可能な様子※Dialogflowの機能です○ ただし要GCPアカウントおよびGCP利用料金が発生
@VoiceflowHQ | #VFJUG4. カスタムアシスタントのNLU選択
@VoiceflowHQ | #VFJUGご紹介したい機能はほかにもたくさん
@VoiceflowHQ | #VFJUGぜひ試してみてください!
@VoiceflowHQ | #VFJUG2023年の新機能にも期待!
Thanks!#voicedg #voiceflow #vfjug
@VoiceflowHQ | #VFJUG● Dialog Management API○ カスタムアシスタント向け○ Voiceflowで作った会話フローにAPIアクセスして会話のやりとりができる● これを使って、Webサイト埋め込みチャットボットを作ることもできる● ただし、色々大変&コードを書く必要がある○ フロントエンドUI(JavaScript/CSSとか)○ バックエンドアプリ○ CORSとかSame-site Cookieとかいろいろ考慮が…補足:Dialog Management API
@VoiceflowHQ | #VFJUG● けど、やれることの幅はかなり広がる!○ SNSのボット(Slack/FB Messagener/MS Teams等)○ 電話(Twilio)○ スマホアプリ、Webアプリ○ なんでもVoiceflowにつなげることができる● 特性に合わせて2つのAPIが使える○ State API … お手軽に使える○ Stateless API … センシティブなデータの自前管理可興味があれば補足資料をごらんください補足:Dialog Management API
@VoiceflowHQ | #VFJUG補足資料Dialog Management API (2021)
@VoiceflowHQ | #VFJUGDialog Management API● カスタムアシスタント向け● Voiceflowで作った会話フローにAPIアクセスして会話のやりとりができる
@VoiceflowHQ | #VFJUGDialog Management APIユーザー作成アプリ(SNS等)WebチャットボットフロントエンドVoiceflow対話モデルバックエンド処理カスタムアシスタントプロジェクトAPI開発者開発者 / デザイナー作成反映入力/ASR+STT NLU・NLP/バックエンド処理応答/TTS独自アシスタント
@VoiceflowHQ | #VFJUGDialog Management API● フロントエンドを選ばない(APIアクセス部分を作れば)○ SNS: LINE/Slack/Messenger等○ 電話: Twilio○ スマホアプリ・Webアプリ○ 独自スマートスピーカー● 開発者とデザイナーの作業分担ができる● 1つの会話フローで複数のフロントエンド○ 会話フローの修正は1回で済む○ フロントエンドはそれぞれの流儀に合わせて、つなぎこむだけのシンプルな処理で済む
@VoiceflowHQ | #VFJUG● State API○ 必要なのはユーザIDのみ、会話の「状態」管理はVoiceflowに任せる○ ユーザIDだけなげてやり取りすれば応答が変わる○ シンプルにユーザIDつけてリクエスト送るだけ!● Stateless API○ 会話の「状態」管理を自前で行う○ 同じステート情報を投げた場合、基本的に同じ回答○ センシティブなデータを自前で管理できる!Dialog Management APIの2つのAPI
@VoiceflowHQ | #VFJUG構成例① SNS連携(Slack等)ユーザー SNSアプリSNSプラットフォームVoiceflow対話モデルバックエンド処理API入力API繋ぎこみPaaS応答NLU・NLP/バックエンド処理状態データ
電話+音声/テキスト変換@VoiceflowHQ | #VFJUG構成例② IVR連携(Twilio等)ユーザーIVRプラットフォームVoiceflow対話モデルバックエンド処理APINLU・NLP/バックエンド処理API繋ぎこみPaaSASR+STTTTS状態データ
@VoiceflowHQ | #VFJUG構成例③ Webチャットボット連携ユーザーWebサイトVoiceflow対話モデルバックエンド処理APIAPI繋ぎこみPaaS入力応答WebチャットボットAjaxクライアント状態データNLU・NLP/バックエンド処理