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
Amazon Echo Show向けウェブアプリの開発
Search
Sora Arakawa
August 26, 2021
0
1.8k
Amazon Echo Show向けウェブアプリの開発
サポーターズ学生ライトニングトーク ~2021夏の終り編~
Sora Arakawa
August 26, 2021
Tweet
Share
More Decks by Sora Arakawa
See All by Sora Arakawa
技術島の指定ツール「LaTeX」で同人誌を作ろう
arkw
2
61
ポスト・パソコン時代のジャンク遊び スマートデバイス編
arkw
0
57
ジャンカーよ、車も買え ~10分でわかる!? 中古車選び入門~
arkw
1
62
arkw vs. サーバ移転 -2024年1月版-
arkw
0
230
なれる! 村上さん Misskeyサーバ構築入門
arkw
0
420
Cloudflare Tunnelで自宅サーバを公開してみた
arkw
0
1.3k
5分でわかる!? 7セグメントLED制御
arkw
0
61
ヤフオクで原付買った話
arkw
0
170
パソコンの消費電力と省エネ化のおはなし
arkw
0
270
Featured
See All Featured
How to Think Like a Performance Engineer
csswizardry
22
1.3k
Being A Developer After 40
akosma
89
590k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
26
1.9k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.4k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
59k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
38
1.9k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
232
17k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
132
33k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3.1k
YesSQL, Process and Tooling at Scale
rocio
170
14k
Java REST API Framework Comparison - PWX 2021
mraible
28
8.3k
Transcript
Amazon Echo Show向け ウェブアプリの開発 Sora Arakawa (arkw) 2021/08/26 サポーターズ学生LT@オンライン 「#技育CAMP」でツイートすると
画面上部に表示されます!
自己紹介 Sora Arakawa(arkw) • 静岡大学 情報学部 行動情報学科 B2 • 趣味:プログラミング、デザイン、鉄道
etc… • バイト:Alexaスキル開発、ウェブサイト制作 • 愛知県岡崎市在住 • https://arkw.net/ • Twitter:@arkw0
Amazon Echo
Amazon Echo • Amazonが開発/販売しているスマートスピーカー • 音声認識AI「Alexa」を搭載 第3世代Echo Dot (¥4,980) 第1世代Echo
Show 5 (¥7,980)
Amazon Echo • Amazonが開発/販売しているスマートスピーカー • 音声認識AI「Alexa」を搭載 アレクサ、NHKニュース流して NHKからお伝えします。東京都では今日、 新たに4704人の感染が確認…(以下略)
Amazon Echo • Amazonが開発/販売しているスマートスピーカー • 音声認識AI「Alexa」を搭載 アレクサ、明日の天気教えて 明日、岡崎市の天気は晴れ、 予想最高気温は摂氏34℃で…(以下略)
Amazon Echo Show
Amazon Echo Show • タッチパネル搭載のAmazon Echo └ Echo Show 5(第1世代/第2世代)
└ Echo Show 8 └ Echo Show 10 例:「アレクサ、NHKニュース流して」 Echo Dot → 音声のみ Echo Show → テレビ放送と同じ映像が流れる
Amazon Echo Show • タッチパネル搭載のAmazon Echo └ Echo Show 5(第1世代/第2世代)
└ Echo Show 8 └ Echo Show 10 例:「アレクサ、NHKニュース流して」 Echo Dot → 音声のみ Echo Show → テレビ放送と同じ映像が流れる
Amazon Echo Show • Androidベースの「Fire OS」を搭載(Fire Tabletと同じ) • 現在の最新バージョンは6.5.4.7(Android 7ベース)
• ただし、スマートスピーカーとして徹底的にカスタマイズされ ているため、タブレットとしての利用は難しい (APKファイルのインストールとUSB転送が塞がれているため、 Androidアプリの追加は不可能)
Amazon Echo Show • 「Amazon Echo Show 5 第1世代」
Amazon Echo Show • 「Amazon Echo Show 5 第1世代」 └
CPU:MediaTek MT8163(Quad-Core ARM
[email protected]
) └ RAM:不明/ROM:不明 └ インカメラ:100万画素/アウトカメラ:無し └ 液晶:5.5インチ タッチスクリーン 960x480px 補足:第2世代はインカメラが200万画素
Alexaスキルの自作 • 「Alexaスキル」=アプリのようなもの 自作可能 • 言語はNode.jsまたはPython • 画面付きスキルも作れる • 既存機能の組み合わせやニュース(RSS)の読み上げ程度は
ノーコードで可能
Alexaスキルの自作 面倒なところ ① Alexa開発者コンソールへの登録が必須 ② 開発環境の構築が面倒 ③ テストの度にデプロイが要る(2~3分) ④ 審査に出さないと一般公開できない
⑤ UIの設計が難しい
None
時計のデザインを変えたい!!
そこでウェブアプリ
ウェブアプリのいいところ ① 開発環境の構築が容易 ② パソコンのウェブブラウザでテストできる ③ 審査無しですぐに一般公開できる ④ 同じコードをパソコンやモバイル端末に流用できる etc…
※「Alexa Web API for Games」ではありません
Amazon Echo Showのブラウザ事情 • Chromiumベースの「Amazon Silk」を内蔵 • かつては「Firefox」も内蔵していたが、削除された • ダウンロード機能や開発者向けツールは塞いである
ブラウザを起動するには ① ウェイクワードを言う ② ビデオホームの「Bing」をタッチ
ブラウザを起動するには ① ウェイクワードを言う 「アレクサ、ブラウザ開いて」 「アレクサ、ウェブブラウザ開いて」 「アレクサ、Silk開いて」
ブラウザを起動するには ② ビデオホームの「Bing」をタップ 音声操作より時間が掛かる → ウェイクワード「アレクサ、Silk開いて」が(たぶん)最速
Ahoxa • デジタル時計のウェブアプリ • Vue.jsで開発
None
Ahoxa • デジタル時計のウェブアプリ • Vue.jsで開発
Echo Show内蔵ブラウザの問題点 • 一定時間(約5分)無操作だと自動でホーム画面に戻る
実験① • 音ゲー界の国歌「conflict」MVを無限にループ再生するウェブ ページを作成して実験 → 30分以上連続で再生された 実験開始直後
実験① • 音ゲー界の国歌「conflict」MVを無限にループ再生するウェブ ページを作成して実験 → 30分以上連続で再生された 実験開始直後 30分経過後
実験② • Ahoxa ~conflict Ver.~ → 1時間以上放置したがホーム画面に戻らなかった
実験③ • ビデオをCSSで透明にした → 4時間以上放置したがホーム画面に戻らなかった
つまり…
背景で透明のビデオを流せば ホーム画面に戻らなくなる!!
Echo Show内蔵ブラウザの問題点 • 一定時間(約5分)無操作だと自動でホーム画面に戻る • 音声操作できない • Echo Showが持つ機能にはアクセスできない •
カメラ/マイクが使えない(らしい)
最後に宣伝 • Ahoxa(MITライセンス) GitHub:arkwnet/ahoxa • ウェブサイト https://arkw.net/ • Twitter @arkw0
ご清聴ありがとうございました