Week08_Polish & Effects - M-634/unity-game-dev-tutorial GitHub Wiki

✨ Week08 - UI強化と演出追加(Polish & Effects)


🎯 今週の目的

  • ゲーム体験を視覚的・感覚的に磨き上げ、完成度を高める
  • Animator / Animation / Particle System の基本的な使い方を学ぶ
  • プレイヤー・敵・UIに「気持ちよさ」を追加する

🛠 授業の流れ


🎞 1. Animator・Animation の基礎

  • Animator : コンポーネント。呼び出し元でアニメーションさせたいGameObjectにアタッチする。
  • AnimatorController : アセット。アニメーション間の遷移や状態を管理する。
  • AnimationClip : アセット。実際にGameObjectにアニメーション情報を持たせるデータ。基本的にアニメーションの編集もこれを扱う。

Step 0 : 事前準備

これからレベルアップ演出アニメーションを作成してみよう! 下準備として、前回作成したGameScene上のPlayerLevelManagerの子供にTextMeshProTextで演出用のテキストを作成しましょう。

Step 1: Animator Controller を作成する

  1. _Workspace/Assets/Animations フォルダを作成
  2. 右クリック → Create > Animator Controller
  3. 名前は LevelUpAnimator
  4. 前回作成したGameScene上の'PlayerLevelManager'にアタッチする

Step 2: Animator 状態と遷移設定

  1. Step1で作成したLevelUpAnimator.animatorをダブルクリック
  2. Animator Windowが表示される
  3. 下記図のようにStateを作成して遷移図を作成する
  • 新規Stateは、右クリック > Create State > Empty から新規のStateを作成できる
  1. Animator Windows のParametersにPlay トリガーを追加する
  • 上記赤丸の「+」ボタンクリック -> Triggerを選択。名前をPlayにする

  1. Idle -> Play ステートに伸びている矢印をタップして下記画像の部分にTriggerをセット

Step 3: Animation Clip を作成

  1. メニューから Create > Animation > Animationを選択。
  2. 名前はLevelUpPlayAnimationLevelUpIdleAnimationの2つを作成する。
  3. AnimatorWindowを開き、State内に作成したアニメーションをMotion部分にアサインする
  • LevelUpIdleAnimation => Idle, LevelUpPlayAnimation => Play
  1. LevelUpIdleAnimationをダブルクリックしてAnimation Window`を開く
  2. Hierarchy 上のPlayerLevelManager(Animatorコンポーネントをアタッチした)を選択しておくこと
  3. Animationを編集して、演出を作成する

8967879a24db089e93e25555b183ad81


Step 4: スクリプトからトリガー発火

  • PlayerLevelManager.csに以下のコードを追加して、 Animatorコンポーネントを_animにアサインする。

[SerializeField]
private Animator _anim;

private static readonly int Play = Animator.StringToHash("Play");//セットしたTrigger名を入れる

 private void LevelUp()
{
    _anim.SetTrigger(Play);//ここでAnimation再生
}

🌟 2. パーティクルシステムとは

  • Particle System (パーティクルシステム) コンポーネントはシーン内で大量の小さな 2D の画像を生成し、アニメーション化することによって、液体、雲、炎などの流体をシミュレーションします。
  • コンポーネント内には「モジュール」と言われる単位で設定項目が用意されています。各種モジュールの設定を行いエフェクトを作成します。

今回は、敵を撃破した際の爆発っぽいエフェクトを作成します!

Step 1: 準備

  • 空のGameObjectをScene上に配置する
  • ParticleSystemコンポーネントをアタッチする。

Step2 : 撃破時の演出をParticleSystemのパラメータを調整しながら作成する。

  • パラメーター項目が多いので授業中の画面見ながら行うが、設定画像も添付しておきます。
  • 調整終わったらPrefab化する。

▼モジュールにチェックがついているところだけ抜粋

Step3 : 敵撃破時にエフェクトを生成して自動的に破棄

  • EnemyHealth.csに以下スクリプトを追加する
  • Enemy.prefabEnemyHealthコンポーネントに、先程作成したEffectPrefabをアタッチする

[SerializeField]
private GameObject _onDeadEffectPrefab;

~

private void OnDeath()
{
    ~ 
    
    if (_onDeadEffectPrefab != null)
    {
         //エフェクトPrefabを生成する
        Instantiate(_onDeadEffectPrefab, transform.position, Quaternion.identity);
    }        
        
    ~
}

✅ チェックリスト

  • Animator で演出用アニメーションを追加できたか
  • 敵にダメージを与えた際にフラッシュするか
  • 敵撃破時にパーティクル演出が再生されるか

📝 課題

  • オリジナルの演出を作成してみよう!

🔗 参考リンク