Upgrade to Pro — share decks privately, control downloads, hide ads and more …

「freeeのモバイルチームを知ってくれ」freee技術の日発表資料 - 2023年

sugiken
April 17, 2023

「freeeのモバイルチームを知ってくれ」freee技術の日発表資料 - 2023年

2023年4月16日に開催されたfreee技術の日の発表資料です。

sugiken

April 17, 2023
Tweet

More Decks by sugiken

Other Decks in Technology

Transcript

  1. freeeのモバイルチームを
    知ってくれ
    sugiken
    2023年4⽉16⽇

    View full-size slide

  2. ここに円に切り抜いた画像を入れてく
    ださい
    sugiken
    2019年 新卒⼊社 webエンジニアとして freee 会計に
    携わる
    2021年 社内の異動制度を利⽤しモバイルチームへ異
    動し会計アプリの開発を担当
    趣味は旅⾏とカラオケ
    モバイル船 モバイル会計ヨット

    View full-size slide

  3.  
    ⽬次
    1. チームの⽬標の話
    2. 「モバイルならでは」を探す話
    3. 技術の話

    View full-size slide

  4. ⽬標の話
    1

    View full-size slide

  5.  
    freeeのモバイルチームを
    知ってくれ
    そもそもなぜこのタイトルなのか

    View full-size slide

  6.  
    freeeのモバイルチームを
    知ってくれ
    「freee」って聞くとwebサービスのイメージで
    すよね?

    View full-size slide

  7.  
    freeeのモバイルチームを
    知ってくれ
    まだまだfreeeモバイルチームの
    知名度が低い!!

    View full-size slide

  8.  
    freeeのモバイルチームを
    知ってくれ
    freeeモバイルチームは、
    おもしろい!!

    View full-size slide

  9.  
    freee会計
    freee開業
    freee福利厚生
    freeeアプリストア
    freee人事労務
    freee会社設立
    freee受発注
    freeeプロジェクト管理
    freee資金調達 freee申告 freeeカード
    freeeのモバイルアプリ
    freeeサイン

    View full-size slide

  10.  
    モバイル会計アプリ利用者数シェアNo.1
    71%
    他社
    ※出典:リードプラス株式会社「主要3社のサービス利⽤者数のシェア(2021年7⽉~2022年6⽉のユニークユーザー数)」
     https://localfolio.leadplus.co.jp/blog/industry-analysis-series_cloud-accounting-software

    View full-size slide

  11.  
    モバイルチームが今後3年で⽬指すところ
    スマートフォンだけで「だれもが⾃由に経営できる」世界の実現
    ● 個人事業主ユーザーが日々の経営や確定申告が超簡単にできる
    ● 従業員ユーザーがサクッと勤怠管理や経費精算などのバックオフィス業務を簡単・確実
    にできる
    ● 統合型経営プラットフォームを実現するためにいくつかの新規アプリのリリース

    View full-size slide

  12. 「モバイルならでは」
    の話

    View full-size slide

  13.  
    「モバイルならでは」を探す理由
    ● web版にはほぼ全ての機能があるので、極論web版で良い
    ● みんなPCは持ってなくても、モバイル端末は持っている
    ○ 特に業種ごとに傾向もある
    ● モバイルにはモバイルの特性があり、体験の向上ができる
    ● モバイルの可能性を僕らが信じている

    View full-size slide

  14.  
    常に「モバイルならでは」
    を探し続けている

    View full-size slide

  15.  
    ⼤切にしていること
    「ユーザーを知ること」

    View full-size slide

  16.  
    ユーザーを知るために - ユーザーインタビュー
    エンジニアも同席。ユーザーの声を聞きアイディアに活かす
    ● いくつかのインタビュー形式
    ○ モックアップによる UI の検証
    ○ インサイトを探るためのインタビュー
    良い点
    ● 使われている機能/難しいと思われている機能などが分かる
    ● やっぱり直接聞くと⼼に残る

    View full-size slide

  17.  
    ユーザーを知るために - タウンホールミーティング
    モバイルユーザーの⽅7⼈に集まっていただき、経営層からエンジニアまで直接話を
    聞く会
    本当にズバズバと、ユーザーさんの
    本⾳を聞ける会だった

    View full-size slide

  18.  
    モバイルならではの価値ってなんだろう
    ● 誰でも持ってる
    ● 直感的な操作
    ● カメラなどのハード⾯
    ○ モバイル端末でのエッジ OCR
    ● NFC による交通系電⼦カード/マイナンバー読み
    取り

    View full-size slide

  19.  
    ユーザーについてのいくつかのファクト
    ● モバイルアプリのユーザー層は、明らかにPCメインのユーザーと異なる
    属性
    ○ 例)年齢、業種
    ● "知識" がユーザーごとに異なってくる
    ○ 「操作の分からない」と「知識の分からない」は別
    ○ 例)確定申告の⼀連の流れを知っているかどうか

    View full-size slide

  20.  
    「どんなユーザーか」
    ×
    「モバイルならではの価値」

    View full-size slide

  21. 技術の話

    View full-size slide

  22.  
    freee モバイルチームの特徴
    をドドドッと紹介

    View full-size slide

  23.  
    MoVibes - モバイルアプリ専⽤のデザインシステム
    ● デザイナーがそれぞれのOS⽤に作成し、これを基に社内 UI ライブラ
    リ作成
    ● UIの統⼀感/開発速度向上を⽬指している
    ● 新規画⾯で徐々に導⼊中
    実装⾯でよかったところ
    ● デザイナーとの共通⾔語が持てる
    ● ⾊やテキストのスタイル指定が楽
    ● Component の再利⽤による開発速度向上

    View full-size slide

  24.  
    SwiftUI の検証‧導⼊中
    ⼤規模な導⼊ < 部分的な導⼊
    UIHostingController を⽤いて部分的に導⼊をしたり、新画⾯は
    SwiftUI を積極採⽤している。
    アプリケーション全体を SwiftUI 化していくのはもう少し先。マルチモ
    ジュール化なども並⾏しているので、それが落ちてついてから。
    新規アプリでは、フルSwiftUI & The Composable Architecture

    View full-size slide

  25.  
    アクセシビリティ向上に全⼒
    「⾼いアクセシビリティは売れる」
    ● 1⼈でも使えない⽅がいると採⽤してもらえない可能性がある
    ● すべてのユーザーにとって使いやすくなる
    やり⽅
    ● はじめに
    ○ 「freeeアクセシビリティー‧ガイドライン」を基にモバイル⽤のチェックシー
    トを作成
    ● デザイン段階
    ○ 要素の⼤きさや⾊などチェック
    ● 実装段階
    ○ PR ごとに、特にエンジニアとして担保したい箇所をチェック
    ● QA 段階
    ○ VoiceOver などをオンにしてチェック

    View full-size slide

  26.  
    MobCore
    Kotlin Multiplatform Mobile の社内ライブラリ。
    iOS/Android の両 OS をまたいでコードを共通化。
    2020年から開発開始し、iOS/Android 両エンジニアで育てている。
    ⽤途
    ● API response のモデル
    ○ API のドキュメント的役割も果たしている
    ■ OS 間で「えっ!?この property Nullable じゃないの?」みたいなのが避けられる
    ● ドメインロジック
    ■ 税額計算
    ■ 要素の表⽰条件
    ■ ユーザーの権限や設定を考慮した分岐
    ● Form モデル(画⾯の⼊⼒内容やそれに伴うロジック)

    View full-size slide

  27.  
    マルチモジュール化
    不要なコードのビルドを避ける環境を作ると同時に機能間‧レイヤー間の依存
    関係を整理‧明確化することで以下を⽬指す
    ● 保守性‧拡張性の向上
    ● ビルド速度の改善による開発速度の向上
    Android
    マルチモジュール化済み
    iOS
    現在: 巨⼤な App Target と数個の社内 SwiftPackage というモジュール構成
    機能群(feature)ごとに分割していく予定

    View full-size slide

  28.  
    ⾃分たちで効果測定
    リリースした機能の効果検証を⾃分たちでやっている
    設計段階で、取得するべきログを PdM と相談して決定し Redash で分析
    ⾃分たちで DB の設計‧構造を理解していくことで、さらなるドメイン理解にも
    つながる

    View full-size slide

  29.  
    課⾦周りめっちゃすごい
    特徴
    ● 国内 toB SaaS の中でも有数のプラン数
    ● 最⼤ 54,800円/年の⾼額サブスク
    カオス
    ● IAP/IAB/web からのクレカ決済など多種多様な⽀払⼿段
    ● 1ユーザー でも複数の事業所を持てる
    ○ どの IAP/IAB で、どの事業所に課⾦してるのかのハンドリングが必要

    View full-size slide

  30.  
    負債返済へ真摯な姿勢
    毎⽇の業務に加えて毎⽉の改善デー(1⽇⾃由に負債返済の⽇)で
    みんなでガッと対応
    最近取り組んでること
    ● [Android] NonTransitiveR への移⾏
    ● [iOS] CocoaPods/Carthage から SPM へ移⾏
    ● [iOS] Warning の解消 700over から 100 くらいに減少
    ● モバイル専⽤ API への移⾏
    ○ 現状 Mobile API は全部で175個!!!

    View full-size slide

  31.  
    Ruby も書きます!
    ⾃分たちで Ruby on Rails のコードを書いて API の実装をしている
    良い点
    ● クライアントからサーバーサイドまで⾃分たちで完結できる
    ● API に任せられるロジックは API に書こうと思える
    ● 予想外の API スキーマの変更によるトラブルを減らすことができる

    View full-size slide

  32.  
    まとめ
    スマートフォンだけで「だれもが⾃由に経営できる」世界の実現」
    そのために、
    ● ユーザーを知る
    ● ユーザーのための開発をする
    ● 新しい技術を果敢に取り組む
    ● 負債返済も忘れない

    View full-size slide