Perk アプリの技術選定とリリースから1年弱経ってのふりかえり

「【Wantedly Tech Night】少数精鋭チームで取り組む1→10事業開発の裏側」で発表した資料です。
https://wantedly.connpass.com/event/356677/

Transcript

1. © 2025 Wantedly, Inc. Perk アプリの技術選定と リリースから1年弱経ってのふりかえり Tech Night Jun.18 2025 - 富岡真悟
2. © 2025 Wantedly, Inc. ⾃⼰紹介 名前 富岡 真悟 職種 エンジニア 所属 Engagement Growth Squad 入社日 2017.04
3. © 2025 Wantedly, Inc. 昨年の夏に iOS / Android アプリをリリースしました 🚀 Perk アプリの紹介
4. © 2025 Wantedly, Inc. 今日はこのアプリの技術選定について その背景や、リリースから1年弱開発してみての所感 を話します
5. © 2025 Wantedly, Inc. モバイルチームに協力してもらい、アプリを開発 Engagement チーム内には Web のエンジニアが 2人。モバイルのエンジニアはいない モバイルチームは別に存在（主に別プロダクトの開発を行っている） 前提：チーム体制について PdM Designer Web Engineers Mobile Engineers Engagement Growth Squad Mobile Chapter
6. © 2025 Wantedly, Inc. Engagement チームからの要求 ✓ Web でできることは基本的にアプリでもできること ✓ iOS と Android をあまり時間を空けずにそろえられること ◦ 福利厚生サービスなので公平性が大事 ✓ 今後の機能リリース速度をできるかぎり落とさないこと ◦ 1→10フェーズでは特に重要 モバイルチームからの要求 ✓ メンテナンスコストがなるべくかからないこと アプリに対する要求
7. © 2025 Wantedly, Inc. ガワ Flutter + 中身 WebView を採用 [結論]
8. © 2025 Wantedly, Inc. WebView 利用の理由 • 初期リリースまでのリードタイムを大 幅に短くできる ◦ すでにスマホに最適化された Web実装が あり、それがほぼそのまま使える • 今後の機能リリースも速くできる ◦ Web とアプリで実装を共通化できる ◦ 大部分の変更は Web エンジニアだけで 行える ◦ ストアの審査を通さずにリリースできる メリット • 触ったときのスムーズさや気持ちよさ はネイティブ実装よりも劣る • OSの提供機能を使う際はちょっと手 間がかかる 相対的にメリットがデメリットを上回ると判断 👍 デメリット
9. © 2025 Wantedly, Inc. • UI が WebView ベースだと、ガワ部分もプラットフォーム依存な実装は少ない ◦ 👉 クロスプラットフォーム技術を採用して開発コストを抑える • 組織として Flutter をプロダクト利用して検証してみたかった Flutter 利用の理由
10. © 2025 Wantedly, Inc. 基本的には WebView に寄せ、Flutter でないと実装できないところは Flutter で実装 Flutter と WebView の棲み分け
11. © 2025 Wantedly, Inc. • ログイン・ログアウト周り ◦ セキュリティ上の理由で WebView 内ではソーシャルログインが動かないため • フォアグラウンド復帰時のアカウントの有効性チェック • ボトムバー • ユニバーサルリンクのハンドリング Flutter で実装している箇所
12. © 2025 Wantedly, Inc. 基本的に mobile web 用の実装をそのまま WebView 内で表示しているが、 一部アプリ用にカスタマイズしている • グローバルフッターなど不要な要素を非表示にする • Web用のグローバルヘッダーの代わりに、アプリ用のナビゲーションヘッダーを表示 • サイト外へのリンクを、 Flutter 経由で、アプリ内ブラウザや外部ブラウザで開く web 側に加えている主なアプリ用の分岐処理
13. © 2025 Wantedly, Inc. 実装の詳細が気になったら懇親会などで聞いてください！ 近いうちにブログも書く予定です✍
14. © 2025 Wantedly, Inc. • 小中規模の機能をいくつかリリースをしてきたが、狙いどおり Web エンジニア だけでクイックに開発ができていていい感じ 👍 ◦ ガワがすでにできていれば、ほとんどの機能は web の開発だけで完結する • たまにネイティブ機能に関わるところは、モバイルチームに助けてもらっている 🤝 ◦ 位置情報取得のパーミッションとか、ユニバーサルリンク対応とか • このアーキテクチャで困ったという場面は今のところない リリースから1年弱経ってのふりかえり
15. © 2025 Wantedly, Inc. • Perk では少数の Web エンジニアで、 Web & アプリの開発を行っている 💪 • アプリは「ガワ Flutter + 中身 WebView」を使うことで、 Web の実装をすればほぼそのままアプリにも展開できるようになっている • これにより高速な開発体制を実現している 🚀 まとめ