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
『ホットペッパーグルメ』における マルチプラットフォーム化の歩み
Search
Recruit
PRO
March 03, 2025
Technology
2
22
『ホットペッパーグルメ』における マルチプラットフォーム化の歩み
2025/2/19に開催したRecruit Tech Conference 2025の永井の資料です
Recruit
PRO
March 03, 2025
Tweet
Share
More Decks by Recruit
See All by Recruit
大規模プロダクトにおける フロントエンドモダナイズの取り組み紹介
recruitengineers
PRO
4
39
技術的ミスと深堀り
recruitengineers
PRO
3
40
『じゃらんnet』アプリ 改善活動の軌跡
recruitengineers
PRO
2
19
『スタディサプリ for SCHOOL』における Flutter導入とその成果
recruitengineers
PRO
2
14
よりよいビジネスの「実現」のために エンジニアリングを発揮する
recruitengineers
PRO
3
54
イテレーティブな開発で 不確実性を乗り越える
recruitengineers
PRO
3
15
株式会社リクルート 社内ISUCONの裏側
recruitengineers
PRO
1
24
エンジニア主導の企画立案を可能にする組織とは?
recruitengineers
PRO
1
230
人材領域での企業と求職者のマッチング最大化
recruitengineers
PRO
1
20
Other Decks in Technology
See All in Technology
データベースの負荷を紐解く/untangle-the-database-load
emiki
2
530
ウォンテッドリーのデータパイプラインを支える ETL のための analytics, rds-exporter / analytics, rds-exporter for ETL to support Wantedly's data pipeline
unblee
0
130
自分だけの仮想クラスタを高速かつ効率的に作る kubefork
donkomura
0
110
Ruby on Railsで持続可能な開発を行うために取り組んでいること
am1157154
3
160
AIエージェント元年@日本生成AIユーザ会
shukob
1
230
JAWS DAYS 2025 アーキテクチャ道場 事前説明会 / JAWS DAYS 2025 briefing document
naospon
0
2.5k
OPENLOGI Company Profile for engineer
hr01
1
20k
AWSアカウントのセキュリティ自動化、どこまで進める? 最適な設計と実践ポイント
yuobayashi
7
850
偏光画像処理ライブラリを作った話
elerac
1
180
Two Blades, One Journey: Engineering While Managing
ohbarye
4
2.2k
4th place solution Eedi - Mining Misconceptions in Mathematics
rist
0
150
エンジニアリング価値を黒字化する バリューベース戦略を用いた 技術戦略策定の道のり
kzkmaeda
7
3k
Featured
See All Featured
StorybookのUI Testing Handbookを読んだ
zakiyama
28
5.5k
Gamification - CAS2011
davidbonilla
80
5.2k
Automating Front-end Workflow
addyosmani
1368
200k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
7
650
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
30
2.2k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
45
9.4k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
27
1.9k
Adopting Sorbet at Scale
ufuk
74
9.2k
How to train your dragon (web standard)
notwaldorf
91
5.9k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Writing Fast Ruby
sferik
628
61k
Six Lessons from altMBA
skipperchong
27
3.6k
Transcript
『ホットペッパーグルメ』における マルチプラットフォーム化の歩み RECRUIT TECH CONFERENCE 2025 Flutter/KMPを用いたアジリティ追求の軌跡 永井 佑樹 株式会社リクルート プロダクトディベロップメント室
マネジャー
永井 佑樹 育児・料理・筋トレ・ゲーム 経歴 / Career 2014年リクルートに新卒入社。 長年のサービス運営に伴って起こる様々な問題を解決し、更 にアジリティを高めるべく、リクルートでは一部アプリのリ プレイスを進めてきました。現在は『ホットペッパーグル
メ』の開発グループマネジャー。 モバイル技術遍歴: ・『Airレジ』 Swiftフルリプレイス ・『じゃらんnet』 Flutter段階リプレイス ・『ホットペッパーグルメ』KMPフルリプレイス 趣味 / Hobbies プロダクトディベロップメント室 販促領域エンジニアリング2ユニット 飲食領域エンジニアリング部 飲食プロダクト開発1グループ
話すこと • Kotlin Multiplatformを導入した『ホットペッパーグルメ』がなぜ・どのよ うにCompose Multiplatformに取り組むのか
『ホットペッパーグルメ』 飲食店の検索・予約サービス 2020年から2022年にかけてObjective-C&Java からSwift&Kotlinへのフルリプレイスを実施 共通化による工数削減を目的として当時betaだっ たKotlin Multiplatform(KMP)を採用 Objective-C&Javaからのフルリプレイスによりエ ンジニアにとって魅力的な環境に🎉
『ホットペッパーグルメ』におけるKMP KMPとは:Kotlinで書かれたロジックを各プラット フォーム間で再利用する技術 iOS/Android/Shared3つのサブチームで構成される 撤退時もAndroidはそのまま動くという利点から FlutterではなくKMPを採用 iOS Team iOS View
View ViewModel Android Team Android View View ViewModel Shared Team Business logic UseCase Repository Utility チーム構成
Compose Multiplatform Compose Multiplatform は Kotlin と Jetpack Compose をベースとする
Android、iOS、ウェブ、およびデスク トップ(JVM を使用)間で UI を共有するための宣言型フレームワーク https://www.jetbrains.com/ja-jp/kotlin-multiplatform/ 『ホットペッパーグルメ』ではUIも共通化すべく現在画面ごと段階的にJetpack Compose → Compose Multiplatform(CMP)への移行を計画している iOS View Android View TOP 検索条件 検索結果 店舗 SwiftUI XML SwiftUI Compose Compose UIKit Compose 移行イメージ ... Kotlin ロジック
なぜCMPに移行するのか 1. フルリプレイスが一段落してきた中、一層の開発スピードが求められている 2. iOSサポートがbetaまで進み、社内検証の結果からも現実味が出てきた 3. KMP単体だと工数削減効果に限界があることがわかった ◦ コード行数差分、案件リードタイム、実感値など
KMP効果の阻害要因考察 K M P 効 果 の 阻 害 案件特性
片方のOSでのみ実施する A/Bテスト案件が多い プロダクト特性 検索・予約といったAPIに委 ねる処理がほとんどでアプリ 独自に持つビジネスロジック が少ない 体制特性 基本iOS/Android/Sharedそれ ぞれ専任としているためAPIと同 様Sharedに関する設計コミュニ ケーションが発生する ロジックの共通化のみだと旨みが 少なくコミュニケーションコスト がかかる
CMPが解決すること アプリ開発をKMPで完結させられる 1. 片方のOSを先行させる必要がなくなる → 案件特性に依らず共通化メリットを享 受できる 2. iOS/Android/Shared間の境界線がなく なる
→ ワンチームとしての会話が促進される
CMP導入に向けて Android各画面の Jetpack Compose化 iOSでの動作確認 CMP統合 新画面はCMPで リソース管理などはCMP準拠 iOS/Android間の仕様差異解消 ロジック層の設計をCMPに最適化
CMP活動におけるチーム状況 • CMP活用・ワンチームで高速に改善を積み重ねられる状態を目指し全 員がモチベーション高く取り組めている • 新卒社員やインターン生に向けたチャレンジテーマもCMPから多く生 まれている •
🤔 CMPの情報は少なくコミュニティとともに開拓していく必要がある が、Jetpack Composeの知見から流用できるものも多い 今年から積極的にテックブログ等情報発信していく予定です!
まとめ • KMPを用いたフルリプレイスによる技術刷新を行った • 更なる開発効率を求めてCMPによるUI共通化に取り組んでいる