マガジン

ゲームの背景画像をAIで作る:遠景・中景・近景の分け方

遊びをつくる

執筆にClaudeを使用しています。

同じ色と視点でそろえた木、宝箱、キツネの素材を、色鉛筆で描いたイラスト。
記事のテーマをもとに制作したAI生成イラスト。

AIで背景画像を生成するとき、最初に「一枚の絵として頼む」方法を試す人は多いです。しかし、スクロールや視差効果(パララックス)を使いたい場面や、キャラクターを前景に重ねたい場面では、背景を遠景・中景・近景の三層に分けて別々に用意する必要があります。この分け方を知らないままAIに頼むと、後から切り抜きや加工に大きな手間がかかります。 この記事では、ゲーム背景に特有の「層ごとに何を描くか」という設計の考え方と、AIへの指示文をどう組み立てるかを順に整理します。使うAIツールは問いませんが、画像生成AIに英語または日本語のプロンプトを入力して画像を出力できる環境を前提にしています。

この記事の目次
  1. 遠景・中景・近景が必要になる場面を整理する
  2. 各層に何を配置するかの設計基準
  3. AIへのプロンプトを層ごとに組み立てる手順
  4. 生成後によく起きる問題と対処
  5. 三層の設計をゲームに組み込む前に確認すること
  6. 次の行動

遠景・中景・近景が必要になる場面を整理する

まず、三層が必要なケースと一枚絵で十分なケースを分けておくと、無駄な作業を避けられます。

一枚絵でよいケースは、背景がスクロールせず、キャラクターも固定された画面の奥に収まっている場合です。ビジュアルノベルの会話シーンや、固定画面のパズルゲームはこれにあたります。この場合は「全体として美しい一枚絵」を作ることに集中できます。

三層に分けるべきケースは次のいずれかに当てはまるときです。

  • 横スクロールアクションやランナー系で、奥と手前が異なる速さで動く
  • キャラクターやオブジェクトを背景の特定の層より前に配置する
  • 近景だけ夜になる・霧がかかるなど、層ごとに状態を変えたい

三層が必要と分かった段階で「最初から三枚別々に作る」と決めておくのが重要です。完成した一枚絵を後から分割しようとすると、物体が重なっている部分の補完が困難になります。

各層に何を配置するかの設計基準

AIに指示する前に、紙やメモアプリで簡単なスケッチを描いておくと指示が定まりやすいです。各層の役割は次のように考えると整理できます。

遠景(ファーレイヤー)

空・山・雲・遠くの建物のシルエットなど、視点からもっとも遠い要素を置きます。ここは細部よりも色と全体の雰囲気を担う層です。ゲームが進んでも変わらないことが多く、スクロール速度は最も遅いか、まったく動かない場合もあります。

AIへの指示では「遠くに見える、ディテールを省いたシルエット調」を明示するのが有効です。細部を描かせると、拡大したときに粗さが目立つ上、ファイルサイズも増えます。

中景(ミドルレイヤー)

木の群れ・丘・建物の外壁・川など、舞台の「地面」に相当する要素が入ります。プレイヤーのキャラクターが立つ地面がここに含まれる場合もあれば、地面はタイルマップで別途用意してこの層は純粋に奥行きの装飾だけという構成もあります。

中景はもっとも情報量が多い層です。AIへの指示では「前後の層と整合する色温度・光源の方向」を意識してください。遠景に西日が差しているなら中景も同じ方向から光が当たっている、という一貫性が自然に見える背景を作ります。

近景(フォアレイヤー)

画面手前に重なる草・岩・木の幹・建物の縁取りなどです。プレイヤーの視点より前にある要素で、スクロールが一番速く、場合によっては半透明で奥を透かします。

近景で特に注意が必要なのは「透明な背景(アルファチャンネル)が必要かどうか」です。近景の要素はキャラクターが走り抜ける画面の前面に置くため、PNG形式で背景色を透明にして書き出す必要が生じます。AIが生成する画像は通常、不透明な背景色がついています。透明化が必要な場合は、生成後に背景除去ツールで処理する手順を最初から工程に組み込んでおきましょう。

AIへのプロンプトを層ごとに組み立てる手順

設計が決まったら、各層のプロンプトを順番に作ります。三枚を別々に生成するときに陥りやすい失敗は「色調・光源・スタイルがバラバラになる」ことです。これを防ぐために「共通トークン」を先に決めておくのが有効です。

ステップ1:共通トークンを決める

スタイル・時間帯・天候・パレット方向を一行で固めます。たとえば「2Dドット調、夕方、晴れ、暖色系オレンジとパープル」のように決めておき、この一行を三枚すべてのプロンプトに入れます。

ステップ2:各層に固有の要素を加える

共通トークンに加えて、遠景なら「distant mountain silhouette, minimal detail, gradient sky」、中景なら「forest midground, defined tree shapes, warm light from right」、近景なら「foreground grass and rocks, cropped at bottom edge, dark shadow overlay」のように層固有の指示を付け足します。

ステップ3:解像度と縦横比を統一する

三層は同じキャンバスサイズに合わせて生成してください。多くのゲームエンジンは横1920×縦1080を基準にしていますが、横スクロール用にはスクロール分の横幅を加えた横長の画像が必要です。一枚だけ縦横比が違うと、ゲームに組み込んだときにズレが生じます。使うAIツールが縦横比を自由に指定できるか、または正方形しか出せないかを事前に確認しておきましょう。

ステップ4:光源と影の整合を確認する

三枚を画像編集ソフトで重ねて見て、光源方向が統一されているかを目視確認します。中景の木が左から照らされているのに、近景の岩の影が右側についていると、重ねた瞬間に違和感が出ます。この確認はゲームに組み込む前の段階で必ず行い、問題があれば層ごとにプロンプトを修正して再生成します。

生成後によく起きる問題と対処

近景に余計な空が混入する

AIは「近景だけを描いて」という指示を完全には理解しません。近景のプロンプトに空が描かれてしまうことがあります。この場合、プロンプトに「no sky, no background, foreground elements only」を明示するか、生成後に空の部分を切り抜きます。

中景と遠景で色温度がずれる

同じ共通トークンを使っても、生成ごとにモデルの解釈が変わり、遠景が青みがかっているのに中景が緑寄りになることがあります。色温度の補正は画像編集ソフトの「色相・彩度・カラーバランス」で軽く整えるのが現実的です。毎回完璧に一致させようとして再生成を繰り返すよりも、一枚を基準にして他をソフトウェアで微調整するほうが早く仕上がります。

近景の透明化で輪郭がギザギザになる

背景除去ツールは輪郭を自動で判定しますが、草や葉のように細かい形状は精度が落ちます。生成時に近景の要素を「暗い背景色(黒・紺)の上に置いた構図」にしておくと、背景除去ツールが境界を捉えやすくなります。白背景の上に薄い色の草を生成すると、境界の判定が難しくなります。

三層の設計をゲームに組み込む前に確認すること

画像が揃ったら、ゲームのコードに組み込む前にチェックしておきたい点が二つあります。

一つはパフォーマンスへの影響です。横に長い画像を三枚同時に描画すると、低スペックのデバイスでは描画負荷が上がります。横スクロールが必要な範囲を超えて無駄に長い画像を作らないこと、またファイルサイズをPNGまたは可逆圧縮のWebPで最小化することを意識してください。

もう一つはループ処理との整合です。横スクロールで画面端まで来たら最初に戻る「ループ背景」にする場合、画像の左端と右端がつながるように作る必要があります。AIで生成した画像はそのままではつながらないことがほとんどです。事前に「シームレスなテクスチャ」として指示する方法と、生成後に画像編集ソフトでつなぎ目を手動で補完する方法のどちらかを選んでください。後者のほうが制御しやすい場合が多いです。

次の行動

設計メモを一枚用意して、遠景・中景・近景のそれぞれに「何を置くか」「光源はどちらか」「透明化が必要か」を書き出してから、共通トークンを決めてプロンプトを作成してみてください。三層が揃ったら画像編集ソフトで重ね合わせ、色調と光源の整合を目視で確認した上でゲームに組み込む流れを一度通しで試すと、次回以降の作業時間が大きく短縮されます。作った背景を使ったゲームが完成したら、アソバースへの投稿も検討してみてください。