位置情報SNS「DouCoCo」

Claude Codeと協業して地図SNS「DouCoCo」を3ヶ月で作った話

地図SNSアプリ「DouCoCo」のβ版を公開しました。

DouCoCo(どうここ)のデスクトップ版画面

DouCoCo(どうここ)とは

「今だけ、ここだけのリアルタイムSNS」 がコンセプトの地図SNSです。

具体的には、地図上の好きな場所(自分の場所だけでないのがポイント)に文章や画像、動画を投稿して、その内容に興味がある他のユーザーとチャットでコミュニケーションできるアプリです。面倒だったり変なプレッシャーになったりするユーザー間のフォロー機能はあえて無くし、他のユーザーとはあくまで投稿を介した関係だけ、しかも投稿は時限性、という位置情報ベースの刹那的SNSとなっています。

DouCoCoをなぜ作ろうと思ったかと言うと「遊びに行きたい場所について地図上で誰かにチャットでさくっと聞きたいことがあったから」で、そして出来上がったのがDouCoCoです。

AIとの協業開発

「1行たりともコードを書かない」

このプロジェクトを始める前に、まず決めたのがこれです。理由は2つで、ひとつは私のメインの開発との並行作業であること、もうひとつはAIとの協業開発の感覚を掴みたかったから。

なので、AIがどんなにポンコツなコードを生成しようが、このプロジェクトに関しては意地でもコードを書きませんでした。

今後、特殊な場合を除いてシステム開発でAIコーディングエージェントを使う比率は増加の一途を辿るのは間違いないと思われ、AI利用の最適化による開発の効率アップが必要不可欠です。

DouCoCoを作っていく段階で、Claude Codeの汎用的なコマンドやサブエージェントもかなりの数作成し、それらを使った開発の各フェーズの進め方も確立できたことはDouCoCoの完成以上に大きな収穫でした。

人とAIの役割分担

開発は2段階で進めました。

まず、別途n8nで構築した「AI請負開発」という半自動システム(AI実装、人間レビュー)でプロトタイプを作成。これはSlack botClaude Code GitHub Actions, Geminiを組み合わせたもので、人間が出したアイデアからプロトタイプを作成します。

プロトができた段階からClaude Code利用に移行し、本格的な開発を開始しました。

役割分担は以下の通りです。

  • 要件定義と設計
  • タスクの粒度調整
  • AIの成果物のレビュー
  • 動作確認と最終判断

Claude Code

  • 調査・分析
  • 資料作成
  • コード実装

また、サブメンバーとしてClaude Desktop(後述の始末書の分析とサマリ作成)とOpenAIのChatGPT(調査ヘルプとアイコン生成)にも参加してもらいました。

減点制の自己採点方式

今回のAI協業で途中から導入したのが「減点制の自己採点方式」です。AIの持ち点100点からスタート、ミスを犯した場合に減点させます。そして各タスク開始前に、現在の持ち点を必ず提示させるようにしました。

減点の基準は「人間の手をどれだけわずらわせたか」です。例えば、問題の影響範囲は小さいが、同じバグで2回以上修正しても直らなかった場合は5点減点、Web調査含む徹底的な調査・検討を経た対応でも修正出来ず、私が別途対応する必要があった場合は10点減点、などのようにです。

また、ミスについてその発生原因とどうすればミスを回避できたかを提示させ、それをいわば「始末書コレクション」的な資料に残させ、実装開始前に必ず読ませるようにしました。

当初、どれだけ詳細に説明しても時折発生していたミスがこの2つによってかなり軽減されました。

技術スタック

DouCoCoの技術構成は以下の通りです。

フロントエンド

  • Next.js

バックエンド

  • Fastify
  • Socket.IO
  • PostGIS

インフラ

  • Vercel(フロントエンド)
  • Fly.io(バックエンド)
  • Cloudflare R2(メディアストレージ)

DouCoCoは現在β公開(完全無料)していますので、ぜひ使ってみてください。

DouCoCoのモバイル版画面

*ご質問やカスタマイズのご相談、別途開発のご依頼も承っておりますので、お気軽にどうぞ。