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
GWにスマートスピーカーアプリを作ってみた
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
ykagano
May 18, 2018
Programming
1.3k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
GWにスマートスピーカーアプリを作ってみた
WEBエンジニア勉強会#07 発表資料
ykagano
May 18, 2018
More Decks by ykagano
See All by ykagano
カートの信頼性を担保するWireMockを使ったe2eテスト
ykagano
0
150
2年前に削除したPHPクラスが、 ある日突然決済をエラーにした
ykagano
1
1.1k
決済システムの信頼性を支える技術と運用の実践
ykagano
0
1.3k
Copilot Agentを普段使いしてわかった、バックエンド開発で使えるTips
ykagano
1
2.4k
プレイングマネージャーになったときの話
ykagano
2
1.5k
WEBエンジニアが知っておきたい決済の仕組み
ykagano
2
3.9k
プロジェクトにおけるリーダブルコードの考え方
ykagano
2
2.2k
開発効率を上げるSwaggerの話
ykagano
0
1.5k
Other Decks in Programming
See All in Programming
人間の目はかわらない、だからJPEGは30年もつ
yuzneri
12
18k
AI Nativeにデータを扱うための組織・基盤のこれまでとこれから
kirimaru
0
100
ルールを書いて終わらせないハーネスエンジニアリング
yug1224
4
1.9k
使いながら育てる Claude Code — 開発フローの1コマンド化 × 繰り返し指摘の自動仕組み化
shiki_kakaku
0
1.7k
Terraform標準の組織で AWS CDKをどう使うか
mu7889yoon
1
500
VibeCodingからAgenticWorkflowへ
starfish719
0
380
PHP に部分適用が来るぞ!……ところで何それ?おいしいの? #phpcon / phpcon-2026
shogogg
0
620
the container ship “Apple Silicon”@WWDC26 Recap -Japan-\(region).swift
shingangan
0
120
Laravelで学ぶ Webアプリケーションチューニング入門/web_application_tuning_101
hanhan1978
4
1.7k
源内ハンズオン概要編
hideg
0
160
生成AI導入の「期待外れ」を乗り越える ー 開発フロー改革が目指す、真の組織変革
starfish719
0
4.2k
属人化した知識を、 AIが辿れる地図にする
pkshadeck
PRO
1
160
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
The agentic SEO stack - context over prompts
schlessera
0
860
The untapped power of vector embeddings
frankvandijk
2
1.8k
How to make the Groovebox
asonas
2
2.3k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
2
630
jQuery: Nuts, Bolts and Bling
dougneiner
66
8.5k
Paper Plane (Part 1)
katiecoart
PRO
1
10k
Optimising Largest Contentful Paint
csswizardry
37
3.9k
Git: the NoSQL Database
bkeepers
PRO
432
67k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
2.1k
We Analyzed 250 Million AI Search Results: Here's What I Found
joshbly
1
1.7k
Transcript
GWに スマートスピーカーアプリを 作ってみた @ykagano
1 ▪⾦融系のエンジニアです • SIerの会社 : 電⼦マネーシステムの受託開発 • 電⼦マネーの会社 : Web/スマホアプリ開発・企画
• Web系の会社 : 決済関連のWeb開発 イマココ 加賀野 祐@ykagano
2 そんなことより…… 2018年1⽉に娘が⽣まれました! 現在、4ヶ⽉です!
娘が泣き出すと抱っこします 3 そんなとき 抱っこしたまま操作できる スマートスピーカーが便利!
我が家のスマートスピーカー 4 ▪Google Home Mini ▪Amazon Echo ・⾳の良いスピーカーが欲しかった ・Amazon Musicが聴ける
・⾊んなスキル(アプリ)があると聞いて購⼊ ・まずお試しで買ってみた ・毎朝今⽇の天気を聞く ・ChromeCastと連携してYoutubeを操作
スマートスピーカーは 泣いている娘をあやしてくれない 5 ・LINEクローバーは童話を読んでくれる(クローバー持ってない) ・Google Homeは⾳楽の追加ができる(原曲が必要) ・alexaは購⼊したKindle本の読み上げができる(いい感じの童話ほしい) なので童話の読み上げアプリを GWに作ろうと思いました ・Amazon
Echoだけです
「⼦供向け童話」スキル 6 パブリックドメインの童話をアレクサが読み聞かせします ▪使い⽅ 「アレクサ、⼦供向け童話を開いて」でスキルを起動するとランダムで童話の読み 聞かせが始まります。 スキル起動後は以下の操作ができます。 ・「お話を聞かせて」でランダムに童話が聞けます。 ・「次へ」で次の童話が聞けます。 ・「前へ」で前の童話が聞けます。
・「最初から」で今の童話を最初から聞けます。 ・「おしまい」で童話が終了します。 ・「ヘルプ」で使い⽅を聞けます。
(⼀般的な)alexa スキルの作り⽅ 7 1. アカウントの作成(Amazon Developer、AWS) 2. スキルの設定と対話モデルの作成 3. AWS
Lambda関数の作成 4. スキルとLambdaの接続 5. alexaシミュレータによるテスト 最初はこのブログを読もう! ▪Alexaスキル開発トレーニング 6回シリーズのビデオとブログで基礎から学んでみよう https://developer.amazon.com/ja/alexa-skills-kit/training/building-a-skill
「⼦供向け童話」のアーキテクチャ 8 ・alexaで対話モデルとスキルを設定 ・AWS Lambdaで実処理を定義 ・Amazon DynamoDBでデータ管理
amazon alexa 9 ▪ビルド ・対話モデルとスキルを設定 ・呼び出し名「⼦供向け童話」 ・エンドポイントでlambdaと紐付け ・インテントでハンドラと紐付け ▪テスト ・alexaシミュレータで対話型テスト
▪公開 ・作成したalexaスキルを審査に提出
⾳声ユーザーインターフェース 10 ▪ Alexaスキル開発トレーニングシリーズ 第3回 https://developer.amazon.com/ja/blogs/alexa/post/cddf2434-42ee-422f-886d-5be9c36dba14/jp-training-chapter3 起動 童話を再⽣ 次へ 前へ
最初から おしまい ヘルプ ランダム再⽣ ⼊⼒待ち 終了
AWS Lambda 11 FaaS(Fanction as a Service) ・実際に処理を⾏う関数を作る「FairyTaleSkill」 ・Alexa Skills
Kitから「FairyTaleSkill」関数を呼び出し ソースはこちら https://github.com/ykagano/fairy-tale
SSML 12 SSML(Speech Synthesis Markup Language) 間を置く、⼝調を変えるなど、⾳声伝達をより効果的に促すことができます。 ▪ Alexaスキル開発トレーニングシリーズ 番外編
https://developer.amazon.com/ja/blogs/alexa/post/ff4f8bf0-4c86-4c5f-9c50-467816b0a017/jptraining6plus 「⼦供向け童話」ではスピーチの読み上げ速度を80%に設定してます。 以下のように<speak>タグで囲んで使⽤する。 <speak> 今⽇の天気は晴れ、最⾼気温は25度です <break time="1s"/> <say-as interpret-as="interjection">イェイ</say-as> <break time="0.5s"/> 良い天気ですね </speak>
Amazon DynamoDB 13 「⼦供向け童話」での役割(3テーブル) ・セッション保存(RW) ・童話の最⼤件数の定義(R) ・童話データの取得(R)
AWS課⾦ 14 AWSはスモールサービスなら無料で運⽤できそう。 ▪Lambda ・100万リクエストまで無料 ・128MBのメモリ割り当て設定でコードを実⾏する場合、320万秒分が無料 ▪DynamoDB ・スループット最⼩テーブルのみであれば、25テーブルまで無料枠内 ・ストレージが25GBまで無料 ※いずれもAWSでよくある無料期間の12カ⽉制限はなし
alexaシミュレータ 15 ▪Amazon開発者ポータル https://developer.amazon.com/ja/alexa シミュレータで対話型のテストができます。 実際にやってみます。
alexaスキルの審査 16 alexaスキルの公開にはAmazonによる審査があります。 「⼦供向け童話」を審査に出そうとしたところで、 下記チェックボックスがありました。 お⼦様向けのalexaスキルは審査に通りません(気付くのが遅い)。 スキル名を「世界の昔話」に変えて申請してみたもののリジェクト。
最後に 17 簡単なalexaスキルはGWに 家族サービスしながら2⽇で作れる!
18