Go to Qiita Advent Calendar Top
LoginSignup
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

@ninoko1995(ninoko 1995)

週末にAIを使い倒して、アプリの企画・開発・リリース・マーケティング・記事作成までをまるっと行ってもらった話

Posted at

この記事に関して

久しぶりにまとまった時間が取れたので、自分で何か一個WEBアプリでも作ってみようと思い作ってみました。
せっかくなのでAI Agentを駆使して、自分では何も考えずにできるところまでできたらいいなぁというスタンスで行うことを決め、「何を作るか」の相談からAI Agentと一緒に行いました。
こちらからは相談をしただけで、全てをAI Agentに考えてもらいました。
実際にどんな感じでやり取りをしてどんなものが出来上がったのか、を楽しんでもらえればと思います。

使用技術

  • 企画段階からの全てを担ってくれたAgent: Gemini
  • コーディング用Agenet: Claud.ai
  • アプリのアイコンなど画像作成: ChatGPT

流れ

企画の相談

こちらからの提示情報

  • 「本業と別に年300万ほどの追加収入になるくらいの個人開発SaaSを作りたい」という目的
  • 「自分の趣味に関連した物の方がとっつきやすい」という作るものの条件と、現在の趣味

Geminiからの提案

  • 前提として、個人開発をするのであれば、ニッチな市場で勝負するしかない
    • 株式投資: 周りが強すぎる
    • ウィンタースポーツ: 個人のWebアプリで解決できる部分が小さすぎる
    • ポーカー: 学習なら隙間がありそうじゃない？
  • ポーカーの深掘り
    • 学習系、ポーカーアプリ系は競合が多いし強い
    • 「ライブポーカーでのスタッツ管理」って、スキマじゃない？

アプリの詳細

Geminiからの提案

  • アプリのデザインテーマ
  • 具体的な機能
  • MVPとして提供する機能と将来的に追加する機能の優先順位付け

開発方針の策定

こちらからの提示情報

  • 自身の技術スタック

Geminiからの提案

  • 個人で開発するのであれば、コスパ重視で絶対のスマホアプリよりもWEBアプリ
  • コスパよく実装するための技術構成も決めてくれた

開発開始

Geminiに、claudeに読み込ませて実装させるための仕様・要件・実装方針をまとめた文書を作成してもらい、claudeにコーディングを依頼。
動く状態になったら自分で触ってみて使用感やFBをgeminiに伝え、その都度それをclaudeに改善・修正させるためのプロンプトをgeminiに作成してもらい、それをそのままclaudeにコピペ。
これを繰り返してアプリを作成してくだけ。

デプロイ

Geminiが提示してくれた技術スタックを用い、Geminiが出力してくれた手順に従って各種サービスへの登録などを行い、Geminiが出力してくれたコマンドを実行するなどしてデプロイ完了

実際にできたものがこちら > Live HH (Live Hand History)

G6fGf-jbcAACvOT.jpeg

G6fGpo4aQAAbrU0.png

G6hBKApagAAQEbF.png

G6fGkHKaQAAxYk7.jpeg

G6fGuisbAAAyvYY.png

マーケティング

Twitterアカウントを作成し、Geminiが提示してくれた通りのプロンプトを用いてChatGPTに出力させたiconおよびヘッダー画像と、Geminiが提示してくれた通りのbioを、Twitterアカウントに設定。
その後、Geminiの投稿戦略に沿って幾つか投稿を行い、Geminiが提案した通りの方法で検索して出てきたアカウントをフォローしたり投稿にいいねを押したり。

実際に作ったアカウントがこちら > https://x.com/live_hh_poker

記事作成

最後に、ここまで相談したすべての流れをqiitaの記事にして、と言って、以下の記事を作成してもらった。

【個人開発】「年間300万円」を稼ぐために、ニッチなポーカーアプリを爆速で作ってマーケティングまで考え抜いた話 (Nuxt 3 + PWA)

本業とは別に、年間300万円（月25万円）の収益を作る。
そのために「労働集約型（時間の切り売り）」ではなく、「資産型（ツール開発）」 で挑戦することにしました。

今回開発したのは、アミューズメントカジノ（アミュカジ）専用のポーカー戦績管理アプリ 『Live HH (Live Hand History)』 です。

🔗 Live HH (ブラウザで開く)

この記事では、「なぜこのニッチを選んだか（企画）」から、「あえてDBを捨てた技術選定（開発）」、そして 「Twitterでのゲリラ戦（マーケティング）」 までの一連の流れを共有します。

1. 企画：なぜ「ライブポーカー」なのか？

きっかけは「時給労働の限界」

過去に時給単価の高い副業をしていた時期がありましたが、「自分が動かないと稼げない」ことに限界を感じました。
そこで、エンジニアのスキルを活かして、「自分が寝ていても価値を生むSaaS（マイクロサービス）」 を作ることにシフトしました。

市場の選定：「競合がいない場所」を探す

ターゲットにしたのは、近年日本で盛り上がっている 「ポーカー（テキサスホールデム）」、特に店舗で遊ぶ 「ライブポーカー」 です。

  • オンラインポーカー: HUD（Head Up Display）という強力なツールがあり、データ分析が当たり前。
  • ライブポーカー: データがない。すべてが「記憶」頼み。

ここに強烈なペイン（課題）を見つけました。

「今日は我慢してタイトに打ったつもりなのに、なぜか負けた」

人間の脳は都合よく記憶を改ざんします。
現場の「退屈」に負けてゴミ手で参加したことを忘れ、運のせいにしてしまう。
これを解決する 「ライブポーカー専用のポケットHUD」 があれば、自分の実力向上に対するガチ勢には刺さるはずだと仮説を立てました。

2. 要件定義：現場で使えるものだけ残す

アミュカジの現場は忙しいです。ハンドが配られてから終わるまで、悠長にスマホを操作している暇はありません。
「機能」よりも「UX（体験）」 を最優先に削ぎ落としました。

✅ 実装した機能

  • VPIP（参加率）のリアルタイム計算: 自分のプレイスタイルを可視化。
  • WTSD / WSD の算出: 「降りなさすぎ」「勝ちきれてない」を分析。
  • ワンタップ記録: 「参加」「降り」「勝ち」「負け」を直感的に入力。

❌ 捨てた機能

  • 詳細な金額管理: チップを数えるのが面倒なので廃止。
  • フロップ以降のボード記録: 入力コストが高すぎるので廃止。
  • ユーザー登録: 使ってもらうハードルになるので廃止（後述）。

3. 技術選定：あえて「DB」を捨てる

開発スピードとランニングコスト（コスパ）を極限まで追求しました。

Tech Stack

  • Framework: Nuxt 3 (Vue 3)
  • UI Library: Tailwind CSS
  • State Management: Pinia + VueUse
  • Platform: PWA (Progressive Web App)
  • Deploy: Vercel

重大なピボット：Supabase → LocalStorage

当初は Supabase (PostgreSQL) でユーザー認証とデータ保存を行う予定でした。
しかし、「MVP（実用最小限の製品）において、ログインは最大の離脱要因である」 と判断し、構成をガラッと変えました。

  • Before: ユーザー登録必須、データはクラウド保存。
  • After: 登録不要、データは LocalStorage に保存。

@vueuse/core の useStorage を使うことで、Piniaのステートを自動的にローカルストレージと同期させています。
これにより、「URLを開いて1秒で使える」「電波の悪い地下のカジノでも爆速」 という最強のUXが実現しました。

// composables/usePokerStore.ts
import { defineStore } from 'pinia'
import { useStorage } from '@vueuse/core'

export const usePokerStore = defineStore('poker', () => {
  // useStorageでラップするだけで永続化される
  const tables = useStorage('live-hh-tables', [])
  const hands = useStorage('live-hh-hands', [])

  // ...actions
})

4. UIデザイン：情報の「階層」を作る

スマホの狭い画面で、パッと見て状況を把握できるように工夫しました。

カラーコーディングの徹底

「文字」ではなく「色」で脳に訴えかけるデザインにしました。

  • 🟢 WIN (勝利): 緑
  • 🔴 LOSE (SD負け): 赤
  • 🔵 FOLD (途中降り): 青（アクションはしたが降りた）
  • ⚫ FOLD (不参加): グレー（ノイズとして背景に馴染ませる）

分析画面のグラフ

ライブラリ（Chart.jsなど）を使わず、SVGで自作しました。
「適正ゾーン（VPIP 20-30%）」を緑の帯で可視化することで、ユーザーが目指すべき場所を直感的に示しています。

5. マーケティング戦略：どうやって広めるか？

作っただけでは誰も使いません。ここからが本番です。

Twitter (X) 戦略

ターゲット層（ポーカープレイヤー）はTwitterに生息しています。

  1. アカウント設計: 「開発者自身もポーカープレイヤーであり、悩みを解決するために作った」というストーリーを発信。
  2. 検索ハック: 「アミュカジ」「ポーカー負けた」などで検索し、困っているユーザーを見つける。
  3. ドッグフーディング: 実際に店舗に行き、リザルト画面を投稿。「これを使うと勝てる」という実績を見せる。

啓蒙のアングル

単なる機能紹介ではなく、「なぜ数字が必要なのか」 を説きます。

「痩せたいなら、まずは毎日体重計に乗ること。ポーカーも同じで、自分のスタッツ（体重）を知らないと改善できない」

こういった例え話を用いて、潜在層にアプローチしています。

6. マネタイズ戦略：まずは「依存」させる

現在は完全無料・広告なしで公開しています。
これには戦略があります。

  1. Step 1 (今): 無料で配りまくり、ユーザーのスマホ内に「自分の戦績データ」を蓄積させる（データを人質にする）。
  2. Step 2 (将来): データが溜まって「消えたら困る」状態になったタイミングで、「クラウドバックアップ機能（有料）」 を提供する。

最初から課金実装をする工数をカットし、まずはユーザー数を最大化することにリソースを全振りしました。設定画面にはこっそり「現在はベータ版です」と記載し、将来の有料化への布石を打っています。

まとめ

「自分の欲しいものを、最速で作る」
個人開発の醍醐味はこれに尽きます。

  • 企画: ニッチだが熱狂的な市場を選ぶ。
  • 開発: ログイン機能を捨ててでもUXを優先する。
  • 運用: 自分がヘビーユーザーになり、共感で広める。

この『Live HH』が年間300万円の収益を生むかどうかはこれからの運用次第ですが、少なくとも 「自分がアミュカジで勝つための最強の武器」 は手に入りました。

もしポーカーをやる方がいれば、ぜひ使ってみてください！

📱 Live HH(Live Hand History)
https://live-hh.vercel.app

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?