【Unity初心者】お金をかけずに2D RPGを作る!Step1キャラ実装編 (ゼロから歩きアニメーションまで)
はじめに
Unityでゲームを作り始めました! プログラミング経験はC#あり、でもUnityは初めて。 目標は見下ろし型2D RPGを完全無料で作ること!
この記事では環境構築からキャラクターの4方向歩きアニメーション実装までをまとめます。
環境・使用ツール(すべて無料)
ツール 用途 Unity Personal ゲームエンジン(無料) Visual Studio Community C#コードエディタ(Unity同梱) Tiny RPG - Forest(Asset Store) キャラ・タイル素材(無料)
使用アセットについて
Tiny RPG - Forest
価格:完全無料
制作者:Ansimuz
特徴:見下ろし型RPG向け・ゼルダ風・ピクセルアート
有料ゲームへの使用:Standard Unity Asset Store EULAに基づきOK✅
アセットのフォルダ構成
Tiny RPG Forest/Artwork/
├── sprites/
│ ├── hero/
│ │ ├── idle/
│ │ │ ├── hero-idle-front(正面待機)
│ │ │ ├── hero-idle-back(後ろ待機)
│ │ │ └── hero-idle-side(横待機)
│ │ ├── walk/
│ │ │ ├── hero-walk-front-1〜6(正面歩き6フレーム)
│ │ │ ├── hero-walk-back-1〜6(後ろ歩き6フレーム)
│ │ │ └── hero-walk-side-1〜6(横歩き6フレーム)
│ │ ├── attack/
│ │ └── attack-weapon/
│ ├── mole/
│ └── treant/
└── Environment/
├── tileset/
├── tileset-sliced/
├── sliced-objects/
└── waterfall animation/
Step 1:キャラクターを配置・動かす
1. シーンにキャラクターを配置
Hierarchy → 右クリック → Create Empty
→ 名前を「Player」に変更
→ Inspector → Add Component → Sprite Renderer を追加
→ Sprite欄に「hero-idle-front」をドラッグ
→ Transform → Scale を (2, 2, 1) に変更
2. コンポーネントを追加
Add Component → Rigidbody 2D
└ Gravity Scale → 0(見下ろし型なので重力不要)
└ Constraints → Freeze Rotation Z ✅
Add Component → Capsule Collider 2D
3. C#スクリプト作成(基本移動)
Projectウィンドウで右クリック
→ Create → C# Script
→ 名前:「PlayerController」
Step 2:4方向スプライト切り替え
移動方向に応じて正面・後ろ・横のスプライトを切り替える実装。
PlayerController.cs(4方向切り替え版):
using UnityEngine;
public class PlayerController : MonoBehaviour
{
public float moveSpeed = 5f;
public Sprite idleFront;
public Sprite idleBack;
public Sprite idleSide;
private Rigidbody2D rb;
private Vector2 movement;
private SpriteRenderer spriteRenderer;
void Start()
{
rb = GetComponent<Rigidbody2D>();
spriteRenderer = GetComponent<SpriteRenderer>();
spriteRenderer.sprite = idleFront;
}
void Update()
{
movement.x = Input.GetAxisRaw("Horizontal");
movement.y = Input.GetAxisRaw("Vertical");
if (movement.y < 0)
{
if (idleFront != null) spriteRenderer.sprite = idleFront;
spriteRenderer.flipX = false;
}
else if (movement.y > 0)
{
if (idleBack != null) spriteRenderer.sprite = idleBack;
spriteRenderer.flipX = false;
}
else if (movement.x > 0)
{
if (idleSide != null) spriteRenderer.sprite = idleSide;
spriteRenderer.flipX = false;
}
else if (movement.x < 0)
{
if (idleSide != null) spriteRenderer.sprite = idleSide;
spriteRenderer.flipX = true;
}
}
void FixedUpdate()
{
rb.MovePosition(rb.position + movement.normalized * moveSpeed * Time.fixedDeltaTime);
}
}
Step 3:4方向歩きアニメーション
Animatorは使わずC#スクリプトで直接フレームを切り替える方法で実装。 停止時は待機スプライト、移動時は6フレームのアニメーションを再生。
PlayerController.cs(歩きアニメーション版・最終形):
using UnityEngine;
public class PlayerController : MonoBehaviour
{
public float moveSpeed = 5f;
public float animationSpeed = 0.1f;
[Header("待機スプライト")]
public Sprite idleFront;
public Sprite idleBack;
public Sprite idleSide;
[Header("歩きスプライト")]
public Sprite[] walkFront; // 6枚
public Sprite[] walkBack; // 6枚
public Sprite[] walkSide; // 6枚
private Rigidbody2D rb;
private Vector2 movement;
private SpriteRenderer spriteRenderer;
private int currentFrame = 0;
private float frameTimer = 0f;
private string lastDirection = "front";
void Start()
{
rb = GetComponent<Rigidbody2D>();
spriteRenderer = GetComponent<SpriteRenderer>();
spriteRenderer.sprite = idleFront;
}
void Update()
{
movement.x = Input.GetAxisRaw("Horizontal");
movement.y = Input.GetAxisRaw("Vertical");
bool isMoving = movement != Vector2.zero;
if (isMoving)
{
if (movement.y < 0) lastDirection = "front";
else if (movement.y > 0) lastDirection = "back";
else if (movement.x != 0) lastDirection = "side";
if (movement.x > 0) spriteRenderer.flipX = false;
else if (movement.x < 0) spriteRenderer.flipX = true;
frameTimer += Time.deltaTime;
if (frameTimer >= animationSpeed)
{
frameTimer = 0f;
currentFrame = (currentFrame + 1) % 6;
UpdateWalkSprite();
}
}
else
{
currentFrame = 0;
frameTimer = 0f;
UpdateIdleSprite();
}
}
void UpdateWalkSprite()
{
if (lastDirection == "front" && walkFront.Length > 0)
spriteRenderer.sprite = walkFront[currentFrame];
else if (lastDirection == "back" && walkBack.Length > 0)
spriteRenderer.sprite = walkBack[currentFrame];
else if (lastDirection == "side" && walkSide.Length > 0)
spriteRenderer.sprite = walkSide[currentFrame];
}
void UpdateIdleSprite()
{
if (lastDirection == "front" && idleFront != null)
spriteRenderer.sprite = idleFront;
else if (lastDirection == "back" && idleBack != null)
spriteRenderer.sprite = idleBack;
else if (lastDirection == "side" && idleSide != null)
spriteRenderer.sprite = idleSide;
}
void FixedUpdate()
{
rb.MovePosition(rb.position + movement.normalized * moveSpeed * Time.fixedDeltaTime);
}
}
Inspectorの設定
Player Controller (Script) の各欄に設定:
待機スプライト:
・Idle Front → hero-idle-front
・Idle Back → hero-idle-back
・Idle Side → hero-idle-side
歩きスプライト(各6枚):
・Walk Front → hero-walk-front-1〜6
・Walk Back → hero-walk-back-1〜6
・Walk Side → hero-walk-side-1〜6
ハマったポイント
① Sprite Shapeと間違えた
2D Object → Sprite を選ぼうとしたらSprite Shapeのメニューが出た。
解決策:
Hierarchy → 右クリック → Create Empty
→ Add Component → Sprite Renderer
② Rigidbody 2Dが外れてエラー
MissingComponentException: There is no 'Rigidbody2D' attached to the "Player" game object
スクリプトアタッチ後にRigidbody 2Dが外れていた。再度追加して解決。
③ Animatorが干渉してキャラが消えた
Animator Controllerをアタッチしたままにしていたため 再生時にSprite RendererのSpriteがMissingになった。 Animatorを外して解決。
④ スプライトのスライス設定ミス
アニメーションフレームを追加しようとしてスライスしたが 1枚絵を4分割してしまった。 Tiny RPG Forestのidleは1枚絵のため、スライス不要だった。
完了チェックリスト
[x] キャラがシーンに表示されている
[x] WASDで上下左右に動く
[x] 移動方向に応じてスプライトが切り替わる
[x] 移動中は歩きアニメーション(6フレーム)が再生される
[x] 停止時は待機スプライトに戻る
[x] 左移動時にスプライトが反転する
次回予告
Step 2:マップ作成・カメラ追従
Tiny RPG ForestのタイルセットでRPGらしいマップを作ります!
Unity Personal / Tiny RPG - Forest使用 / 完全無料構成
いいなと思ったら応援しよう!
よろしければ応援お願いします!
