AbemaTV, Inc. All Rights Reserved
AbemaTV, Inc. All Rights Reserved 1
ABEMAモバイルアプリの
プレイヤーを共通化する
2025 February 12th
たなむら (@mtnmr)
CA.aab #5
Slide 2
Slide 2 text
AbemaTV, Inc. All Rights Reserved 2
自己紹介
2023.4 株式会社サイバーエージェント
2023.5 株式会社AbemaTV
Native Mobileチーム / Androidエンジニア
たなむら (@mtnmr)
Slide 3
Slide 3 text
AbemaTV, Inc. All Rights Reserved 3
登録不要で、いつでも無料で楽しめる
24時間365日編成されているリニア配信と
見逃した作品を好きなタイミングでオンデマンドでも楽しむこともできます。
国内最大級のオリジナルエピソード数
オリジナルエピソード数は国内発の動画サービスで日本No.1(※)を誇り、
注目の新作映画、国内外の人気ドラマ、話題のアニメなど豊富なラインナップの作品や、
様々な音楽や舞台のオンラインライブも展開。
※2024年8月時点、自社調べ
100%プロコンテンツ
サイバーエージェントとテレビ朝日
それぞれの強みを活かした制作体制で高品質なコンテンツを配信しています。
多彩なラインナップ
24時間編成のニュース専門チャンネルをはじめ、
オリジナルのドラマや恋愛番組、アニメ、スポーツなど、
多彩なジャンルの約25チャンネルを24時間365日放送しています。
ABEMA 紹介
Slide 4
Slide 4 text
AbemaTV, Inc. All Rights Reserved 4
ABEMA Androidモバイルアプリのプレイヤー
コンテンツの種別ごとに別のプレイヤーとして実装されている
ホーム
スロット用プレイヤー
エピソード用プレイヤー
ライブイベント用プレイヤー
Slide 5
Slide 5 text
AbemaTV, Inc. All Rights Reserved 5
プレイヤー実装の現状
● UI/UiLogicの仕様は同じでも実装が複数ある
● ABEMAモバイルチームではKMPを採用しており共通化を進めているが
初期からある画面なのでKMP導入はされておらず、
Android/iOSでそれぞれロジックを持っている
Slide 6
Slide 6 text
AbemaTV, Inc. All Rights Reserved 6
再生処理
専門チームからライブラリが提供されており
再生品質はプロダクトと切り離して保証されている
Android
プロダクト
iOS
プロダクト
Android
プレイヤー
ライブラリ
iOS
プレイヤー
ライブラリ
プロダクト
開発チーム
プレイヤー
開発チーム
I/FはPF・コンテンツ共通
Slide 7
Slide 7 text
AbemaTV, Inc. All Rights Reserved
②アプリ内のプレイヤー実装は
1つにする
7
プレイヤー実装の現状
● UI/UiLogicの仕様は同じでも実装が複数ある
● ABEMAモバイルチームではKMPを採用しており共通化を進めているが
初期からある画面なのでKMP導入はされておらず、
Android/iOSでそれぞれロジックを持っている
プレイヤーライブラリの変更に合わせて再実装する
①KMPでAndroid/iOSで
ロジックを共通化する
Slide 8
Slide 8 text
AbemaTV, Inc. All Rights Reserved
②アプリ内のプレイヤー実装は
1つにする
8
プレイヤー実装の現状
①KMPでAndroid/iOSで
ロジックを共通化する
この2つを達成できる設計を考える🤔
Slide 9
Slide 9 text
AbemaTV, Inc. All Rights Reserved 9
全体
PlayerA
PlayerB
PlayerC
Player
Fragment,
ViewModel
PlayerUse
Case
Player
UseCaseA
Player
UseCaseB
Player
UseCaseC
KMP
Player
Service
Slide 10
Slide 10 text
AbemaTV, Inc. All Rights Reserved 10
UseCase
UIからのイベントは共通だが
内部ロジックが違うため
● 呼び出すI/Fは共通
● 実装クラスは
インスタンス生成時に
Genericsで指定
● コンテンツによらない
共通処理は切り出す
PlayerUse
Case
Player
UseCaseA
Player
UseCaseB
Player
UseCaseC
KMP
Player
Service
interface
実装クラスは
コンテンツ種別ごと
Slide 11
Slide 11 text
AbemaTV, Inc. All Rights Reserved 11
UseCase
UIからのイベントは共通だが
内部ロジックが違うため
● 呼び出すI/Fは共通
● 実装クラスは
インスタンス生成時に
Genericsで指定
● コンテンツによらない
共通処理は切り出す
interfaceは1つ
実装クラスは複数ある
Slide 12
Slide 12 text
AbemaTV, Inc. All Rights Reserved 12
UI/UiLogic
● 共通で使うFragment, ViewModel
を作る
Genericsを指定できるようにする
● UseCaseの注入には型情報が必要
PlayerA
PlayerB
PlayerC
Player
Fragment,
ViewModel
PlayerUse
Case
abstract class
Slide 13
Slide 13 text
AbemaTV, Inc. All Rights Reserved 13
UI/UiLogic
ViewModelはabstractにして
それ以下はテンプレート
Slide 14
Slide 14 text
AbemaTV, Inc. All Rights Reserved 14
UI/UiLogic
ViewModelはabstractにして
それ以下はテンプレート
PlayerContentの型ごとに
Fragmentを定義する
ViewModelをオーバーライドする(それ以外は空)
Slide 15
Slide 15 text
AbemaTV, Inc. All Rights Reserved 15
UI/UiLogic
ViewModelはabstractにして
それ以下はテンプレート
PlayerContentの型ごとに
Fragmentを定義する
ViewModelをオーバーライドする(それ以外は空)
呼び出し
Slide 16
Slide 16 text
AbemaTV, Inc. All Rights Reserved
まとめ
16
● 複数あるプレイヤー画面を、KMPとGenericsを使って共通化している
○ 現在も実施中⚒
● 共通化して作り直すことで
○ PF間の差分がなくなり仕様・UI構造の差分がなくなる
○ 変更容易性・開発効率が上がる
ことを期待している