🌲

モバイル開発未経験者が10日でAppStoreにリリースした話

に公開2

はじめに

普段は主にWeb開発をしておりモバイルアプリ開発は全くの未経験ですが、生成AI台頭のおかげで人生初のスマホアプリリリースをたったの10日間で実現できました。

本記事では、開発の流れや意識したポイントなどをご紹介します。

今回のアプリ開発のモチベーションは以下の通りです。

  • バズって稼げればラッキー、稼げなくても知識と経験が得られればOK
  • スマホアプリリリース&収益化を経験してみたい
  • (Claude Codeの費用を少しでも回収したい)

開発したアプリ「ジャマイカの木」

今回リリースした「ジャマイカの木」は5つの数字と四則演算を使って目標の数を作るパズルゲームです。

まずは完成品を見てもらうのが一番早いと思います。ぜひダウンロードしてみてください!

https://apps.apple.com/jp/app/ジャマイカの木-数字をつなげる計算パズル/id6749314618

実際に存在する「ジャマイカ」というおもちゃをスマホアプリ用にアレンジしています。(逆ポーランド記法っぽい見た目にしました)

なぜこの題材を選んだかというと、もちろんゲーム開発が楽しそうだからというのも大いにありますが、以下の理由からスキル面でも私にとって現実的な選択だったからです。

デザインリスクの回避
キャラクターデザインやイラスト制作が不要で、数字とシンプルなUIだけで構成できる

運用負荷の最小化
端末上での動作がメインであり、サーバなしもしくはFirebaseの無料枠などで十分運用できそう

Web開発経験との親和性
React Nativeを採用すればWeb開発の知識を活かしつつモバイル特有の体験を学べる
(いきなり複雑なゲームにしてしまうとUnityなどを採用する必要があり、Web開発の知識が活かしきれない)

つまり、モバイルアプリ開発の中でも越えるべき壁が少ない分野を探ったところ最大の学習効果を狙ったということです。

主要な技術スタックは以下の通りです。

  • React Native:既存のWeb知識を最大限活用
  • Firebase:豊富な無料枠とシンプルな導入
  • Google AdMob:モバイル広告の定番

開発の流れ

開発は大きく3つのフェーズに分けて進めました。

フェーズ1:コンセプト設計

開発の最初の段階では、今後大きく変わらないであろうコアの部分を設計します。

例えば:

  • プロジェクトの目的
  • アプリ概要
  • コア機能
  • 想定ユーザ

などです。

もちろんAIと壁打ちしながら決めていきドキュメント化していきました

この対話を通じて決まったのが以下の要素です:

  • ジャマイカをベースにしたパズルゲーム
  • 無料アプリ + 広告収益のモデル
  • 大人の脳トレ・暇つぶしをメイン、子供の知育をサブターゲット
  • 物理のおもちゃでは実現できない分かりやすい木構造UI
  • 将来的なランキング機能や難易度調整の実装

これらは開発の「ブレない軸」になるため、十分時間をかけて固めました。

フェーズ2:技術選定と設計の詳細化

コンセプトが固まったら、詳細を決めていきます。

ここで設計するのは機能・画面・データ構造・アーキテクチャなどです。この段階で技術選定も行います。

ここで重要なことは、これらは開発していく中で変更される可能性があるため、フェーズ1とは別のドキュメントにしておくことです。

フェーズ2のドキュメントは「フェーズ1の内容を元に具体化したもの」という位置付けですが、具体化の方向性は多様です。

ドキュメントを分割しすぎるのもAIが追いきれなくなるので良くない気がしていますが、最低限ここは別にしておくことで、方針転換の際の影響範囲を限定しました。

フェーズ3:実装

設計が完了したら、実装フェーズではClaude Codeに大部分を委ねました。

基本的な開発サイクル

  1. Claude Codeが機能を実装
  2. Claude Code自身がコードレビューを実施
  3. 問題があれば Claude Code が修正
  4. 私が動作確認してフィードバック

私が担当した部分

  • 動作確認
  • アーキテクチャから逸脱していないかのチェック
  • UIについては比較的細かくレビュー
  • パフォーマンスやセキュリティ面での大きな問題の指摘

この役割分担により、私はコードを一行も書くことなく、品質を担保しながら開発を進められました。

AIにレビューしてもらう際のポイントは以下の記事にもまとめていますので、ぜひ読んでみてください。

https://zenn.dev/jun_t/articles/e53d8e80b15127

意識したこと

UI/UX

技術的な実装はClaude Codeに任せましたが、UI/UXについては特に時間をかけました。

年齢を問わないデザイン戦略
ダークテーマをベースにしながら、数字やエフェクトには鮮やかな色を使用。大人には洗練された印象を、子供には楽しい印象を与える狙いです。

スマホならではのUI設計
物理のジャマイカでは、計算過程を紙に書いてがいましたが、スマホであればUI設計を工夫すれば1画面で表現できるのではないか。そこで、どの数字をどう組み合わせたかが一目で分かる「木構造のUI」を採用しました。これが他のパズルアプリとの差別化ポイントにもなっていると思います。

効果音による体験向上
タップ音や問題クリア時の効果音にもこだわりました。「気持ちよくてクセになる」体験は、音の要素が大きく影響するためです。ここはAIに任せることはできないので作業が必要になってしまいますが、実装することに決めました。

ランキング機能の現実的な設計
ランキングは上位10名のみの表示にしました。これは以下の理由からです:

  • パフォーマンス:全ユーザーデータ取得による遅延回避
  • コスト:Firebase の使用量抑制
  • UX:アクティブユーザー数を隠す効果

機能・コスト・ユーザー体験の三方良しを狙った判断でした。

持続可能な運用設計

「バズって稼げればラッキー、稼げなくても知識と経験が得られればOK」というスタンスなのでノーコストを目指し、収益がゼロでも続けられる状態で設計します。

コスト

  • Firebase(無料枠で運用できる設計・仕様にしておく)
  • Apple Developer Program:年額
  • Claude Code:月額(任意)

Claude Codeは開発時以外不要なので、初期段階ではApple Developer Programの費用のみで運用可能です。

とりあえずリリースする

こだわるべきところはこだわりつつも、とりあえずリリースすることを優先しました。

  • バグや気に入っていない点はいくつかあるが致命的なもの以外は後回しにする
  • ReactNativeはクロスプラットフォーム対応できるがAndroid対応やiPad対応は後回しにする
  • ソースコードのリファクタリングは後回しにする
  • データベースやパフォーマンスの最適化はユーザ数が増えたときに対応する

おわりに

生成AIの有料プランは高額ですが、その投資効果は絶大です。

今回は月額100ドルのお金と10日間の時間を代価として、スマホアプリ開発&リリースの経験と知識を得ることができました。

実質、エンジニア兼専任講師を雇っているようなものだと思えば破格すぎますね。

この記事が、個人開発に興味がある方の背中を押すきっかけになれば幸いです。

そして、もし少しでも興味を持っていただけた方は「ジャマイカの木」で遊んでみてください。

そしてさらにお時間があればフィードバックやApp Storeのレビューをいただけると嬉しいです…!(まだまだ改善点やスマホアプリならではの考慮できていない点が多々ありそうなので…)

https://apps.apple.com/jp/app/ジャマイカの木-数字をつなげる計算パズル/id6749314618

Discussion

石川壱朗石川壱朗

ipadにてプレイさせていただきました。脳トレ的な感覚があって面白かったです。
噂によるとappleの審査は厳しいと良く耳にします。実際のリリースにあたり、苦戦したポイントや意識した事などあれば教えていただけますか?今後の個人開発に生かせればと考えています。

Jun-TJun-T

ありがとうございます!!

Appleの審査はデザインガイドライン違反で一度リジェクトされました。
具体的にどの部分が違反しているか詳細は記載されていませんでしたが、文字サイズ・色のコンストラスト比などを調整して再提出してみたところパスできました。
その工程もAppleのガイドラインをClaudeに渡して修正してもらったので、特に大きな手間ではなかったです!