Rork で作るモバイルアプリの収益化入門 — 広告・課金・サブスクの選び方を実例で整理する

// 三モデルの月次収益を、同じ粒度の入力から見積もる最小の物差し
type AdsInput = { dau: number; impressionsPerDau: number; ecpmJpy: number };
type IapInput = { mau: number; payerRate: number; arppuJpy: number };
type SubInput = {
  trialStartsPerMonth: number;
  trialToPaid: number;      // トライアルから本課金への転換率（0〜1）
  monthlyPriceJpy: number;
  monthlyChurn: number;     // 課金者の月次解約率（0〜1）
};
 
export function estimateAds({ dau, impressionsPerDau, ecpmJpy }: AdsInput) {
  // eCPM は 1,000 表示あたりの収益なので 1,000 で割る
  return Math.round((dau * impressionsPerDau * 30 * ecpmJpy) / 1000);
}
 
export function estimateIap({ mau, payerRate, arppuJpy }: IapInput) {
  return Math.round(mau * payerRate * arppuJpy);
}
 
export function estimateSubSteadyState({
  trialStartsPerMonth,
  trialToPaid,
  monthlyPriceJpy,
  monthlyChurn,
}: SubInput) {
  // 毎月同じ数のトライアルが入り続けたときに落ち着く課金者数 = 新規課金者 ÷ 月次解約率
  const newPayers = trialStartsPerMonth * trialToPaid;
  const steadyPayers = monthlyChurn > 0 ? newPayers / monthlyChurn : Infinity;
  return {
    steadyPayers: Math.round(steadyPayers),
    monthlyRevenueJpy: Math.round(steadyPayers * monthlyPriceJpy),
    // 定常状態に近づくまでの目安（月）。解約率の逆数がそのまま時間軸になる
    monthsToSettle: monthlyChurn > 0 ? Math.round(1 / monthlyChurn) : Infinity,
  };
}

// React Native + Rork での AdMob バナー実装例
import { View } from "react-native";
import { BannerAd, BannerAdSize, TestIds } from "react-native-google-mobile-ads";
 
function AppScreen() {
  // 開発中はテスト ID を使う。本番 ID で自分の端末をタップし続けると無効トラフィック扱いになる
  const adUnitId = __DEV__
    ? TestIds.BANNER
    : "ca-app-pub-XXXXXXXXXXXXXXXX/YYYYYYYYYY";
 
  return (
    <View style={{ flex: 1 }}>
      <YourMainContent />
      <BannerAd
        unitId={adUnitId}
        size={BannerAdSize.ANCHORED_ADAPTIVE_BANNER}
        requestOptions={{
          requestNonPersonalizedAdsOnly: false,
        }}
      />
    </View>
  );
}

import { useEffect } from "react";
import { Platform, View, Text, TouchableOpacity } from "react-native";
import { useIAP } from "react-native-iap";
 
const productIds = ["pro_unlock", "premium_pack", "feature_x"];
 
function PurchaseScreen() {
  const { connected, products, getProducts, requestPurchase, currentPurchase, finishTransaction } = useIAP();
 
  useEffect(() => {
    if (connected) getProducts({ skus: productIds });
  }, [connected]);
 
  // 購入結果はコールバックではなく currentPurchase の変化として届く
  useEffect(() => {
    if (!currentPurchase) return;
    (async () => {
      // 1. まずサーバーへ送って検証する（クライアントの結果を信じない）
      const ok = await verifyOnServer(currentPurchase);
      // 2. 検証が通ってから finishTransaction。ここを先にすると検証前に消費されてしまう
      if (ok) await finishTransaction({ purchase: currentPurchase, isConsumable: false });
    })();
  }, [currentPurchase]);
 
  const handlePurchase = async (sku: string) => {
    try {
      // v12 系は iOS と Android で引数の形が違う。導入したバージョンの型定義で必ず確認する
      await requestPurchase(Platform.OS === "ios" ? { sku } : { skus: [sku] });
    } catch (err) {
      console.error("Purchase failed", err);
    }
  };
 
  return (
    <View>
      {products.map((p) => (
        <TouchableOpacity key={p.productId} onPress={() => handlePurchase(p.productId)}>
          <Text>{p.title} - {p.localizedPrice}</Text>
        </TouchableOpacity>
      ))}
    </View>
  );
}

import { Platform } from "react-native";
import { requestSubscription } from "react-native-iap";
 
const subscriptionId = "monthly_pro";
 
// Android はオファーごとの offerToken が必須。getSubscriptions() の結果から取り出す
const handleSubscribe = async (offerToken?: string) => {
  try {
    await requestSubscription({
      sku: subscriptionId,
      ...(Platform.OS === "android" && offerToken
        ? { subscriptionOffers: [{ sku: subscriptionId, offerToken }] }
        : {}),
      // トライアル期間はストア側の商品設定で持つ。コード側は検証後に finishTransaction する方針を守る
      andDangerouslyFinishTransactionAutomaticallyIOS: false,
    });
  } catch (err) {
    console.error("Subscription failed", err);
  }
};

// 登録月ごとのコホートで N か月後の継続率を出す最小例
type Sub = { userId: string; startedAt: Date; canceledAt: Date | null };
 
function retentionByCohort(subs: Sub[], monthsOut: number) {
  const cohorts: Record<string, { total: number; retained: number }> = {};
  for (const s of subs) {
    const key = `${s.startedAt.getFullYear()}-${s.startedAt.getMonth() + 1}`;
    cohorts[key] ??= { total: 0, retained: 0 };
    cohorts[key].total++;
    const boundary = new Date(s.startedAt);
    boundary.setMonth(boundary.getMonth() + monthsOut);
    // monthsOut か月後もまだ解約していなければ継続とみなす
    if (!s.canceledAt || s.canceledAt > boundary) cohorts[key].retained++;
  }
  return Object.entries(cohorts).map(([month, c]) => ({
    month,
    retention: c.total ? Math.round((c.retained / c.total) * 100) : 0,
  }));
}