スプライトシートとは｜複数のコマを、1枚の画像にまとめたもの

言葉の意味

スプライトシートは、スプライト（ゲームの中で動く2Dの絵）の動きのコマを、1枚の画像にまとめたものです。コマごとに分かれた複数枚の画像は、ここに入りません。

たとえば Godot でも、この意味で使われています。キャラクターの絵を用意する方法として、1枚ずつの画像を使う方法と、動きの全コマを含む1枚のシートを使う方法の2通りがあり、後者ではシートを設定して、横方向と縦方向のコマ数を指定することで、1枚から個々のコマを切り出します。

使う場面は、1枚のシートからコマを切り出して、アニメーションとして再生するときです。Godot の Sprite2D では、テクスチャ（画像）にシートを設定し、hframes（列の数）と vframes（行の数）を指定します。frame（表示するコマの番号）でシートの中の1コマを選べますが、hframes か vframes は 1 より大きくする必要があります。たとえば6コマのシートで hframes を 6 にすると、frame は 0 から 5 の値になり、AnimationPlayer でこの値を時間に沿って切り替えると、コマが順に表示されます。AnimatedSprite2D か AnimatedSprite3D で再生するコマとアニメーションのデータは、SpriteFrames というリソースが持ちます。Aseprite では、1つのアニメーションを、たとえば横に並べた形か、縦に並べた形か、行列（matrix）の形のスプライトシートにできます。書き出しは File メニューの Export Sprite Sheet（スプライトシートの書き出し）で、見えているすべてのレイヤーか特定のレイヤーを選び、タグをもとにコマを選べます。

ブラウザ（canvas）で作った例は、画像ファイルを使わずプログラムで描いたコマ（立ち4・走り6・ジャンプ2・攻撃4、合わせて16コマ）を1枚のスプライトシートにまとめ、そこから1コマずつ切り出して表示する仕組みを AI に頼んだ文と、画面を持たないブラウザで切り替えを数えて確かめた結果が、スプライトアニメーションの切り替えを作らせる頼み方にあります。

情報源

• Godot Engine Documentation — 2D sprite animationhttps://docs.godotengine.org/en/stable/tutorials/2d/2d_sprite_animation.html確認日 2026-10-19
• Godot Engine Documentation — Sprite2Dhttps://docs.godotengine.org/en/stable/classes/class_sprite2d.html確認日 2026-10-19
• Godot Engine Documentation — SpriteFrameshttps://docs.godotengine.org/en/stable/classes/class_spriteframes.html確認日 2026-10-19
• Aseprite Docs — Sprite-sheethttps://www.aseprite.org/docs/sprite-sheet/確認日 2026-10-19