はじめに
未経験からエンジニア転職を目指して学習中の者です。今回、超ミニ4X(シヴィライゼーション風のターン制経済シミュレーション)ブラウザゲーム「小さな帝国」を作りました。
- サービスURL:https://satou20250828.github.io/micro-empire/
- リポジトリ:https://github.com/Satou20250828/micro-empire
この記事はその開発過程を振り返る連載の第1回です。全8回を通して、企画から要件定義・設計・実装・テスト・トラブルシューティング・振り返りまでを、実際のIssueやPRを引用しながら記録していきます。
| 回 | 内容 |
|---|---|
| #1(本記事) | 企画・課題発見 |
| #2 | 要件定義 |
| #3 | 設計(技術選定・状態設計・アーキテクチャ) |
| #4 | 開発①ゲームロジック実装編 |
| #5 | 開発②UI・画面実装編 |
| #6 | 開発③テスト・CI/CD構築編 |
| #7 | 開発中に遭遇した技術的問題 |
| #8 | 完成・振り返り |
なぜこのテーマを選んだのか
1年前の自分と、今の自分を比べるために
プログラミングを始めたきっかけは、とある学習系の記事を読んだことでした。当時、初めて自分の手で作り上げたプログラムは、テキスト版の五目並べでした。標準入出力だけで完結する、座標を打ち込んで石を置くだけの簡単なプログラムです。
0 1 2 3 4 5 6 7 8 9
+------------------------------+
0| - - - - - - - - - - |
1| - - - - - - - - - - |
...
あなたの番です。座標を入力してください
>
それから約1年が経ち、今の自分がどれくらい成長できているのかを、自分自身で確かめられる作品を作りたいと考えました。ただ動くものを作るのではなく、1年前には作れなかった規模・複雑さのアプリに挑戦することを、このプロジェクトの出発点にしています。
なぜCivilization風なのか
題材に選んだのは、以前から思い入れのあるCivilizationです。限られた資源をどう使うか、どの技術を選ぶか。自分で考えて戦略を組み立てていくところに面白さを感じていました。
五目並べは「1つのルールで完結するシンプルなゲーム」でした。それに対してCivilization風のゲームは、盤面・資源・テックツリー・勝敗判定など、複数の要素が互いに影響し合う状態管理が要求されます。この「連動する仕組み」を自分の手で設計・実装できるかどうかが、1年前の自分と今の自分を隔てる一番わかりやすい物差しになると考え、このテーマに決めました。
何を作ったか(概要)
5×5マスの盤面で、自都市とCPU都市がそれぞれ2体の労働者を動かし、食料・生産力・金の3資源を稼ぎ合うブラウザ完結ゲームです。戦闘要素はなく、CPUは同じ盤面で資源を稼ぎ合う競争相手という位置づけにしています。3系統×5段階、計15技術のテックツリーをすべて解放するか、資源合計が難易度別のしきい値に到達すると勝利になります。
技術的には、Vite + Vanilla JS(フレームワークなし)でフロントエンドを組み、Git Flow・Issue駆動開発・CI/CD(GitHub Actions)を使って開発しました。具体的な要件・機能の詳細は次回(#2 要件定義編)で扱います。
この連載で書かないこと
「AIにすべて作らせた」という誤解を避けるため、あらかじめ書いておきます。本プロジェクトはAnthropicのAIコーディングエージェント「Claude Code」を活用して開発していますが、何を作るか・なぜ作るか・どの設計を採用するかという判断はすべて自分自身で行っています。実装作業をAIに任せる一方で、判断を丸投げにしないための工夫についても、連載の中で触れていきます。
次回予告
次回(#2)は要件定義編です。ゲームの中核ルールが3段階で作り変わった経緯と、MVPから外した機能について書きます。