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
『スタディサプリ for SCHOOL』における Flutter導入とその成果
Search
Recruit
PRO
March 03, 2025
Technology
2
150
『スタディサプリ for SCHOOL』における Flutter導入とその成果
2025/2/19に開催したRecruit Tech Conference 2025の若宮の資料です
Recruit
PRO
March 03, 2025
Tweet
Share
More Decks by Recruit
See All by Recruit
分散型と集中型で切り開くクラウドコスト最適化: リクルート横断プロダクトCroisのFinOps実践
recruitengineers
PRO
5
270
毎晩の 負荷試験自動実行による効果
recruitengineers
PRO
6
300
Transformerを用いたアイテム間の 相互影響を考慮したレコメンドリスト生成
recruitengineers
PRO
2
1.1k
Javaで作る RAGを活用した Q&Aアプリケーション
recruitengineers
PRO
1
200
問題解決に役立つ数理工学
recruitengineers
PRO
13
2.9k
Curiosity & Persistence
recruitengineers
PRO
2
220
結果的にこうなった。から見える メカニズムのようなもの。
recruitengineers
PRO
1
480
成長実感と伸び悩みからふりかえる キャリアグラフ
recruitengineers
PRO
1
240
リクルートの オンプレ環境の未来を語る
recruitengineers
PRO
3
520
Other Decks in Technology
See All in Technology
Claude Code x Androidアプリ 開発
kgmyshin
1
510
OCI Bastionサービス
oracle4engineer
PRO
1
120
いま、あらためて考えてみるアカウント管理 with IaC / Account management with IaC
kohbis
2
630
どこで動かすか、誰が動かすか 〜 kintoneのインフラ基盤刷新と運用体制のシフト 〜
ueokande
0
170
生成AIによるソフトウェア開発の収束地点 - Hack Fes 2025
vaaaaanquish
35
16k
Oracle Base Database Service:サービス概要のご紹介
oracle4engineer
PRO
2
20k
.NET開発者のためのAzureの概要
tomokusaba
0
220
サービスロボット最前線:ugoが挑むPhysical AI活用
kmatsuiugo
0
180
Delegate authentication and a lot more to Keycloak with OpenID Connect
ahus1
0
240
イオン店舗一覧ページのパフォーマンスチューニング事例 / Performance tuning example for AEON store list page
aeonpeople
1
150
datadog-distribution-of-opentelemetry-collector-intro
tetsuya28
0
240
生成AI活用のROI、どう測る? DMM.com 開発責任者から学ぶ「AI効果検証のノウハウ」 / ROI of AI
i35_267
4
150
Featured
See All Featured
4 Signs Your Business is Dying
shpigford
184
22k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
Scaling GitHub
holman
462
140k
Testing 201, or: Great Expectations
jmmastey
45
7.6k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.4k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
23
1.4k
Intergalactic Javascript Robots from Outer Space
tanoku
272
27k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.6k
A designer walks into a library…
pauljervisheath
207
24k
We Have a Design System, Now What?
morganepeng
53
7.7k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1.1k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
Transcript
『スタディサプリ for SCHOOL』における Flutter導入とその成果 RECRUIT TECH CONFERENCE 2025 Flutter/KMPを用いたアジリティ追求の軌跡 若宮 浩司
株式会社リクルート プロダクトディベロップメント室
若宮 浩司 OSS・TVゲーム・スポーツ観戦 経歴 / Career 2023年にリクルートにキャリア採用入社。 Flutterのエキスパートとして、『スタディサプリ for SCHOOL』のリプレイスプロジェクトに関わる。
ワンチームでAndroidとiOSの開発を行う体制に刷新した 案件が、2023年度まなび領域通期 MVPに選出される。 趣味 / Hobbies プロダクトディベロップメント室 販促領域プロダクトディベロップメント5ユニット (まなび) 進学情報プロダクト開発部 ForSCHOOL開発グループ
『スタディサプリ for SCHOOL』 • 主な機能 ◦ 適性診断 ◦ 学校検索、資料請求 ◦
オープンキャンパス検索、予約 ◦ 進路選択の履歴確認 • 提供プラットフォーム ◦ Android ◦ iOS ◦ Web 生徒の進路選択をサポートするサービス
Agenda 1. リプレイスプロジェクトの紹介 2. リプレイスプロジェクトの成果と振り返り 3. 開発効率に影響した2つの要素 4. まとめ
リプレイスプロジェクトの紹介 プロジェクトの概要 • AndroidとiOSのリプレイスプロジェクト ◦ 約1年半 (22年4月から23年12月) で達成 ◦ Add-to-app
(Androidのみ) から開始し、全コードをFlutterで書き直し ▪ ほぼ100% Dartのプロジェクトに刷新 • Webのリプレイスプロジェクト ◦ 1年弱 (24年4月~24年12月) で達成 ◦ AndroidとiOSとコードを分けずに、Web対応のコードを追加して対応 ▪ DartでブラウザAPIを利用する各種処理に対応
リプレイスプロジェクトの紹介 プロジェクトの概要 • AndroidとiOSのリプレイスプロジェクト ◦ 約1年半 (22年4月から23年12月) で達成 ◦ Add-to-app
(Androidのみ) から開始し、全コードをFlutterで書き直し ▪ ほぼ100% Dartのプロジェクトに刷新 • Webのリプレイスプロジェクト ◦ 1年弱 (24年4月~24年12月) で達成 ◦ AndroidとiOSとコードを分けずに、Web対応のコードを追加して対応 ▪ DartでブラウザAPIを利用する各種処理に対応
リプレイスプロジェクトの紹介 プロジェクトの概要 • AndroidとiOSのリプレイスプロジェクト ◦ 約1年半 (22年4月から23年12月) で達成 ◦ Add-to-app
(Androidのみ) から開始し、全コードをFlutterで書き直し ▪ ほぼ100% Dartのプロジェクトに刷新 • Webのリプレイスプロジェクト ◦ 1年弱 (24年4月~24年12月) で達成 ◦ AndroidとiOSとコードを分けずに、Web対応のコードを追加して対応 ▪ DartでブラウザAPIを利用する各種処理に対応
リプレイスプロジェクトの紹介 プロジェクトのねらい • 案件に対応する開発リソースの確保 ◦ 開発リソースを確保するのが難しい状況を解消したい ◦ 新規に開発したい機能に対して開発が追いついていない • プラットフォーム間の差異を無くしたい
◦ 学校現場ではWebアプリの重要性が高い ◦ 開発体制の関係でモバイルの方が開発が先行しがちになっている • 機能の開発スピードを高速にしたい ◦ 開発と管理にかかる工数を削減したい ◦ 議論がチームごとに分割される状態を解消したい
Flutterによるリプレイスプロジェクト プロジェクトのねらい • 案件に対応する開発リソースの確保 ◦ 開発リソースを確保するのが難しい状況を解消したい ◦ 新規に開発したい機能に対して開発が追いついていない • プラットフォーム間の差異を無くしたい
◦ 学校現場ではWebアプリの重要性が高い ◦ 開発体制の関係でモバイルの方が開発が先行しがちになっている • 機能の開発スピードを高速にしたい ◦ 開発と管理にかかる工数を削減したい ◦ 議論がチームごとに分割される状態を解消したい
リプレイスプロジェクトの紹介 リプレイス前の開発体制 Android SDK Kotlin ForSCHOOL開発グループ (Android開発チーム) iOS SDK Swift
ForSCHOOL開発グループ (iOS開発チーム) Vue.js TypeScript ForSCHOOL開発グループ (Web開発チーム) Androidアプリ iOSアプリ Webアプリ
リプレイスプロジェクトの紹介 リプレイス後の開発体制 Flutter Dart ForSCHOOL開発グループ (Flutter開発チーム) Flutter Dart ForSCHOOL開発グループ (Flutter開発チーム)
Flutter Dart ForSCHOOL開発グループ (Flutter開発チーム) Androidアプリ iOSアプリ Webアプリ
リプレイスプロジェクトの成果と振り返り リプレイスによる変化 • Andorid、iOS、Webの全プラットフォームをFlutterで開発 ◦ AndroidとiOSのエンジニアがチームの中心に ◦ 開発チームが徐々に合併することでワンチームに • 開発に関わる仕組みの統合
◦ チームごとのミーティングをグループのミーティングに統一 ◦ アプリごとのリポジトリをFlutterのリポジトリに統一 ◦ プラットフォームごとの開発チケットをFlutterに統一
リプレイスプロジェクトの成果と振り返り リプレイスによる変化 • Andorid、iOS、Webの全プラットフォームをFlutterで開発 ◦ AndroidとiOSのエンジニアがチームの中心に ◦ 開発チームが徐々に合併することでワンチームに • 開発に関わる仕組みの統合
◦ チームごとのミーティングをグループのミーティングに統一 ◦ アプリごとのリポジトリをFlutterのリポジトリに統一 ◦ プラットフォームごとの開発チケットをFlutterに統一
リプレイスプロジェクトの成果と振り返り 1/2 削減 すべて 解消 大幅に 向上 開発リソース プラットフォーム差異 開発スピード
リプレイスプロジェクトの成果と振り返り リプレイス前後の比較 • 開発に必要な開発リソース ◦ アプリとチームの統合が行われ、総開発工数を1/2以下に削減 ◦ チームを構成するエンジニア数も減少するも、リソース確保問題が解消 ⚡ •
プラットフォーム間の差異 ◦ リプレイス時に差異を全て確認した結果、想定外の差異は0に ◦ プラットフォームによる、提供される機能の差は解消 🎉 • 開発スピードが大きく向上 ◦ 単一言語に統一したことでPRレビューの質と量が向上 ◦ チケット管理などの手間も削減 ✂
リプレイスプロジェクトの成果と振り返り プロジェクトの副次的な成果 • iPadやAndroid Tabletなどのサポート ◦ ネイティブSDKによる実装ではサポートできていなかった ◦ Web対応の一環としてレイアウトを実装することで、追加工数なく対応 •
運営の中で手が回っていなかった仕組みも改善 ◦ アプリ内で利用するHTMLコンテンツの運用改善に着手 ◦ CI/CDを整備する中でQAプロセスの整理や改善にも着手
開発効率に影響した2つの要素 ワンチーム体制 『経験のないプラットフォーム』への チャレンジ
開発効率に影響した2つの要素 ワンチーム体制 • 段階的にFlutterを導入することで、アプリとチームが段階的に統合された ◦ Android → Android + iOS
→ Android + iOS + Web の順に統合 ◦ アプリの統合が進むと開発チームも徐々にひとつにまとまっていく • 1つのサービスに対して1つのチームの関係に ◦ 新たな案件の検討時に、プラットフォームごとの考慮が少なくなっていく ◦ 開発から運用までを、ひとつのチームが検討し運用する体制へ
開発効率に影響した2つの要素 ワンチーム体制 • 段階的にFlutterを導入することで、アプリとチームが段階的に統合された ◦ Android → Android + iOS
→ Android + iOS + Web の順に統合 ◦ アプリの統合が進むと開発チームも徐々にひとつにまとまっていく • 1つのサービスに対して1つのチームの関係に ◦ 新たな案件の検討時に、プラットフォームごとの考慮が少なくなっていく ◦ 開発から運用までを、ひとつのチームが検討し運用する体制へ 『スタディサプリ for SCHOOL』の開発に最適なチームが誕生
開発効率に影響した2つの要素 『経験のないプラットフォーム』へのチャレンジ • Flutterの導入によりチャレンジしやすい環境に変化 ◦ AndroidエンジニアがiOSアプリの開発に挑戦 ◦ モバイルエンジニアがWebアプリの開発に挑戦 • チャレンジによるスキルアップが、新たなチャレンジに繋がる好循環へ
◦ 開発効率が向上したことにより、ゆとりが生まれたことも状況を後押し ◦ チームが関わる領域が広がることで、開発や運用の効率が高まっていく
開発効率に影響した2つの要素 『経験のないプラットフォーム』へのチャレンジ • Flutterの導入によりチャレンジしやすい環境に変化 ◦ AndroidエンジニアがiOSアプリの開発に挑戦 ◦ モバイルエンジニアがWebアプリの開発に挑戦 • チャレンジによるスキルアップが、新たなチャレンジに繋がる好循環へ
◦ 開発効率が向上したことにより、ゆとりが生まれたことも状況を後押し ◦ チームが関わる領域が広がることで、開発や運用の効率が高まっていく 高スキルなメンバーで構成されるチームへ
まとめ Flutterによるリプレースプロジェクトによって 開発にかかるコストを削減 + メンバーのスキル向上により 2倍以上の開発生産性を獲得 ‼