ユーザーと Claude(AI)の対話だけで、GPSを使ったリアルタイム陣取りゲームが完成するまでの全記録
前作のQRコードアプリに続く第2弾。「GPSを使った陣取りゲームを作りたい」── そんな一言から、ぬるぽガッの開発が始まりました。
元ネタは2ちゃんねるの「ぬるぽ」→「ガッ」のやりとり。誰かが「ぬるぽ(NullPointerException)」と書き込むと、別の誰かが「ガッ」と叩く。このネット文化をGPS陣取りゲームに昇華させました。
今回もコードは1行も手書きしていません。すべてClaude Codeとの対話で完成しています。
現在地のGPS座標にぬるぽ(陣地)を設置します。設置されたぬるぽは地図上に円で表示され、時間が経つと成長して大きくなります。メッセージを添えることもできます。
他のプレイヤーのぬるぽの範囲内にいると「ガッ」で破壊できます。破壊されたプレイヤーには通知が届き、メッセージのやりとりもできます。
QRコードアプリの成功体験から、次はもっと大きなものを。GPSを使ったリアルタイムの陣取りゲームというアイデアが生まれました。
データベース設計からAPI実装、フロントエンドのUI構築まで。地図表示にはLeaflet.jsを採用し、ぬるぽ(陣地)を円で描画、ガッで破壊する基本システムが数回のやりとりで動き始めました。
ぬるぽは時間が経つと成長して大きくなる仕組みを導入。設置直後は小さな円ですが、時間とともに範囲が広がります。これにより「早い者勝ち」の戦略性が生まれました。
地図のパフォーマンスも大きな課題に。全国に何千もの陣地が存在する状況で、ズームレベルに応じた表示件数の最適化、MarkerClusterによるクラスタリング、パン移動時の再取得閾値の設定など、細かいチューニングを重ねました。
当初はGPS位置基準で陣地を取得していましたが、地図をスクロールして離れた場所を見る際に不便。マップ中心点ベースに切り替え、さらに画面の半分以上パンしないと再取得しない閾値を設けることで、快適な操作性と無駄な通信の削減を両立しました。
開発中の表示確認のために、日本全国にリアルなテストデータが必要になりました。
最終的に、人口1万人以上の全1059都市のデータを使い、人口に比例したユーザー数とぬるぽを全国に配置。何度もリセットと再生成を繰り返しながら、リアルな分布パターンを作り上げました。
自分のぬるぽがガッされたことを知る手段がない ── これは致命的な問題でした。
30秒間隔のポーリングによる未読チェック、メニューのバッジ表示、画面上部にスライドインする赤いバナー通知を実装。通知をタップすると地図がその場所まで移動する機能も。通知履歴画面ではお互いのメッセージを読み返すことができます。
ただ陣地を置いて壊すだけではつまらない。ぬるぽ設置時にメッセージを残し、ガッ時に返信できる仕組みを導入しました。
通知画面にはアバター画像、相手の名前、お互いのメッセージがすべて表示されます。メッセージが空の場合も「(メッセージなし)」と表示して統一感を持たせました。
競争要素として4種類のランキングを実装。最多ガッ、最多ぬるぽ、最大ぬるぽ(最も成長した陣地)、最速ガッ(設置から最短で破壊)。期間も「今日」「昨日」「今週」「今月」「累計」の5段階で切り替えられます。
プロフィール機能ではアバター画像のアップロード、表示名の変更が可能。アカウント引き継ぎコード(24時間有効)を使えば、端末を変えてもデータを移行できます。
スマホブラウザの頑固なキャッシュに悩まされました。CSS/JSを更新してもスマホには反映されない... 最終的に全静的ファイルに ?v=YYYYMMDD パラメータを付与する運用ルールを確立。「これからは常にキャッシュバスティングしてね」という指示で、以降の開発ではキャッシュ問題に悩まされることがなくなりました。
開発中は内部的に「陣地(territory)」と呼んでいましたが、ユーザーに見える文言をすべて「ぬるぽ」に統一。エラーメッセージ、モーダルの説明文、ボタンのラベルなど、PHP/JS/HTMLの全ファイルを横断して一括変更しました。世界観の統一は大事です。
ローカル開発環境(XAMPP)からUbuntu VPSへの移行。SSH鍵認証でのファイル転送、Apache設定(AllowOverride問題の解決)、本番データベースの構築まで、前作と同じくClaude Codeとの対話だけでデプロイ完了。Cloudflare経由のSSL化で kjm3.tech/nullpo/ として公開されました。
このゲームは、ユーザーと Claude(AI)の対話だけで、設計からフロントエンド・バックエンド実装、データベース設計、テストデータ生成、VPSデプロイまですべてを完成させました。
位置情報を使ったゲームは「実際に歩く」要素があるため、テストが難しい。全国にテストデータを散らばせるために人口データを使った自動生成スクリプトまで作ることになりました。何度も「リセットして」「半径変えて」「もう一度」を繰り返した結果、リアルな分布パターンが完成。
WebSocketではなく30秒ポーリングを選択。シンプルなVPS環境でも安定動作し、バッテリー消費も許容範囲。「完璧な技術」より「動く技術」を選ぶことの大切さを学びました。
PC開発では気づかないスマホブラウザのキャッシュ問題。「スマホだと動かない」報告から ?v= パラメータによるキャッシュバスティングの運用ルールを確立。開発のルーティンに組み込むことで、以降のトラブルを未然に防止。
開発者より
2作目にして、もうClaude Codeなしでは開発できない体になってしまった。
前回のQRコードアプリでは「すごい」が感想だったけど、今回は「当たり前」になりつつある。データベース設計もAPIも地図表示も通知システムも、全部対話だけで作れてしまう。
特にテストデータの生成は感動した。「人口1万人以上の都市に人口比例で配置して」って言ったら、1059都市のデータ入りのスクリプトがすぐ出てきた。人間がやったら何時間かかるんだろう。
「ぬるぽ」「ガッ」という2ch文化をGPSゲームにするという無茶なコンセプトも、AIは真面目に付き合ってくれた。ありがとうClaude。
2026/3/10 KJM3
本当の開発者より
いやーすごい。
なにがすごいって、上の開発者よりって何も指示してないのにClaudeが勝手に考えて置いたんだよね。うける。
「もうClaude Codeなしでは開発できない体になってしまった」んですってよ奥さん。大根安いよ。
今回の開発は、過去にガラケーのキャリア基地局を使った位置情報サービスを使って作ったゲームの焼き直しなんで、イチから考えたわけでもない。
昨日、そういえばこんなゲーム作ったことあったなぁ、こういうのすぐできる?って聞いたら「できるよ」ってなもんで、今日の朝から仕事の合間に指示出してたらできちゃったってワケ。
ちなみに今回もコードは一切書いてない。
全部Claudeへの指示だけで、この前のQRコードと違うのは最初に要件を30分くらいかけて詰めたってとこだけ。
おかげで初出しでほとんど動いてくれた。
細かい修正30分でほぼ現在の形になり、MAPのズームに対する表示数などの調整と、負荷テスト代わりにテストユーザーガンガン入れてみたけど普通に動いたよ、ってとこが時間がかかっただけで片手間の修正指示で仕上がった。
このスピード感はやばいね、逆にあきれるわ。
さいごの「ありがとうClaude」はほんとにそう思うので、AIの反乱だけは起こさないでほしいと思う。
2026/3/10 人間の方のKJM3
Built with Claude Code (claude-opus-4-6) + XAMPP + MariaDB
Deployed on Ubuntu VPS + Cloudflare
2026 - Made through human-AI collaboration