GeoGainer開発 技術ケーススタディ

GeoGainerは、友人とブラウザで遊ぶために開発したオンライン・ターン制ボードゲームです。このケーススタディでは、プロダクト改善、フロントエンド、ゲーム状態、Cloudflare、Bot用DSL、AIエージェントとの開発プロセスを扱います。

執筆中

各章を人間の言葉で執筆しながら、完成した章から順次公開しています。

公開中の章

第2章　プロジェクトの目的とゲーム概要

離れて暮らす友人と遊ぶために開発を始めた理由、カタンに感じた魅力、Botや8人対応へ発展した背景を振り返ります。

第4章　UX、Canvas、スマートフォン

DOM、Canvas、React Konvaを理解し直し、SVGという選択肢やAIエージェントによるUI検証、スマートフォンでの性能改善を振り返ります。

第12章　AIエージェントとの開発プロセス

開発終盤でGitHub ProjectとIssueを導入し、ChatGPTの設計・承認とCodex / Cursorの実装を分けた理由と、現在の運用を説明します。

このケーススタディで伝えたいこと

• AIエージェントを使いながら、人間がどの判断を担ったか
• 実際に遊んで見つけた問題を、どのように改善したか
• 複雑なゲーム状態を、どのように保存・同期・検証したか
• 成功だけでなく、誤った仮説と方針転換から何を学んだか

執筆予定

分野	主な内容
プロダクト	ゲーム概要、UX、テストプレイからの改善
フロントエンド	React、React Konva、スマートフォン、性能改善
ゲームエンジン	GameState、純粋な状態遷移、六角形座標
サーバー	Cloudflare Workers、Durable Objects、WebSocket、認証
Bot	GGBSL、パーサー、AST、型検査、評価器
開発プロセス	AIエージェントとの分担、テスト、失敗と改善

本番サービス

実際のゲームはGeoGainerで確認できます。