少人数体制を実現する モバイルアプリ開発のDevEx改善

少⼈数体制を実現する モバイルアプリ開発のDevEx改善 牟⽥ 拓広 iOSDC Japan 2025 Day.2 1

⾃⼰紹介 牟田 拓広 （Takuhiro MUTA） ウェルスナビ株式会社 サービス機能開発チーム / iOS エンジニア ウェルスナビでは ● iOSに関わること全般やってます ● 時々AndroidのコードレビューとかCI/CDのメンテも ひとこと ● このスライドKeynoteで作りたかった 2 @2025 WealthNavi Inc.

資産運用ロボアドバイザー 「 WealthNavi 」 3 ※ ⼀般社団法⼈⽇本投資顧問業協会「契約資産状況（最新版）（2025年3⽉末現在） 『ラップ業務』『投資⼀任業』」を基にネット専業業者を⽐較 ウエルスアドバイザー 社調べ（2025年6⽉時点） ※ 画⾯はイメージです。

DevExとは 4 @2025 WealthNavi Inc.

DevEx(DX)とは ● Developer Experience(開発者体験)の略 ● 開発者が業務を通して得る体験 ○ Fitting architecture (適切なアーキテクチャ) ○ Great tools (優れたツール) ○ Processes to back that all up (全てをバックアップするプロセス) ○ Nontoxic team culture (無毒なチーム⽂化) 出典: https://developerexperience.io/articles/good-developer-experience 5 @2025 WealthNavi Inc.

なぜDevExが重要なのか ● 開発者もユーザーの1⼈ ● 開発者の体験が悪いと⻑期的に⾒た時プロダクト/組織に悪影響を及ぼす 6 @2025 WealthNavi Inc.

DevExが低いと... 生産性 低下 DevExが低い DevExが低下 プロダクトの 品質低下 開発者の待遇 悪化 組織の信頼度 低下 売上低下 経営悪化 etc… 7 @2025 WealthNavi Inc.

DevExが低いと... 生産性 低下 DevExが低い DevExが低下 プロダクトの 品質低下 開発者の待遇 悪化 組織の信頼度 低下 売上低下 経営悪化 etc… サ終 8 @2025 WealthNavi Inc.

DevExはプロダクト /組織にとっての 肝臓のようなもの 9 @2025 WealthNavi Inc.

DevExが良いと ● ⾃分の関わっているプロダクトに誇りを持てる ● 組織やプロダクトの課題を⾃分事として捉えやすくなる ○ 健全な提案がしやすくなる ● 事業側とのコミュニケーションも捗る ● 組織‧事業‧プロダクトの成⻑に繋がる 10 @2025 WealthNavi Inc.

健全な体験は健全なプロダクトに宿る 11 @2025 WealthNavi Inc.

皆さんが DevExで重視していること CONFIDENTIAL 12

ウェルスナビの開発体制(2025/9/21現在) ● バックエンド ○ ● Webフロントエンド ○ ● たくさん たくさん モバイル ○ iOS: 2⼈(+育休1⼈) ○ Android: 1⼈(+業務委託2⼈) 少人数でも回せる水準の開発者体験が必要 13 @2025 WealthNavi Inc.

WNのモバイルアプリ開発におけるDevEx(アジェンダ) 1. DevExとは 2. 開発環境構築の自動化 3. 自動テストの整備 4. CI/CDの改善 5. さいごに 14 @2025 WealthNavi Inc.

1. DevExとは 2. 開発環境構築の自動化 3. 自動テストの整備 4. CI/CDの改善 5. さいごに 15 @2025 WealthNavi Inc.

開発環境構築のあるある ● 環境構築の⼿順が多い ○ Homebrewをインストール ■ rbenvをインストール ● RubyとBundlerをインストール ○ fastlaneをインストール ○ CocoaPodsをインストール ■ Podライブラリをインストール ■ Mintをインストール ● SwiftLintをインストール ■ Carthageをインストール ○ Xcode templatesをコピー ○ Git hooksをコピー 16 @2025 WealthNavi Inc.

開発環境構築のあるある ● 環境構築の⼿順が多い ○ Homebrewをインストール ■ rbenvをインストール ● RubyとBundlerをインストール ○ fastlaneをインストール ○ CocoaPodsをインストール ■ Podライブラリをインストール ■ Mintをインストール ● SwiftLintをインストール ■ Carthageをインストール ○ Xcode templatesをコピー ○ Git hooksをコピー 17 @2025 WealthNavi Inc.

開発環境構築のあるある ● 環境構築の⼿順が多い ○ Homebrewをインストール ■ rbenvをインストール ● RubyとBundlerをインストール ○ fastlaneをインストール ○ CocoaPodsをインストール ■ Podライブラリをインストール ■ Mintをインストール ● SwiftLintをインストール ■ Carthageをインストール ○ Xcode templatesをコピー ○ Git hooksをコピー 18 スクリプト1本で 全自動化 @2025 WealthNavi Inc.

効果 ● ⼿順書無しで環境構築が可能に ○ ● cloneさえできてしまえば後はほぼスクリプトがやってくれる 受け⼊れ側のフォローコストもほぼ0 今まで参画してきた中で一番スムーズに オンボーディングできました 19 @2025 WealthNavi Inc.

開発環境のメンテナビリティ ● 各種ツールのバージョン ○ ● Git上でバージョン管理しておりRenovateで更新 Xcode templates ○ 内部でシンボリックリンクを活⽤ 複数のテンプレートで共通のファイルを使⽤可能に ● 開発環境の更新⾃体も⾃動化 ○ Git Hooksで変更を検知して⾃動反映 20 @2025 WealthNavi Inc.

開発環境のメンテナビリティ ● 各種ツールのバージョン ○ ● Git上でバージョン管理しておりRenovateで更新 Xcode templates ○ 内部でシンボリックリンクを活⽤ 複数のテンプレートで共通のファイルを使⽤可能に ● 開発環境の更新⾃体も⾃動化 ○ Git Hooksで変更を検知して⾃動反映 21 @2025 WealthNavi Inc.

Renovateによるツールのアップデート ● Ruby以外は基本Renovateで監視 ○ RubyのバージョンはBitriseのStackに依存しているため⼿動で更新 22 @2025 WealthNavi Inc.

開発環境のメンテナビリティ ● 各種ツールのバージョン ○ ● Git上でバージョン管理しておりRenovateで更新 Xcode templates ○ 内部でシンボリックリンクを活⽤ 複数のテンプレートで共通のファイルを使⽤可能に ● 開発環境の更新⾃体も⾃動化 ○ Git Hooksで変更を検知して⾃動反映 23 @2025 WealthNavi Inc.

Xcode templates ● Xcode上で使えるカスタムテンプレート ● 1画⾯新規作成時に必要なファイルを⽣成 ○ ViewController ○ View ○ ViewStore ○ SceneBuilder ○ Coordinator ↑をまとめて作成も可 ○ New Sceneテンプレート ● 24 @2025 WealthNavi Inc.

Xcode templates 内部でシンボリックリンクを活⽤ 複数のテンプレートで共通のファイルを使⽤可能に 25 @2025 WealthNavi Inc.

開発環境のメンテナビリティ ● 各種ツールのバージョン ○ ● Git上でバージョン管理しておりRenovateで更新 Xcode templates ○ 内部でシンボリックリンクを活⽤ 複数のテンプレートで共通のファイルを使⽤可能に ● 開発環境の更新⾃体も⾃動化 ○ Git Hooksで変更を検知して⾃動反映 26 @2025 WealthNavi Inc.

開発環境の更新⾃体も⾃動化 ● git-hooksのpost-checkoutで特定ファイルの変更を検知 ● 対応するツールのインストールコマンドを実⾏ 27 @2025 WealthNavi Inc.

開発環境の更新⾃体も⾃動化 ● git-hooks⾃体も⾃動で更新させたい ● .git/hooks はGit管理できないので管理できる所から⾃動でコピーさせる 28 @2025 WealthNavi Inc.

まとめ: 開発環境構築の⾃動化 ● 開発環境構築をスクリプト1本で⾃動化 ○ オンボーディング対応コスト改善 ● 必要なツールはRenovateでバージョン管理 ● Xcode templatesでボイラープレートを削減 ○ ● シンボリックリンクの活⽤で⼆重管理防⽌ Git Hooksで変更を⾃動反映 ○ 開発環境⾃体の更新も⾃動化 開発環境の変化を意識しない開発が可能に 30 @2025 WealthNavi Inc.

1. DevExとは 2. 開発環境構築の自動化 3. 自動テストの整備 4. CI/CDの改善 5. さいごに 31 @2025 WealthNavi Inc.

⾃動テスト ● 品質担保の上でテストは必要不可⽋ ● 開発者もテスターも少ない中での⼿動テストは限界 自動テストを整備してテストの工数を減らそう！ 32 @2025 WealthNavi Inc.

ウェルスナビアプリの⾃動テスト ● ● Unit test ○ API ■ OHHTTPStubs ○ ViewStore (⼀部) ○ View、ViewController ■ snapshot test ● UIKit → FBSnapshotTestCase ● SwiftUI → swift-snapshot-testing E2E test 33 @2025 WealthNavi Inc.

snapshot test ● プログラムの出⼒を保存しておき、その後の出⼒との差分を⽐較するテスト ● モバイルアプリではViewを画像に出⼒してsnapshotとすることが多い ○ ● レイアウトの変更や表⽰崩れが可視化されやすい State-Drivenなアーキテクチャと相性が良い 34 @2025 WealthNavi Inc.

ウェルスナビアプリのアーキテクチャ State-Drivenな独⾃アーキテクチャを採⽤(VCASアーキテクチャ) View Command ViewStore Action State dispatchCommand command Middlewares (RequestService、 ○○Manager、etc…) View (ViewController) effect action dispatchAction PublishRelay <Effect> state BehaviorRelay <State> @2025 WealthNavi Inc.

ウェルスナビアプリのアーキテクチャ SwiftUI版 HostingController ViewStore: ObservedObject dispatchCommand Middlewares (RequestService、 ○○Manager、etc…) effect action command SwiftUI.View dispatchAction AsyncStream <Effect> state @Published State @2025 WealthNavi Inc.

VCASアーキテクチャとsnapshot test ● Stateを流し込むだけで 対応するViewが⽣成できる ● チェックしたい画⾯のパターン分 Stateのバリエーションを⽤意すればOK 37 @2025 WealthNavi Inc.

snapshotの更新 ● 環境変数でisRecordingを 操作できるように ● fastlaneで環境変数を注⼊ ● Makefileで簡易コマンド化 ○ make record → ○ make record_all → 指定した画⾯のsnapshotを更新 全snapshot更新 38 @2025 WealthNavi Inc.

snapshotの更新 ● 環境変数でisRecordingを 操作できるように ● fastlaneで環境変数を注⼊ ● Makefileで簡易コマンド化 ○ make record → ○ make record_all → 指定した画⾯のsnapshotを更新 全snapshot更新 39 @2025 WealthNavi Inc.

snapshotの更新 ● 環境変数でisRecordingを 操作できるように ● fastlaneで環境変数を注⼊ ● Makefileで簡易コマンド化 ○ make record → ○ make record_all → 指定した画⾯のsnapshotを更新 全snapshot更新 ● 40 @2025 WealthNavi Inc.

snapshot testの導⼊による効果 ● 画⾯レイアウトの変更がGitの差分として可視化 ○ 表⽰崩れに気づきやすくなった ○ 複数の画⾯サイズに対応 ■ ● 特に会社で所有していない端末サイズも確認可 Xcode Previewsがまともに機能しないようなアプリでも使える PRのレビューコスト&QAテストの⼯数が削減 41 @2025 WealthNavi Inc.

E2Eテスト ● Autify for Mobileから内製化へ以降 ○ Detoxを採⽤...のはずが 42 @2025 WealthNavi Inc.

E2Eテスト ● ● 9/3にパスキーをリリース ○ それに伴いDetoxでのログイン操作が不可能に🤮 ○ DetoxがASWebAuthenticationSessionのログイン画面を認識できない XCUITestで再度作り直すことに...🙃 43 @2025 WealthNavi Inc.

まとめ: ⾃動テスト ● snapshotテストでレイアウト崩れ等を検出 ○ ● QAに指摘される前に気づける E2Eテストの⾃動化によりリグレッションテストの⼯数を削減 ○ QAの⼯数も減らしつつ事前に気付ける ⼿戻りを減らすことで開発に集中できる 44 @2025 WealthNavi Inc.

1. DevExとは 2. 開発環境構築の自動化 3. 自動テストの整備 4. CI/CDの改善 5. さいごに 45 @2025 WealthNavi Inc.

ウェルスナビのCI/CD ● ● Bitrise ○ PRで⾃動テストの実⾏ ○ 検証/本番⽤アプリのビルド及び配信 GitHub Actions ○ PRの静的解析 ■ Danger-Swift + SwiftLint 47 @2025 WealthNavi Inc.

Bitriseでの検証⽤アプリのビルド/配信 ● 検証⽤アプリはFirebase App DistributionでAdHoc配信 ● 複数の案件が並⾏しており、それぞれで検証環境が⽴っている時に カジュアルに向き先を変えられる仕組みを導⼊ ○ SlackからSlash Commandsで実⾏できるようにしてBitriseへのアクセス権限がない⼈ でも欲しいバージョン、向き先でビルドできるように 49 @2025 WealthNavi Inc.

Bitriseでの検証⽤アプリのビルド/配信 https://www.docswell.com/s/WN_Tech-PR/5X637M-202509-08-164700 50 @2025 WealthNavi Inc.

• https://www.docswell.com/s/WN_Tech-PR/5X637M-2025-09-08-164700

GitHub ActionsでPRの静的解析 ● Danger-Swift + SwiftLint ● Dangerfile.swiftに対し魔改造に魔改造を重ねて様々なチェック機構を実装 ○ 対応するチケットIDが貼られているか ○ APIの向き先を変えたままにしていないか ○ (画⾯に変更が⼊っている場合)対応するsnapshot testが存在するか ○ (リリース時のみ)CFBundleVersionが更新されているか ○ etc… 51 @2025 WealthNavi Inc.

GitHub ActionsでPRの静的解析 ● SwiftLint ○ 細かく設定を⼊れている他、カスタムルールを使って⽅⾔の要改善箇所を検出 52 @2025 WealthNavi Inc.

GitHub ActionsでPRの静的解析 ● 解析結果とLintの警告をコメントで出⼒ 53 @2025 WealthNavi Inc.

GitHub ActionsでPRの静的解析 ● リリース⽤のPRにはバージョン番号とリリースノートを表⽰ 54 @2025 WealthNavi Inc.

まとめ: CI/CD ● BitriseのワークフローをSlackから実⾏できるように ● Danger-SwiftとSwiftLintを魔改造して検出できる項⽬を増やす ○ ⾃動で弾けない部分もとりあえず可視化して気づきやすくする環境を 55 @2025 WealthNavi Inc.

1. DevExとは 2. 開発環境構築の自動化 3. 自動テストの整備 4. CI/CDの改善 5. さいごに 56 @2025 WealthNavi Inc.

ヒューマンエラーを極限まで減らす 仕組みづくりが重要 57 @2025 WealthNavi Inc.

これからのウェルスナビ ● 個⼈向け⾦融プラットフォームを⽬指す ○ 資産運⽤からサービス領域を拡⼤してお客様をサポートできるよう、 個⼈向け⾦融プラットフォームを⽬指した取り組みを継続 ※現時点では構想段階で未提供。将来的に提供する可能性があるサービス領域。 ※画像はイメージです。 58 @2025 WealthNavi Inc.

これからのウェルスナビ(とまとめ) ● 少⼈数でも回せるためのDevEx向上 = ヒューマンエラーの要因をとにかく減らすこと ○ ● 開発に集中できるよう、できる限りの作業を⾃動化しておく 資産運⽤以外のサービス領域でもモバイルアプリの開発があるかも ○ いつ始まってもいいようにWNにおけるアプリ開発基盤として この辺の仕組みを切り出していきたい 59 @2025 WealthNavi Inc.

【重要な注意事項】 ● 本資料は、断定的判断を提供するものではなく、情報を提供することのみを⽬的としており、いか なる種類の商品も勧誘するものではありません。最終的な決定は、お客様⾃⾝で判断するものと し、当社はこれに⼀切関与せず、また、⼀切の責任を負いません。 ● 本資料には将来の出来事に関する予想が含まれている場合がありますが、それらは予想であり、ま た、本資料の内容の正確性、信頼性、完全性、適時性等を⼀切保証するものではありません。本資 料に基づいて被ったいかなる損害についても、当社は⼀切の責任を負いません。また、当社は、新 しい情報や将来の出来事その他の情報について、更新⼜は訂正する義務を負いません。 ● 本資料を利⽤することによりお客様に⽣じた直接的損害、間接的損害、派⽣的損害その他いかなる 損害についても、当社は⼀切の責任を負いません。 商号等：ウェルスナビ株式会社 金融商品取引業者 関東財務局長（金商） 第2884号 加入協会：日本証券業協会 一般社団法人日本投資顧問業協会 60 @2025 WealthNavi Inc.

ご清聴ありがとうございました 61 @2025 WealthNavi Inc.

Appendix 1 定期的にWealthNaviの開発（技術‧組織）に関する情報を発信しています。 開発者ブログ 技術広報に関する お問い合わせ先 https://zenn.dev/p/wn_engineering ブックマーク追加や記事への「いいね」していただけると嬉しいです ウェルスナビ 技術広報チーム（[email protected]） 62 @2025 WealthNavi Inc.

• https://zenn.dev/p/wn_engineering

Appendix 2 ウェルスナビでは複数の開発系ポジションで採⽤を強化しています。 モバイル開発エンジニア エンジニアリングマネージャー バックエンド開発エンジニア QAエンジニア データエンジニア 主な採⽤中職種 ● ● ● ● ● 採⽤情報詳細 下記URL（QRコード）よりご確認ください。 https://recruit.wealthnavi.com/ 採⽤に関する お問い合わせ先 ● ● 「カジュアルに話を聞いてみたい」という温度感でも構いません。 ウェルスナビ採⽤チーム（[email protected]）までご連 絡お待ちしております。 63 @2025 WealthNavi Inc.

• https://recruit.wealthnavi.com/