Slide 1

Slide 1 text

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構造の差分がなくなる ○ 変更容易性・開発効率が上がる ことを期待している

Slide 17

Slide 17 text

AbemaTV, Inc. All Rights Reserved