未経験からGodotで始める自作ゲーム開発【2日目】

AI Assisted
この記事は筆者の実装経験をもとに実装コードをベースで執筆し、AIによる校閲・推敲を経て公開しています。

はじめに：今日は「ステージ」を作る

1日目で環境構築とHello Worldまで完了しました。 今日はテトリスの**「盤面（ボード）」**を作っていきます。

テトリスといえば、横10マス × 縦20マスのフィールド。 これをGodotでどう表現するか？ 方法はいくつかありますが、今回は2Dゲームの王道機能である**「TileMapLayer（タイルマップレイヤー）」**を使います。

---

1. シーンの整理と素材準備

シーンの作成

まずはプロジェクトの整理から。 前回作った node_2d.tscn は練習用だったので削除し、新しく本番用の Main シーン を作成しました。 （※Godotではシーンパネルのノードを消しても、ファイル自体は残るので安心です）

素材の用意

次に、「ブロック」の素材を用意します。 今回は 32px × 32px の白い正方形の画像 (block.png) を用意し、プロジェクト内の assets フォルダに配置しました。 Godotは白い画像を用意しておくと、後でプログラムから好きな色（赤や水色）に着色できるので便利だそうです。

---

2. 図解：TileMapLayerってなに？

これから使う 「TileMapLayer」「TileSet」 と 「画像」 の関係は、お絵かきに例えると分かりやすいです。

作業の流れ：

1. 素材を用意する（絵の具を買う）
2. TileSetを設定する（パレットに出す）
3. TileMapLayerに描く（キャンバスに描く）

ちなみに TileMap という古い情報が出てくることがありますが、Godot 4.3以降は TileMapLayer が推奨されています。Photoshopのレイヤーのように扱えるため、管理がとても楽になっています。

---

3. ステージを描く

それでは実際に作っていきます。

手順

1. ノードの追加: Main シーンに TileMapLayer（キャンバス）を追加。

1. TileSet（パレット）の設定:
   • ここが重要です。インスペクターの <空> となっている「Tile Set」をクリックし、「新規 TileSet」を作成。
   • 重要： 「Tile Size」を画像のサイズに合わせて 32 x 32 px に設定します。

1. 画像の読み込み:
   • 下に出てきた「タイルセット」パネルに、さっきの block.png をドラッグ＆ドロップ。「はい（自動作成）」を選びます。

これで、マウスクリックで画面にブロックを描ける状態になりました！

お絵かきタイム

画面上にテトリスの枠組みを描いていきます。

• フィールド: 横10マス × 縦20マス
• 壁: その周囲を囲む

マウスでポチポチとクリックして描いていきます。お絵かき感覚で楽しい作業です。 描いたあと、ツールバーの「移動モード」を使って、枠組みを画面の中央に配置しました。

---

4. AIにコードを書かせてみる

見た目はできましたが、ゲームとしては「どこが壁で、どこが空き地か」をデータとして知っておく必要があります。 ここで AI駆動開発 の出番です。Claude Codeを使って、盤面を管理するスクリプトを書いてもらいました。

私からの指示:

Godot 4 (GDScript) でテトリスの盤面を管理する board.gd というスクリプトを書いて。 TileMapLayerを継承して、定数 COLS=10, ROWS=20 を定義。 盤面の状態を管理する2次元配列 grid を用意して、_ready() で初期化して。

AIが生成したコード（抜粋）:

# board.gd
extends TileMapLayer

# 盤面サイズ
const COLS: int = 10
const ROWS: int = 20

# セルの状態
enum Cell { EMPTY = 0, WALL = 1, BLOCK = 2 }

# 盤面データ（2次元配列）
var grid: Array = []


func _ready() -> void:
	_init_grid()
	print("盤面データを初期化しました: %dx%d" % [COLS, ROWS])


func _init_grid() -> void:
	grid = []
	for y in range(ROWS):
		var row: Array = []
		for x in range(COLS):
			row.append(Cell.EMPTY)
		grid.append(row)


# 指定座標のセル状態を取得
func get_cell(x: int, y: int) -> int:
	if x < 0 or x >= COLS or y < 0 or y >= ROWS:
		return Cell.WALL  # 範囲外は壁扱い
	return grid[y][x]


# 指定座標にセル状態を設定
func set_cell_state(x: int, y: int, state: int) -> void:
	if x >= 0 and x < COLS and y >= 0 and y < ROWS:
		grid[y][x] = state

これを TileMapLayer ノードにアタッチして実行すると、出力ログに 「盤面データを初期化しました」 と表示されました。 これで、裏側でデータの準備（ゲームの脳みそ）が整ったことになります。

Memo: GDScriptってなに？

今回使った言語は GDScript（ジーディスクリプト） と言います。 Pythonによく似た文法で、Godot専用に作られたプログラミング言語です。

• Pythonっぽい: インデントでブロックを表現するので読みやすい。
• Godot専用: extends TileMapLayer や Vector2 といったゲーム制作に必要な機能が最初から組み込まれています。
• ファイル: 拡張子は .gd で保存されます。

---

コラム：Godotの「シーン」って結局なに？

開発中に「シーン」という言葉が何度も出てきましたが、これはGodotの最重要概念です。 一言で言うと、**「ゲームの部品をひとまとめにしたパック」**です。

Godotでは、タイトル画面も、マリオのようなキャラも、ステージそのものも、すべて「シーン」として作ります。

Webエンジニア向けの直感的な理解

もしReactやVue.jsの経験があるなら、「Godotのシーン ＝ Webのコンポーネント」 と考えると一発で分かります。

今回は親コンポーネントである Main シーンを作りました。次回作る「ブロック」は、子コンポーネントとしてここに配置することになります。

---

今日の成果物（ファイル構成）

Hello World用のファイルは削除し、テトリス用にフォルダ構成を整理しました。

godot-tetris-practice/
├── .godot/              # 内部キャッシュ（Git除外）
├── assets/
│   └── block.png        # 追加：32x32 白ブロック画像（着色用）
├── scenes/
│   └── main.tscn        # 追加：メインシーン（TileMapLayer配置済み）
├── script/
│   └── board.gd         # 追加：盤面データ管理用スクリプト
├── project.godot        # プロジェクト設定
└── icon.svg             # アプリアイコン

---

次回の目標

今日はステージ（箱）を作りました。 次回は、いよいよ**「テトリミノ（ブロック）」**を作成し、ボタン操作で動かすところまで進めます！