1枚のスプライトシートからアニメーションを作る手順
本記事では Unity 6(6000系)を前提に、1枚のスプライトシート画像からスプライトを切り出し、アニメーションを作成して再生する方法を解説します。
この記事は、Unity Animator 学習シリーズのSTEP 2Aです。全体の流れはシリーズのページで確認できます。
Unity 6 では、Animation ウィンドウの Samples(1秒あたりのコマ数)は、初期状態では非表示になっています。「Show Sample Rate」をオンにすると表示できます。
スプライトアニメの再生速度は、Samples・Animator State の Speed・ドープシート上のキーフレーム間隔で調整できます。
この記事の進め方
- スプライトシートの切り出し(Sprite Mode が Multiple、Slice まで)が済んでいる人 → 手順3 Animation Clip を作成から進めてください。「Unity 2Dでカメラを背景からはみ出させない方法」の準備2まで終えた人は、ここからです
- スプライトシートの画像を、これから取り込む人 → 手順1 スプライトシートをインポートから進めてください
- IdleとWalkを切り替えたい人 → 手順3・4のあとに、手順6 アニメーション切り替えへ進んでください
1. スプライトシートをインポート
ここでは、「スプライトシート」で画像をググった場合等で入手した、一般的アニメーションの作り方手順について説明しています
本記事のスクリーンショットでは、Unity Asset Storeで無料配布されている「Free Platform Game Assets」(Bayat Games 制作)の素材を使用しています。同じ素材で練習したい方は、こちらのページからダウンロードできます。
Unity 2Dで「カメラを背景からはみ出させない」方法の情報から進められた方は
3. Animation Clip を作成から進めてください
- Assets/ に Sprites/ フォルダを作成
- PNG をドラッグ&ドロップ
- 画像を選択 → Inspector(重要設定)
- Texture Type: Sprite (2D and UI)
- Sprite Mode: Multiple
ドット絵の場合:
- Filter Mode: Point (no filter)
→ Apply
2. Sprite Editor で分割
- 対象画像を選択
- Inspector → Sprite Editor
- Slice ボタン
切り出しの設定や確認の方法をさらに詳しく知りたい方は、Unity 6|1枚の画像から複数のスプライトを切り出す方法をご覧ください。
Slice のメニューに「Texture is in compressed format…」と表示されることがありますが、そのまま Automatic で切り出せます。
分割方法
| Type | 用途 |
|---|---|
| Automatic | 不均等配置 |
| Grid by Cell Size | 均等サイズ |
| Grid by Cell Count | コマ数が分かっている |
Pivot は統一しておくと、足位置が安定します
→ Center / Bottom / Custom で調整
→ Apply
3. Animation Clip を作成
以下のキャプチャーは、Unity 2Dで「カメラを背景からはみ出させない」方法から進めた方向けのキャラクターになっています
最も簡単な作成方法:
- Project ビューで、切り出された複数スプライトを 順番に全て選択
最初のスプライトをクリック後、Shiftを押下したまま最後のスプライトをクリックすると全てが選択できます
これは、WindowsやMacでも使える機能なので覚えておくといいでしょう

- Hierarchy のオブジェクトに ドラッグ & ドロップ
ドラッグする前に、Hierarchy のオブジェクトの名前を Player に変えておきましょう。自動で作られる Animator Controller は、オブジェクトと同じ名前(Player.controller)で保存されます。

Unity が自動で
- Animation Clip(例:Idle.anim)
- Animator Controller(例:Player.controller)
- Animator コンポーネントを生成してくれます。
保存先を選ぶ画面が表示されたら、保存する場所を選びます。この記事の画像では、スプライトと同じ Idle フォルダーに保存しています。ファイルが増えて整理したいときは、Assets の下に Animations フォルダーを作り、そこに保存してもかまいません。

4. Animator Controller を確認
- Hierarchy で Player を選びます(Animator ウィンドウには、選んだオブジェクトの Controller が表示されます。Project ウィンドウの Player(Animator Controller)をダブルクリックしても開けます)
- Window > Animation > Animator
- Base Layer → Idle がある
- Entry → Idle に接続されている→ 起動時に Idle が再生される状態

5. 再生速度の調整
スプライトアニメの再生速度は、次の3つの方法で調整できます。
まず基本になるのは、1秒あたりのコマ数を決める Samples です。Samples は初期状態では非表示なので、表示のしかたから確認しましょう。
方法A)Samples(コマ数)を変更
- Window > Animation > Animation を開く
- Hierarchy で対象のオブジェクトを選択し、Animation ウィンドウに Animation Clip を表示する
- タイムラインの横にある「︙」メニューを開く(メニューが2つ並んでいる場合は下側)
- Show Sample Rate をオンにすると、Samples の欄が表示される
- Samples の値を変更する(例:12 → 8)
Samples は「1秒あたりのコマ数」です。値を小さくするとゆっくり、大きくすると速く再生されます。
方法B)Animator State の Speed を変更
- Window > Animation > Animator
- 対象ステート(例:Idle)を選択
- Inspector → Speed
| 値 | 動作 |
|---|---|
| 1.0 | 等倍 |
| 2.0 | 2倍 |
| 0.5 | 半分 |
DopeSheet(ドープシート)とは、Unity の Animation ウィンドウにある “キーフレームを時間軸で並べて編集するビュー”のことです。
簡単に言えば
「アニメのコマ(キー)を並べ替えたり、タイミングを調整するためのシート」です。
DopeSheet の特徴
| 項目 | 内容 |
|---|---|
| 目的 | キーフレーム(Sprite など)の配置タイミングを調整 |
| 表示 | 横方向に時間、縦方向にプロパティ |
| 主な操作 | キーフレームを移動 / 追加 / 削除 |
| 使う場面 | アニメーションを速く/遅くしたい・特定フレームを長く表示したい |
| 表示方法 | Animation ウィンドウ下部のタブで切り替え |
どんな時に使う?
- スプライトアニメで → 1枚だけ長く見せたい
- 1コマだけ一瞬止めたい
- 全体の速度を細かく変えたい(※全体速度は Animator State の Speed で調整してもOK)
- Animation Clip の “演出リズム” を調整したい
画面の見方

- キー(■)を左右へ動かすと → 表示タイミングが変更される → = 速く/遅く できる
DopeSheetを開く方法
- Window > Animation > Animation を開く
- 対象オブジェクトを選択
- Animation ウィンドウ下部 → 「Dope Sheet」タブ をクリック
もう一つのタブ “Curves” ではプロパティをカーブで制御できる。Sprite アニメでは基本 DopeSheet を使う。
例:1枚だけ長く表示したい
- DopeSheetで対象フレームを選択
- 右へドラッグ→ 表示時間が長くなる(キー間が広がる)
DopeSheet vs Animator vs Clip
| 種類 | 説明 |
|---|---|
| DopeSheet | キーフレームの配置・タイミング |
| Animator | 状態遷移(Idle → Walk など)制御 |
| Animation Clip | 個々のアニメーションデータ |
まとめ
- DopeSheet = キーフレームの時間配置を編集するビュー
- Spriteアニメの細かい調整に使う
- 再生時間の調整=キーを左右に動かす
- Samples(全体の速さ)とあわせて、キーの間隔でコマごとの長さを調整できる
方法C)スクリプトで変更(動的)
Animator animator;
void Start()
{
animator = GetComponent<Animator>();
animator.speed = 1.5f;
}
全ステートに適用されます。
6. アニメーション切り替え(Idle / Walk)
ここでは、Idle のほかに Walk のクリップを作り、isWalking の値で切り替えます。Idle は、手順3までに作ってある前提です。
Walk のクリップを作る
- Project ウィンドウで、Walk 用のスプライトをすべて選びます(最初のスプライトをクリックして、Shift キーを押しながら最後のスプライトをクリックします)。
- Hierarchy で Player を選び、
Window > Animation > Animationで Animation ウィンドウを開きます。 - ウィンドウ左上のクリップ名(Idle)をクリックして、Create New Clip… を選びます。名前を
Walkにして保存します。 - 1で選んだスプライトを、Animation ウィンドウの右側(タイムラインの部分)にドラッグ&ドロップします。

注意:Walk のスプライトを、Hierarchy の Player にドラッグしてはいけません。すでに Animator がある Player に落とすと、Walk のクリップはできず、Walk_0 という子オブジェクトができてしまいます。できてしまったときは、Ctrl+Z(Mac は Command+Z)で取り消してください。
Walk のクリップを作ると、Animator ウィンドウに Walk のステートが自動で追加されます。Idle のステートがオレンジ色(最初に再生されるステート)のままであることを確認しましょう。
パラメーター isWalking を作る
Animator ウィンドウで Parameters タブを開き、+ > Bool を選んで、名前を isWalking にします。スクリプトの SetBool("isWalking", …) と、大文字小文字も含めて同じ綴りにします。
遷移を作る
- Idle を右クリックして Make Transition を選び、Walk をクリックします。
- Walk を右クリックして Make Transition を選び、Idle をクリックします。

遷移の条件を設定する
- Animator ウィンドウで Idle のステートを選びます。Inspector の Transitions に
Idle -> Walkが出るので、クリックします。 - Conditions の + を押し、
isWalkingをtrueにします。 - Has Exit Time のチェックを外します。チェックが入っていると、今のアニメーションを再生し終わるまで切り替わりません。
- Settings を開き、Transition Duration を
0にします。 - Walk のステートを選び、
Walk -> Idleも同じように設定します。ただし、Conditions はisWalkingをfalseにします。

条件を入れる前に Has Exit Time を外すと、Console に「doesn’t have an Exit Time or any condition」という警告が出ます。Conditions に isWalking を入れれば出なくなります。
最後に、Player に Animator と、下の PlayerAnim スクリプトを付けて再生します。キーを押している間は Walk、離すと Idle に切り替われば完成です。
サンプルコード(参考)
アニメーションの登録のスキルがある方向けのサンプルになります
このまま、入力するだけで動作するわけではありません。
上下左右のどちらに動いても、歩くアニメーションになります。
using UnityEngine;
using UnityEngine.InputSystem; // ← 新Input System
[RequireComponent(typeof(Animator))]
public class PlayerAnim : MonoBehaviour
{
Animator animator;
void Awake()
{
animator = GetComponent<Animator>();
}
void Update()
{
float h = 0f; // 左右
float v = 0f; // 上下
// キーボード(WASD・矢印キー)
if (Keyboard.current != null)
{
if (Keyboard.current.aKey.isPressed || Keyboard.current.leftArrowKey.isPressed) h -= 1f;
if (Keyboard.current.dKey.isPressed || Keyboard.current.rightArrowKey.isPressed) h += 1f;
if (Keyboard.current.sKey.isPressed || Keyboard.current.downArrowKey.isPressed) v -= 1f;
if (Keyboard.current.wKey.isPressed || Keyboard.current.upArrowKey.isPressed) v += 1f;
}
// ゲームパッド(左スティック)
if (Gamepad.current != null)
{
// アナログ入力を優先したい場合は上書き
Vector2 stick = Gamepad.current.leftStick.ReadValue();
if (Mathf.Abs(stick.x) > Mathf.Abs(h)) h = stick.x;
if (Mathf.Abs(stick.y) > Mathf.Abs(v)) v = stick.y;
}
// 左右か上下のどちらかに動いていれば、歩いている
bool isWalking = Mathf.Abs(h) > 0.01f || Mathf.Abs(v) > 0.01f;
animator.SetBool("isWalking", isWalking);
}
}
h = 1f でも動作しますが、h += 1f / h -= 1f を推奨する理由は 左右キー同時押し時の挙動が自然だから です。=を使うと、A と D を同時に押した場合に「最後に判定されたキー」が必ず勝ち、方向が不安定になります。一方 +=/-= なら -1 と +1 が相殺されて 0 になり、停止状態として扱えます。多くのゲームでは同時入力は「停止」が自然であり、入力デバイスが増える場合にも加算処理は拡張が容易です。そのため +=/-= の方が複数入力を安全・直感的に扱えるため推奨されます。
using UnityEngine;
[RequireComponent(typeof(Animator))]
public class PlayerAnim : MonoBehaviour
{
Animator animator;
void Awake()
{
animator = GetComponent<Animator>();
}
void Update()
{
float h = Input.GetAxisRaw("Horizontal"); // 左右
float v = Input.GetAxisRaw("Vertical"); // 上下
bool isWalking = Mathf.Abs(h) > 0.01f || Mathf.Abs(v) > 0.01f;
animator.SetBool("isWalking", isWalking);
}
}
※ 新規作成した Unity 6 のプロジェクトは、入力が「Input System Package (New)」になっています。旧入力用のコード(Input.GetAxisRaw)を使う場合は、Edit > Project Settings > Player > Other Settings > Active Input Handling を「Input Manager (Old)」または「Both」に変更し、Unity を再起動してください。
7. よくあるトラブル
| 現象 | 原因 | 対策 |
|---|---|---|
| 再生速度が変わらない | Samples が非表示のまま、または State の Speed を確認していない | Show Sample Rate で Samples を表示して変更、または State Speed を変更 |
| ガタつく | Pivot がずれている | Sprite Editor で揃える |
| 順番がおかしい | 命名が不規則 | _00, _01… |
| アニメ切り替わらない | Parameter設定忘れ | Parameters / Condition設定 |
| ぼやける | Filter不適合 | Point 推奨(ドット絵) |
8. チェックリスト
| Step | Done |
|---|---|
| Sprite Mode = Multiple | ○ |
| Sprite Editor で Slice | ○ |
| Pivot を統一 | ○ |
| スプライトをまとめてドラッグで Animation 作成 | ○ |
| Animator Controller を確認 | ○ |
| Samples(Show Sample Rate)でコマ数を設定 | ○ |
| State Speed を設定 | ○ |
| キー間隔で微調整 | ○ |
まとめ
- Unity 6 前提のワークフロー
- Samples は初期状態では非表示(Show Sample Rate で表示)
- 再生速度は → Samples → Animator State Speed → キーフレーム間隔で調整する
- Idle / Walk などは Animator Parameters で切り替え
- Pivot や命名を揃えると安定









ディスカッション
コメント一覧
まだ、コメントがありません