▼前回の記事はこちら
前回の記事で画像生成→ゲーム化を試みた「ミニ農場ゲーム」。
画像1枚からゲームを作るなど、そう簡単にできるわけもなく失敗してしまいました。
ですが私、農園ゲームは大好きで、ゲーム開発するならば一度は作りたいジャンルの一つです。
そこで今回は、丁寧にアセット作りからゲーム制作をチャレンジしてみることにしました。
制作の目的
制作の目的は、第8作品として作ったミニ農場経営ゲームをもとに、見た目と遊びやすさをパワーアップすること。
今回は、最初から背景、畑、作物、プレイヤーなどの画像素材を自分で作成して、ゲーム画面の完成度を上げることを重視しました。
やったこと
1. 画像素材を使った農場画面
前回Codexが作ったイメージ画像をもとに画像生成を行いました。
作った画像は
- 背景
- 乾いたプランター（畑）
- 湿ったプランター（水やり後）
- 作物3種類×3パターン（芽→成長中→収穫可能）
- プレイヤー
- HUD
2. 画像の微調整
作成したアセット素材をゲーム内に差し込んでみたものの、位置がズレまくっているので、コードを見ながら微調整をとても頑張りました。
ＨＵＤ素材も作ってありましたが、Ｃｏｄｅｘの描画のほうがしっくりきたので、枠は描画しています。
描画もアセット素材同様に微調整を行いました。
工夫したこと
今回の工夫はなんといってもアセット素材を作ったことです。
とくに野菜作りは工夫しました。半分土の中に埋まっているからです。
だから「トマトをのイラストを作って」では出力できない。
なので、
畑ごと生成→野菜部分だけ再生成→透過処理→サイズ調整 ひたすらこれを繰り返していきました。
アセット素材以外ではこんな感じです。
- ショップで種を買えるようにした
- 畑に種を植えられるようにした
- 水やりで作物が成長するようにした
- 成長した作物を収穫してお金を得られるようにした
- 1日ごとの決算画面を表示した
- 10日間で終了するテストモードを作った
- HUDだけ描画を重ねた
それから今回描画はしない予定だったのですが、HUD素材だけは描写で対応しました。
アセット素材がいまいちだったことと、むしろ前回Codexが書いたHUD枠（木枠風パネル）だけは気に入っていたからです。
4. 追加プランターの改善
最初の仕様では、追加プランターが画面右側へ伸びて、屋上ではなく空の上に出てしまった。
これを直すため、追加プランターの最大数を8個にし、追加分は屋上内の下側に2つだけ横並びするように変更した。
- 最大プランター数を10個から8個へ変更
- 追加プランター専用の位置を設定
- 追加プランター同士の間隔も専用定数で調整できるようにした
5. 黄色い選択ハイライトの削除
プレイヤーが畑に近づくと、選択中のプランターが黄色い透明の四角で表示されていた。
見た目として不要だったため、判定処理は残したまま、表示だけ消した。
- 操作判定は維持
- 黄色い透明の選択表示だけ非表示
今回学んだこと
表にまとめてみました（ＡＩにまとめてもらいました）
| 概念 | 内容 |
|---|---|
Vector2(x, y) |
2D画面での横方向と縦方向の数字。xは横、yは縦 |
| X座標 | 数字を大きくすると右へ、小さくすると左へ動く |
| Y座標 | 数字を大きくすると下へ、小さくすると上へ動く |
position |
部品の位置。多くの場合、左上や中心の場所を表す |
size |
部品の大きさ。横幅と高さを表す |
offset |
基準位置からどれだけずらすかを表す数字 |
const |
何度も使う固定の数字や設定を、名前つきで置いておくもの |
| HUD | 画面上に常に出る情報表示。日数、所持金、時間など |
| ヘッドレス起動 | Godotの画面を開かず、エラーなく読めるか確認する起動方法 |
| コード描画 | 画像を使わず、プログラムで四角や線を描いて見た目を作る方法 |
自分自身で画像を作ったり、数字を動かしたりするにあたり、色々な用語が頭の中にすこしだけ入ってきました。
反省点
反省点は、屋上を舞台にしてしまったところから始まっていたのかもしれません。
畑は四角なのに、ビルは四角じゃなかった。
配置するまで気づきませんでした。
まさか斜めになっていたなんてこと。
よくよく考えればそうなんですけれども・・・・
（作り直す気力は沸きませんでした）
振り返り
今回一番大きかった学びは、ゲームの見た目は「画像を入れるだけ」ではなく、画面全体の雰囲気に合っているかを見る必要があるということ。
HUDやメッセージ欄は、きれいな画像素材であっても、背景や畑やキャラクターと雰囲気が違うと浮いて見える。そこで、コード描画に変えることで、画面全体のピクセルアート感に寄せることができました。
また、自分で数字を変えて位置調整できるようになった、この経験も大きなものです。
「これは今後のゲーム制作でも使える重要な前進である」
AIからもこのような言葉をいただきました。
未作業・今後やってもよいこと
- 画面サイズを小さくして、ノートPCでも全体が見やすい版を作る
- ショップ画面と決算画面の紙パネルも、コード描画または統一素材にする
- 収穫時や購入時の効果音を追加する
- 完成版としてバックアップフォルダを作る
評価
※Codexによる評価です
- 完成度：高い。農場経営ゲームとして一通り遊べる
- 学習効果：高い。
Vector2、位置調整、UI、コード描画を学べた - 制作実感：高い。自分で数字を変えて見た目を整える段階に入れた
次の作品に活かすこと
- 画像素材とコード描画を、画面の雰囲気に合わせて使い分ける
- 画面サイズは、実際に自分のPCで見やすいかを早めに確認する
- 見た目の違和感は、小さくても完成度に大きく影響するので早めに直す
