Android スキルセットをフル活用して始めるスマートテレビアプリ開発

AbemaTV, Inc. All Rights Reserved  AbemaTV, Inc. All Rights Reserved 
1 Android スキルセットをフル活用して始めるスマートテレビアプリ開発 2022 June 9th Satoshi Takeda / satsukies

AbemaTV, Inc. All Rights Reserved  2 アジェンダ 0. 自己紹介 1.
AndroidTVとは 2. なぜいまAndroidTVなのか 3. Androidとの違い 4. AndroidTVアプリ開発をはじめよう 5. まとめ

AbemaTV, Inc. All Rights Reserved  竹田智 / satsukies 2017年
CyberAgentに新卒入社。同年 AbemaTVへ出向し、Androidチームでアプリ開発に従事。 2019年春 AndroidTV向けアプリの開発担当にスイッチ。 2021年夏 Cross Deviceチームに異動し、現在に至る。趣味・タイヤの付いた乗り物（クルマ、バイク、ロードバイク）・カメラ・ガジェット 4 Profile

AbemaTV, Inc. All Rights Reserved  Android TV OS搭載のデバイス AndroidTVとは 6
月間アクティブ数 1.1億台以上の規模[1] • 液晶一体型のスマートTV • スティック型デバイス • STB（セットトップボックス） • プロジェクター etc… [1] https://android-developers.googleblog.com/2022/05/whats-new-with-google-tv-android-tv-os.html

AbemaTV, Inc. All Rights Reserved  手軽にエンターテイメントを楽しめる AndroidTVとは 7 • Google
Playストアが利用可能 ◦ 動画・音楽などアプリ ◦ ゲームアプリ • ホームでのレコメンドが充実 ◦ ユーザの好みに合わせたサジェスト ◦ システムからのレコメンド ◦ アプリからのおすすめ

AbemaTV, Inc. All Rights Reserved  なぜいまAndroidTVなのか 9 インターネット接続可能なデバイスの台数推移 • 通信機器は飽和状態に近い
• コンシューマー機器は強い増加傾向コロナ禍を経て更に増加していると推測できるユーザボリュームの拡大が見込める =多くのユーザにプロダクトを届けるチャンスコネクティッドデバイスの普及世界のIoTデバイス数の推移及び予測 [2] [2] https://www.soumu.go.jp/johotsusintokei/whitepaper/ja/r03/html/nd105220.html

AbemaTV, Inc. All Rights Reserved  なぜいまAndroidTVなのか 10 • COVID-19によって生じた生活スタイルの変化 ◦
「通勤通学などのスキマ時間に楽しむ」から「おうち時間を楽しむ」 • TVデバイスの特徴 ◦ スマホやタブレットに比べて圧倒的に大きなディスプレイ ◦ 整った環境下で視聴できる ◦ みんなで楽しめる TVデバイスとマルチメディアコンテンツの相性◎ よりよいユーザ体験を得るための選択肢を提供

AbemaTV, Inc. All Rights Reserved  なぜいまAndroidTVなのか 11 • インターネットに接続可能なデバイスの増加 ◦
PC、スマートフォン、タブレット、 TV、スピーカー、自動車、etc… ◦ 利用シーンに合わせて使い分けている • クロスデバイスユースケースを想定した SDKの登場 ◦ Cast SDK ◦ Nearby ◦ Crossdevice SDK “マルチデバイス”・”クロスデバイス” というキーワード今後も注目・注力される領域

AndroidTVとは 2. なぜいまAndroidTVなのか 3. Androidとの違い 4. AndroidTVアプリ開発を始めよう 5. まとめ

AbemaTV, Inc. All Rights Reserved  変わらないところ Androidとの違い 17 • アーキテクチャ・設計
• 開発手法・開発環境 • アプリのリリース・運用

AbemaTV, Inc. All Rights Reserved  変わってくるところ変わらないところ Androidとの違い 18 •
アーキテクチャ・設計 • 開発手法・開発環境 • アプリのリリース・運用

アーキテクチャ・設計 • 開発手法・開発環境 • アプリのリリース・運用 • ターゲットデバイス ◦ 16:9のLandscape画面 • デバイス特性に起因する差分 ◦ リモコン操作、音声入力 ◦ レコメンド ◦ UI・UXデザイン • Leanbackサポートライブラリ ◦ 最適化されたUIテンプレート

アーキテクチャ・設計 • 開発手法・開発環境 • アプリのリリース・運用 • ターゲットデバイス ◦ 16:9のLandscape画面 • デバイス特性に起因する差分 ◦ リモコン操作、音声入力 ◦ レコメンド ◦ UI・UXデザイン • Leanbackサポートライブラリ ◦ 最適化されたUIテンプレート Androidアプリ開発における知識・経験はフル活用可能！！

AbemaTV, Inc. All Rights Reserved  AndroidTVらしいUIを実装する際に有用なライブラリ。様々なコンポーネントが用意されていて、組み合わせで実現できることは多いが、クセもそこそこ。 Leanbackサポートライブラリ画像
Androidとの違い android/tv-samplesのREADMEより[3] 21 D-PAD操作によるFocus移動でのインタラクション設計や大画面への表示を前提とした UIの構築がマスト。音声入力やレコメンド機能に対応することで、コンテンツへのアクセスに必要なアクションを最小化可能。デバイス特性を考慮した設計 [3] https://github.com/android/tv-samples/tree/main/LeanbackShowcase

AbemaTV, Inc. All Rights Reserved  サンプルコード AndroidTVアプリ開発に必要なモノ AndroidTVアプリ開発を始めよう 24 •
アプリをビルドできる環境 ◦ Android StudioでOK • アプリを実行する環境 ◦ お持ちのAndroidTVデバイス ◦ エミュレータ satsukies/androidtv-compose-sample　

AbemaTV, Inc. All Rights Reserved  サンプルコード AndroidTVアプリ開発に必要なモノ AndroidTVアプリ開発を始めよう 25 •
アプリをビルドできる環境 ◦ Android StudioでOK • アプリを実行する環境 ◦ お持ちのAndroidTVデバイス ◦ エミュレータ satsukies/androidtv-compose-sample　

AbemaTV, Inc. All Rights Reserved  AndroidTVアプリ開発を始めよう 27 uses-featureの記載 • leanbackサポート宣言
• タッチスクリーン不要宣言 AndroidManifest.xml の修正

• タッチスクリーン不要宣言 intent filterの追加 • LEANBACK_LAUNCHER • AndroidTVのホーム画面にアプリを表示するために必要 AndroidManifest.xml の修正

• タッチスクリーン不要宣言 intent filterの追加 • LEANBACK_LAUNCHER • AndroidTVのホーム画面にアプリを表示するために必要アプリバナーの追加 • 320x180のxhdpiリソース AndroidManifest.xml の修正

AbemaTV, Inc. All Rights Reserved  AndroidTVアプリ開発を始めよう 31 androidx.leanback • 使わなくてもアプリは作れる
• TVに最適なUI実装の鍵 app-level build.gradle の修正

• TVに最適なUI実装の鍵必要なライブラリの追加 • Jetpack ComposeでUI実装 app-level build.gradle の修正

• TVに最適なUI実装の鍵必要なライブラリの追加 • Jetpack ComposeでUI実装 Build設定 • Compose、bindingの有効化 app-level build.gradle の修正

• LaunchedEffectでリクエスト Focus状態に応じたUI変化 • Focusがあるときは反転したい • MutableInteractionSource ComposeによるUIの実装

• LaunchedEffectでリクエスト Focus状態に応じたUI変化 • Focusがあるときは反転したい • MutableInteractionSource Previewの設定 • デバイスリストのTVを選択 ComposeによるUIの実装

AndroidTVとは 2. なぜいまAndroidTVなのか 3. Androidとの違い 4. AndroidTVアプリ開発を始めよう 5. まとめ

AbemaTV, Inc. All Rights Reserved  AndroidTV、実はアツいんです。まとめ 41 • ビジネス観点
◦ ユーザボリュームが拡大傾向 ◦ クロスデバイス体験強化の流れ • エンジニア観点 ◦ Android開発の経験・資産を活用できる ▪ コア要素のキャッチアップに注力できるメリット ◦ エンジニアとしての価値の向上 ▪ モバイルアプリエンジニアよりも圧倒的に少ない ▪ スマホ / TVデバイス双方の開発で戦力になれる

AbemaTV, Inc. All Rights Reserved  AndroidTV、実はアツいんです。まとめ 42 • ビジネス観点
◦ ユーザボリュームが拡大傾向 ◦ クロスデバイス体験強化の流れ • エンジニア観点 ◦ Android開発の経験・資産を活用できる ▪ コア要素のキャッチアップに注力できるメリット ◦ エンジニアとしての価値の向上 ▪ モバイルアプリエンジニアよりも圧倒的に少ない ▪ スマホ / TVデバイス双方の開発で戦力になれる「世界に誇れる新メディア」を目指し一緒に「ABEMA」を成長させていきたい仲間を探しています！

Android スキルセットをフル活用して始めるスマートテレビアプリ開発

Android スキルセットをフル活用して始めるスマートテレビアプリ開発

Transcript

More Decks by satsukies

Other Decks in Programming

Featured