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
Googleアシスタント アクションの Multi-Modal対応について
Search
1coin
October 09, 2018
Technology
2
230
Googleアシスタント アクションの Multi-Modal対応について
potatotips #55 (iOS/Android開発Tips共有会) - connpass -
https://potatotips.connpass.com/event/100763/
1coin
October 09, 2018
Tweet
Share
More Decks by 1coin
See All by 1coin
「学び」を捉えてマインドアップデート
1coin
0
220
ヤフー名古屋TechMeetupを 運営して学んだこと "縁 ~en~"
1coin
0
65
なぜエンジニアの私が マジ価値MeetupでLTをするのか
1coin
0
130
freee会計でのModule Federationによるマイクロフロントエンドの実践
1coin
2
20k
「この技術書がすごい」 好きなので語ります ~Team Geekついて~
1coin
1
350
リモートでも本音が言い合えるチームに なるためにやったこと
1coin
0
730
私の仕事観 + 今の仕事
1coin
0
46
複雑化したReact hookのデバッグとその対策
1coin
3
910
G空間APIと地図ライブラリの紹介
1coin
2
520
Other Decks in Technology
See All in Technology
E2Eテスト自動化プラットフォームにおけるAIの活用
shift_evolve
0
190
How to Think Like a Performance Engineer
csswizardry
4
590
「我々はどこに向かっているのか」を問い続けるための仕組みづくり / Establishing a System for Continuous Inquiry about where we are
daitasu
0
170
RAGのサービスをリリースして1年3ヶ月が経ちました
segavvy
4
960
ペパボのオブザーバビリティ研修2024 説明資料
kesompochy
0
1.1k
Classmethod流のPlatform Engineering / classmethod-platform-engineering-devio2024
tomoki10
0
480
簡単に始めるSnowflakeの機械学習
nayuts
1
190
DDDにおける認可の扱いとKotlinにおける実装パターン / authorization-for-ddd-and-kotlin-implement-pattern
urmot
4
390
プレイドにおけるDatadog APMの活用方法
plaidtech
PRO
2
120
運用改善、不都合な真実 / 20240722-ssmjp-kaizen
opelab
17
8.4k
さらに高品質・高速化を目指すAI時代のテスト設計支援と、めざす先 / AI Test Lab vol.1
shift_evolve
0
190
シフトレフトで挑む セキュリティの生産性向上
sekido
PRO
0
270
Featured
See All Featured
Writing Fast Ruby
sferik
623
60k
Intergalactic Javascript Robots from Outer Space
tanoku
266
26k
Product Roadmaps are Hard
iamctodd
PRO
48
10k
Done Done
chrislema
179
15k
The Power of CSS Pseudo Elements
geoffreycrofte
64
5.2k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.9k
What's in a price? How to price your products and services
michaelherold
239
11k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
29
2.5k
Building Your Own Lightsaber
phodgson
101
5.9k
Producing Creativity
orderedlist
PRO
340
39k
Agile that works and the tools we love
rasmusluckow
325
20k
Designing the Hi-DPI Web
ddemaree
276
34k
Transcript
Googleアシスタント アクションの Multi-Modal対応について potatotips#55 @1coin178
My Profile Ichien Shinji 【一円 真治】 Twitter: @1coin178 Yahoo Japan
Corporation Yahoo! MAP Android App, Backend 最近、 Googleアシスタントの開発入門の書籍を出版しました! よろしくお願いします! Kindle版も 発売中!
今日話すこと • GoogleアシスタントのMulti-Modal対応方法 ◦ Google Home -> スマホへ誘導させる方法 ◦ 例えば、Google
Homeから料理レシピの話を聞いていたら、 どんな料理か画像で確認したくなった 話さないこと • Googleアシスタントのアクションの細かい作り方
GoogleアシスタントのMulti-Modal対応とは • VoiceとVisualを使い分 けて、理解しやすい会話 に • コンテキストと情報にあっ たデバイスの選択 Design Actions
for the Google Assistant beyond smart speakers (Google I/O '18) - https://youtu.be/JDakZMlXpQo
どんなデバイスがあるのか Keynote (Google I/O '18) - https://youtu.be/ogfYd705cRs
どんなデバイスがあるのか https://youtu.be/ogfYd705cRs Multi-Modal対応が 今後重要に Keynote (Google I/O '18) - https://youtu.be/ogfYd705cRs
Multi-Modal 対応方法 • Surface capabilities for Actions ◦ アクション自体にサポートするデバイス面 (Surface)の制限をかける
• Runtime surface capabilities ◦ アクション実行時にSurfaceを判断 • Multi-surface conversations ◦ Google Home(Voice) -> Smartphone(Visual)への誘導
Multi-Modal 対応方法 • Surface capabilities for Actions ◦ アクション自体にサポートするデバイス面 (Surface)の制限をかける
• Runtime surface capabilities ◦ アクション実行時にSurfaceを判断 • Multi-surface conversations ◦ Google Home(Voice) -> Smartphone(Visual)への誘導
Multi-surface conversations • 伝えたい情報やコンテキストに応じて、表示するデバイス面を選択する • サンプル:「今日のわんこ」アクション Speaker Smartphone (Android/iOS) 通知
今日のわんこ を教えて 柴犬です。 画像で確認します か? はい! https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Shiba_Inu.jpg/250px-Shiba_Inu.jpg
Multi-surface conversations のサンプル アクション:「今日のわんこ」を Google Homeで使った場合 • スピーカーは画面がないので、わ んこの画像を確認するために、ス マホでの利用を促す
Multi-surface conversations のサンプル アクション:「今日のわんこ」を Google Homeで使った場合 • スピーカーは画面がないので、わ んこの画像を確認するために、ス マホでの利用を促す
• スマホ連携を許可した場合、 通知が送信される • ※ 画面ありのAndroid/iOSのスマ ホへの移動しかできない。 (2018/10/09 現在)
Multi-surface conversations のサンプル アクション:「今日のわんこ」を Google Homeで使った場合 • スピーカーは画面がないので、わ んこの画像を確認するために、ス マホでの利用を促す
• スマホ連携を許可した場合、 通知が送信される • ※ 画面ありのAndroid/iOSのスマ ホへの移動しかできない。 (2018/10/09 現在) https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Shiba_Inu.jpg/250px-Shiba_Inu.jpg
Multi-surface conversationsの 実装方法 【1/4】 app.intent('Today Dog - yes', conv =>
{ const dogName = conv.data.dogName if (conv.screen) { // 画面あるなら、画像を表示する } else { const screenAvailable = conv.available.surfaces.capabilities.has('actions.capability.SCREEN_OUTPUT'); if (screenAvailable) { // 画面が利用可能なデバイス (スマホ)に引き継ぐ const context = '今日のわんこの画像を確認しよう '; const notification = '今日のわんこ「' + dogName + '」の画像を見よう'; const capabilities = ['actions.capability.SCREEN_OUTPUT']; conv.ask(new NewSurface({ context, notification, capabilities })); } else { // 画像を表示できないので、終了する } } }) Google Home -> Smartphoneに 会話を引き継ぐ
app.intent('Today Dog - yes', conv => { const dogName =
conv.data.dogName if (conv.screen) { // 画面あるなら、画像を表示する } else { const screenAvailable = conv.available.surfaces.capabilities.has('actions.capability.SCREEN_OUTPUT'); if (screenAvailable) { // 画面が利用可能なデバイス (スマホ)に引き継ぐ const context = '今日のわんこの画像を確認しよう '; const notification = '今日のわんこ「' + dogName + '」の画像を見よう'; const capabilities = ['actions.capability.SCREEN_OUTPUT']; conv.ask(new NewSurface({ context, notification, capabilities })); } else { // 画像を表示できないので、終了する } } }) Multi-surface conversationsの 実装方法 【2/4】 画面付きデバイスが利用可能であるか? ・Googleアシスタントと連携済みであるか Google Home -> Smartphoneに 会話を引き継ぐ
app.intent('Today Dog - yes', conv => { const dogName =
conv.data.dogName if (conv.screen) { // 画面あるなら、画像を表示する } else { const screenAvailable = conv.available.surfaces.capabilities.has('actions.capability.SCREEN_OUTPUT'); if (screenAvailable) { // 画面が利用可能なデバイス (スマホ)に引き継ぐ const context = '今日のわんこの画像を確認しよう '; const notification = '今日のわんこ「' + dogName + '」の画像を見よう'; const capabilities = ['actions.capability.SCREEN_OUTPUT']; conv.ask(new NewSurface({ context, notification, capabilities })); } else { // 画像を表示できないので、終了する } } }) Multi-surface conversationsの 実装方法 【3/4】 Actions on Google Node.js Client Libraryの NewSurfaceクラスを利用 会話、通知文言を設定し、 画面付きデバイスへ連携
app.intent('New Surface', (conv, input, newSurface) => { if (newSurface.status ===
'OK') { const dogName = conv.data.dogName const dogImageUrl = conv.data.dogImageUrl conv.ask(dogName + 'の画像はこちらです。 ') // わんこの画像を表示 } else { // 会話の終了 } }) • Dialogflowでイベント 「actions_intent_NEW_SURFACE 」を受け取るIntentを作成 • アクションのBE側の処理で、 Intentをハンドリング Multi-surface conversationsの 実装方法 【4/4】 通知タップ時のハンドリング https://upload.wikimedia.org/wikipedia/commons/thumb/2/20/Shiba_Inu.jpg/250px-Shiba_Inu.jpg
今後のMulti-Modal Conversation • App ActionsやSlicesとの連携に期待 Speaker Smartphone (Android/iOS) Android App
通知 App Actions Slices
サンプルコード • 1coin178/actions-on-google-multi-modal-sample ◦ https://github.com/1coin178/actions-on-google-multi-modal-sample
• Scale your design - Conversation design process - Conversation
design ◦ https://designguidelines.withgoogle.com/conversation/conversation-design-process/scale-yo ur-design.html • Surface Capabilities | Actions on Google | Google Developers ◦ https://developers.google.com/actions/assistant/surface-capabilities 参考資料
Thanks.
Appendix
Multi-surface conversations のサンプル アクション:「今日のわんこ」を スマホで使った場合 • 画面があるので、そのままスマホ で、わんこの画像を表示 https://upload.wikimedia.org/wikipedia/commons/b/bf/Pembroke_Welsh_Corgi_600.jpg?uselang=ja
Surface capabilities for Actions 対応するcapabilityを アクション実行前に設定できる • 音声 (audio) •
画面 (screen) • メディア再生 (media play back) • ブラウザ(web browser) • Ex: 画面ありデバイスだけで利用可能にす る
const hasScreen = conv.surface.capabilities.has('actions.capability.SCREEN_OUTPUT'); const hasAudio = conv.surface.capabilities.has('actions.capability.AUDIO_OUTPUT'); const hasMediaPlayback
= conv.surface.capabilities.has('actions.capability.MEDIA_RESPONSE_AUDIO'); const hasWebBrowser = conv.surface.capabilities.has('actions.capability.WEB_BROWSER'); Runtime surface capabilities Actions-on-Google Node.js クライアントライブラリで判断可能 • conv.surface.capabilities.has 4つのcapability定義 • actions.capability.SCREEN_OUTPUT • actions.capability.AUDIO_OUTPUT • actions.capability.MEDIA_RESPONS E_AUDIO • actions.capability.WEB_BROWSER # 利用例 if (hasScreen) { conv.ask("画面あるよー"); } else { conv.close("ごめん、画面ないねん"); }; 参考: https://developers.google.com/actions/assistant/surface-capabilities#runtime-surface-capabilities