Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【ITニュース解説】Billin: Building a modern cross-platform invoice app with Compose Multiplatform

2025年09月22日に「Dev.to」が公開したITニュース「Billin: Building a modern cross-platform invoice app with Compose Multiplatform」について初心者にもわかりやすく解説しています。

作成日: 更新日:

ITニュース概要

請求書アプリBillinは、Compose Multiplatform (CMP) を採用し、Android版をiOSにも展開した。Kotlinで共通コードを書き、プラットフォーム固有の調整を行うことで、開発効率を高め、各OSで自然な操作感を持つアプリを実現した。

ITニュース解説

Billin(ビリン)は、フリーランサーや中小企業、専門家が手軽に請求書を作成し、送信、管理できるスマートな請求書作成アプリである。このアプリは、ユーザーに清潔で信頼性の高い体験を提供することを目指して開発された。まずAndroid版が作られ、Kotlin(コトリン)とJetpack Compose(ジェットパック コンポーズ)という技術が開発効率の向上に大きく貢献した。その結果、Androidユーザーからは高速で洗練されたアプリとして高い評価を得た。

しかし、フリーランサーや中小企業は様々なデバイスや環境で仕事をしており、多くのユーザーからiOS版の要望が寄せられた。ここで、Compose Multiplatform(コンポーズ マルチプラットフォーム、略称CMP)という技術が注目された。iOS版を開発するにあたり、完全に独立したSwiftUI(スウィフトUI)アプリをゼロから作るか、あるいは既にAndroid版で活用しているKotlinとComposeの技術をiOSにも拡張するかの二つの選択肢があった。Billinチームは後者を選び、CMPがその選択に適切であったことを証明した。

Android版からCMPへの移行にはいくつかの課題があった。例えば、Androidでは請求書のPDFプレビューにAndroidX(アンドロイドエックス)のコンポーネントを利用していたが、これはiOSでは利用できなかった。この問題に対して、請求書の画像プレビューを生成するという解決策が採用された。この方法は両方のプラットフォームで問題なく機能した。また、UI(ユーザーインターフェース)の慣習もプラットフォーム間で異なった。AndroidのMaterial Design(マテリアルデザイン)にあるような画面をタッチした際のアニメーション効果(リップルエフェクト)はiOSでは無効にし、画面遷移のアニメーションもiOSのユーザーが自然と感じるようなものに変更された。レイアウトや要素間の間隔も慎重に調整され、iOSユーザーが「単に移植されたAndroidアプリ」だと感じないように工夫された。幸いなことに、既にAndroid版で利用していたJetpack Composeの多くのライブラリはマルチプラットフォームに対応しており、さらにBillinチームが開発したオープンソースライブラリ「pale-blue-kmp-core」は、プラットフォーム間でロジックを共有する上で大きな出発点となった。

Billinのアーキテクチャはサービスベースで構築されており、これがマルチプラットフォーム開発を効率的に進める上で重要な役割を果たした。ファイル保存や共有といったシステムレベルの操作は、SystemService(システムサービス)層を通じて抽象化されている。これにより、具体的なシステム操作の詳細を気にすることなく、共通のロジックからこれらの機能を利用できる。Kotlinが持つexpect/actual(エクスペクト/アクチュアル)メカニズムは、ほとんどのロジックを共有しつつ、プラットフォーム固有のコードが必要な部分だけを個別に実装することを可能にした。また、モノレポパターンという開発手法が採用されている。これは、Android、iOS、そしてサーバー側の各プロジェクトを一つのリポジトリ(コードを管理する場所)にまとめるもので、モデル(データの構造)、ビジネスロジック(アプリの具体的な処理内容)、さらには一部のバックエンドコードまでを各プラットフォーム間で共有できる利点がある。

サーバー側のバックエンドもKotlin(Springフレームワークを利用)で書かれているため、Billinは単にモバイルアプリがマルチプラットフォームであるだけでなく、フロントエンド、バックエンド、共有ライブラリに至るまで、全体が統一されたKotlinエコシステムの中で動作している。

デザイン面では、BillinはAndroidのMaterial DesignやiOSのHuman Interface Guidelines(ヒューマンインターフェースガイドライン)に厳密に縛られず、清潔でモダン、かつ中立的でエレガントなビジュアルスタイルを目指した。これにより、どちらのプラットフォームでもユーザーが違和感なくアプリを使えるように配慮された。しかし、プラットフォーム固有の慣習を完全に無視したわけではない。画面遷移やシステムダイアログなど、ユーザーが各プラットフォームで期待する動作や見た目については、ネイティブのUI要素やアニメーションが採用された。共有されたプラットフォームに依存しないデザイン言語と、ネイティブのタッチを組み合わせることで、Billinはどのデバイスで使っても一貫性がありプロフェッショナルな印象を与えつつ、そのデバイスに「なじんでいる」と感じられるアプリになった。

アプリ内課金(In-App Purchases、略称IAP)の管理も、マルチプラットフォーム開発の大きな課題の一つである。Google Play Console(グーグル プレイ コンソール)とApp Store Connect(アップストア コネクト)での設定は必須だが、両プラットフォームでプロダクトIDの一貫性を保ち、価格を調整し、クライアント側で実装するのは非常に複雑な作業である。Billinチームは、この複雑さを解消するためにRevenueCat(レベニューキャット)というサービスを導入した。RevenueCatは、実行時に適切なプロダクト情報を取得し表示する動的なペイウォール機能を提供することで、多くの管理作業を簡素化した。

これにより、アプリのコード内にプロダクトリストを直接記述する必要がなくなり、さらにA/Bテスト機能を使ってマーケティングメッセージや価格戦略を簡単に試すことが可能になった。また、RevenueCatはプラットフォームを横断した統合レポート機能を提供しており、サブスクリプション状況や収益の全体像を把握するのが格段に容易になった。さらに、RevenueCatがKotlin Multiplatform(KMP)SDKを提供していたことも大きな利点であった。このSDKのおかげで、既存のBillinのアーキテクチャにRevenueCatをスムーズに統合することができ、開発者にとって非常に扱いやすいものとなった。

Billinアプリの主な機能としては、税金や割引、自動計算に対応した請求書の作成、支払いや未払い項目、経費、クライアントごとのサマリーなどを記録する追跡とレポート機能、提供する品目やサービスを登録し、迅速な請求書作成に役立てるエンティティ管理機能、そしてPDFや画像形式で請求書をプレビューし、安全に共有し、複数のデバイスからデータにアクセスできるクロスプラットフォームアクセス機能がある。これらの機能は、清潔でモダンなデザインに包まれており、AndroidとiOSのデザインシステムに過度に縛られず、しかしネイティブのUI要素やアニメーションを適切に活用することで、各プラットフォームで自然な使い心地を実現している。

Compose Multiplatform(CMP)の採用は、単にコード量を減らすことだけが目的ではなかった。それは、開発プロセスを効率的かつ拡張可能な状態に保ちながら、シームレスなクロスプラットフォーム体験を創出することを目指していた。今日のBillinは、共有された一つの基盤から作られたネイティブのAndroidアプリであり、素晴らしいiOSアプリでもある。慎重な調整によって、Billinは各エコシステムに完全に統合されているように感じられながらも、プラットフォーム間で一貫したユーザー体験を維持している。Kotlin/Springで構築されたバックエンドとモノレポアプローチを組み合わせることで、Billinはモデル、ロジック、サービスをあらゆる場所で再利用できる、統一された開発スタックを確立した。このアプローチは、開発速度の向上、重複する作業の削減、そしてAndroidとiOSの両方で違和感なく動作するアプリを提供することを可能にしながら、清潔でプラットフォームに依存しないデザインへのこだわりを実現したのである。

関連コンテンツ

関連IT用語

関連ITニュース