Upgrade to Pro — share decks privately, control downloads, hide ads and more …

GWにスマートスピーカーアプリを作ってみた

 GWにスマートスピーカーアプリを作ってみた

WEBエンジニア勉強会#07 発表資料

ykagano

May 18, 2018
Tweet

More Decks by ykagano

Other Decks in Programming

Transcript

  1. GWに
    スマートスピーカーアプリを
    作ってみた
    @ykagano

    View full-size slide

  2. 1
    ■⾦融系のエンジニアです
    • SIerの会社 : 電⼦マネーシステムの受託開発
    • 電⼦マネーの会社 : Web/スマホアプリ開発・企画
    • Web系の会社 : 決済関連のWeb開発 イマココ
    加賀野 祐@ykagano

    View full-size slide

  3. 2
    そんなことより……
    2018年1⽉に娘が⽣まれました!
    現在、4ヶ⽉です!

    View full-size slide

  4. 娘が泣き出すと抱っこします
    3
    そんなとき
    抱っこしたまま操作できる
    スマートスピーカーが便利!

    View full-size slide

  5. 我が家のスマートスピーカー
    4
    ■Google Home Mini
    ■Amazon Echo
    ・⾳の良いスピーカーが欲しかった
    ・Amazon Musicが聴ける
    ・⾊んなスキル(アプリ)があると聞いて購⼊
    ・まずお試しで買ってみた
    ・毎朝今⽇の天気を聞く
    ・ChromeCastと連携してYoutubeを操作

    View full-size slide

  6. スマートスピーカーは
    泣いている娘をあやしてくれない
    5
    ・LINEクローバーは童話を読んでくれる(クローバー持ってない)
    ・Google Homeは⾳楽の追加ができる(原曲が必要)
    ・alexaは購⼊したKindle本の読み上げができる(いい感じの童話ほしい)
    なので童話の読み上げアプリを
    GWに作ろうと思いました
    ・Amazon Echoだけです

    View full-size slide

  7. 「⼦供向け童話」スキル
    6
    パブリックドメインの童話をアレクサが読み聞かせします
    ■使い⽅
    「アレクサ、⼦供向け童話を開いて」でスキルを起動するとランダムで童話の読み
    聞かせが始まります。
    スキル起動後は以下の操作ができます。
    ・「お話を聞かせて」でランダムに童話が聞けます。
    ・「次へ」で次の童話が聞けます。
    ・「前へ」で前の童話が聞けます。
    ・「最初から」で今の童話を最初から聞けます。
    ・「おしまい」で童話が終了します。
    ・「ヘルプ」で使い⽅を聞けます。

    View full-size slide

  8. (⼀般的な)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

    View full-size slide

  9. 「⼦供向け童話」のアーキテクチャ
    8
    ・alexaで対話モデルとスキルを設定
    ・AWS Lambdaで実処理を定義
    ・Amazon DynamoDBでデータ管理

    View full-size slide

  10. amazon alexa
    9
    ■ビルド
    ・対話モデルとスキルを設定
    ・呼び出し名「⼦供向け童話」
    ・エンドポイントでlambdaと紐付け
    ・インテントでハンドラと紐付け
    ■テスト
    ・alexaシミュレータで対話型テスト
    ■公開
    ・作成したalexaスキルを審査に提出

    View full-size slide

  11. ⾳声ユーザーインターフェース
    10
    ■ Alexaスキル開発トレーニングシリーズ 第3回
    https://developer.amazon.com/ja/blogs/alexa/post/cddf2434-42ee-422f-886d-5be9c36dba14/jp-training-chapter3
    起動
    童話を再⽣
    次へ 前へ 最初から おしまい ヘルプ
    ランダム再⽣
    ⼊⼒待ち
    終了

    View full-size slide

  12. AWS Lambda
    11
    FaaS(Fanction as a Service)
    ・実際に処理を⾏う関数を作る「FairyTaleSkill」
    ・Alexa Skills Kitから「FairyTaleSkill」関数を呼び出し
    ソースはこちら https://github.com/ykagano/fairy-tale

    View full-size slide

  13. SSML
    12
    SSML(Speech Synthesis Markup Language)
    間を置く、⼝調を変えるなど、⾳声伝達をより効果的に促すことができます。
    ■ Alexaスキル開発トレーニングシリーズ 番外編
    https://developer.amazon.com/ja/blogs/alexa/post/ff4f8bf0-4c86-4c5f-9c50-467816b0a017/jptraining6plus
    「⼦供向け童話」ではスピーチの読み上げ速度を80%に設定してます。
    以下のようにタグで囲んで使⽤する。

    今⽇の天気は晴れ、最⾼気温は25度です

    イェイ

    良い天気ですね

    View full-size slide

  14. Amazon DynamoDB
    13
    「⼦供向け童話」での役割(3テーブル)
    ・セッション保存(RW)
    ・童話の最⼤件数の定義(R)
    ・童話データの取得(R)

    View full-size slide

  15. AWS課⾦
    14
    AWSはスモールサービスなら無料で運⽤できそう。
    ■Lambda
    ・100万リクエストまで無料
    ・128MBのメモリ割り当て設定でコードを実⾏する場合、320万秒分が無料
    ■DynamoDB
    ・スループット最⼩テーブルのみであれば、25テーブルまで無料枠内
    ・ストレージが25GBまで無料
    ※いずれもAWSでよくある無料期間の12カ⽉制限はなし

    View full-size slide

  16. alexaシミュレータ
    15
    ■Amazon開発者ポータル
    https://developer.amazon.com/ja/alexa
    シミュレータで対話型のテストができます。
    実際にやってみます。

    View full-size slide

  17. alexaスキルの審査
    16
    alexaスキルの公開にはAmazonによる審査があります。
    「⼦供向け童話」を審査に出そうとしたところで、
    下記チェックボックスがありました。
    お⼦様向けのalexaスキルは審査に通りません(気付くのが遅い)。
    スキル名を「世界の昔話」に変えて申請してみたもののリジェクト。

    View full-size slide

  18. 最後に
    17
    簡単なalexaスキルはGWに
    家族サービスしながら2⽇で作れる!

    View full-size slide