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
270
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
250
ヤフー名古屋TechMeetupを 運営して学んだこと "縁 ~en~"
1coin
0
72
なぜエンジニアの私が マジ価値MeetupでLTをするのか
1coin
0
150
freee会計でのModule Federationによるマイクロフロントエンドの実践
1coin
2
22k
「この技術書がすごい」 好きなので語ります ~Team Geekついて~
1coin
1
370
リモートでも本音が言い合えるチームに なるためにやったこと
1coin
0
780
私の仕事観 + 今の仕事
1coin
0
53
複雑化したReact hookのデバッグとその対策
1coin
4
1k
G空間APIと地図ライブラリの紹介
1coin
2
560
Other Decks in Technology
See All in Technology
OTelCol_TailSampling_and_SpanMetrics
gumamon
1
210
アジャイルチームがらしさを発揮するための目標づくり / Making the goal and enabling the team
kakehashi
3
150
The Role of Developer Relations in AI Product Success.
giftojabu1
0
140
【Startup CTO of the Year 2024 / Audience Award】アセンド取締役CTO 丹羽健
niwatakeru
0
1.3k
Amazon CloudWatch Network Monitor のススメ
yuki_ink
1
210
インフラとバックエンドとフロントエンドをくまなく調べて遅いアプリを早くした件
tubone24
1
430
心が動くエンジニアリング ── 私が夢中になる理由
16bitidol
0
100
SREが投資するAIOps ~ペアーズにおけるLLM for Developerへの取り組み~
takumiogawa
1
440
100 名超が参加した日経グループ横断の競技型 AWS 学習イベント「Nikkei Group AWS GameDay」の紹介/mediajaws202411
nikkei_engineer_recruiting
1
170
OCI 運用監視サービス 概要
oracle4engineer
PRO
0
4.8k
ドメインの本質を掴む / Get the essence of the domain
sinsoku
2
160
強いチームと開発生産性
onk
PRO
35
11k
Featured
See All Featured
Rails Girls Zürich Keynote
gr2m
94
13k
Designing for Performance
lara
604
68k
The Cost Of JavaScript in 2023
addyosmani
45
6.8k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
28
8.2k
[RailsConf 2023] Rails as a piece of cake
palkan
52
4.9k
The Pragmatic Product Professional
lauravandoore
31
6.3k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
229
52k
How to Ace a Technical Interview
jacobian
276
23k
Docker and Python
trallard
40
3.1k
Art, The Web, and Tiny UX
lynnandtonic
297
20k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
131
33k
Building Better People: How to give real-time feedback that sticks.
wjessup
364
19k
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