AIを活用した「献立ガチャ」アプリ開発記:レアリティ演出からStripe課金まで
本記事は、日々の「今日の献立」という日常的な悩みを解決するために開発された「献立ガチャ」アプリの技術的な開発プロセスと設計思想を詳細に解説している。このアプリは、ユーザーが選択した条件(食事の時間帯、ジャンル、気分、調理時間など)に基づき、Claude APIを利用して主菜・副菜・汁物の3品からなる献立を提案する。技術スタックは、フロントエンドにExpo(React Native)とTypeScriptを採用し、状態管理にZustand、課金システムにStripe Checkout、広告に忍者AdMaxを組み込んでいる。
アプリの核となるのは「ゲーミフィケーション」の導入である。献立に「レアリティ」という概念を持たせ、N(ノーマル)からSSR(超激レア)までの4段階の確率システムを導入。SSRは7%という低確率で、紫系のグローやトリプルバイブレーションといった派手な演出を施し、「引いた感」を最大化している。また、ガチャの演出には、レアリティに応じたフラッシュアニメーションやハプティックフィードバックが用いられている。
AI連携面では、Claude APIを使用し、単なるテキスト生成ではなく、主菜・副菜・汁物それぞれの料理名、材料、手順、カロリー、栄養成分、そしてレアリティを網羅した構造化JSON形式での出力を徹底している。プロンプト設計では、「必ず」という強調表現やフィールド定義の明示により、AIの出力安定性を高めている。さらに、ユーザーの苦手食材や直近の食事履歴を考慮した動的なコンテキスト注入も行っている。
マネタイズは、無料枠(初日10回/日、以降5回/日)→報酬広告(動画視聴で+1回)→プレミアムサブスクリプション(月額480円、無制限・広告なし)の3段階構造を採用。特に、課金チェックをクライアント側ではなくサーバー側(API Routes)で行う堅牢な設計がなされている。開発全体を通して、Claude Codeの利用により、大規模なコンポーネント生成やストア設計、演出追加が劇的に効率化された実体験が語られている。
背景
本記事は、個人開発者がAI(Claude API)と最新のモバイル開発技術(React Native/Expo)を組み合わせて、実用的な「ガチャ」要素を持つアプリケーションを開発した過程を記録したものです。単なる技術紹介に留まらず、ゲーミフィケーション、マネタイズ設計、AIプロンプトエンジニアリングといった多角的な視点から、開発の知見を共有しています。
重要用語解説
- Expo(React Native): React Nativeというフレームワークを使い、Expoというツールキットを利用することで、一つのコードベースからWeb、iOS、Androidの複数のプラットフォームに対応できるモバイルアプリケーションを開発する技術。
- 構造化JSON: AIなどのシステムから、人間が読みやすい自然言語ではなく、プログラムが解析しやすい特定の形式(JSON)でデータを安定的に出力させるための設計。データの信頼性を高める。
- ゲーミフィケーション: ゲームの要素(レアリティ、ガチャ、コレクションなど)を、ゲームではない日常的な活動(献立決め)に取り入れ、ユーザーのモチベーションや継続利用を促す仕組み。
- 影響: 本記事で示された開発手法は、個人開発者が高度なAI機能(LLM)を組み込んだ複雑なアプリケーションを、効率的かつ堅牢に構築するための具体的なガイドラインとなる。特に、AIの出力を構造化し、それをゲーム要素や収益モデルに組み込むプロセスは、今後のAIを活用したサービス開発の標準的なモデルとなり得る。