【Godot】Tweenで実現する滑らかなアニメーション

作成: 2025-12-06

UI演出、エフェクト、動く床など、時間経過を伴う値の変化をcreate_tween()で簡単に実装する方法

概要

ゲームの世界では、オブジェクトが瞬間移動するよりも、滑らかに動く方がずっと自然で心地よく感じられます。UIが画面外からスッと入ってきたり、キャラクターがダメージで点滅したり、HPバーがじわじわと減ったり。こうした「時間経過を伴う値の変化」を簡単に実装できるのが、GodotのTween 機能です。

以前はTweenノードとして存在していましたが、Godot 4ではcreate_tween()というメソッドを呼び出すことで、より手軽に、コードベースでアニメーションを作成できるようになりました。

Tweenの基本:プロパティを時間変化させる

Tweenの基本的な考え方は、「あるオブジェクトの、あるプロパティを、指定した時間で、目標の値まで変化させる」 というものです。これをたった1行のコードで予約できます。

func _ready():
    # 新しいTweenを作成
    var tween = create_tween()

    # 1秒かけて、$Sprite2DノードのpositionプロパティをVector2(500, 300)まで変化させる
    tween.tween_property($Sprite2D, "position", Vector2(500, 300), 1.0)

create_tween()で作成されたTweenは、予約されたアニメーションが完了すると自動的に終了し、メモリから解放されるため、管理が非常に楽です。

tween_propertyの強力な機能

tween_propertyは、Tweenの核となるメソッドです。基本的な引数は以下の通りです。

tween.tween_property(object, property, final_val, duration)

  • object: アニメーションさせたいノード
  • property: 変化させたいプロパティの名前(文字列)。"position:y"のようにサブプロパティも指定可能
  • final_val: プロパティの最終的な値
  • duration: アニメーションにかかる時間(秒)

実践例1:ダメージ時の点滅(透明度アニメーション)

キャラクターがダメージを受けたときに数回点滅する演出は、modulateプロパティのアルファ値(透明度)を変化させることで実現できます。

func take_damage():
    # 3回点滅させる
    var tween = create_tween().set_loops(3)

    # まず透明にする
    tween.tween_property(self, "modulate:a", 0.0, 0.1)
    # 次に不透明に戻す
    tween.tween_property(self, "modulate:a", 1.0, 0.1)

set_loops(3)を呼び出すことで、その後に続く一連のアニメーション(透明→不透明)を3回繰り返すように設定できます。

実践例2:UIのスライドアニメーション

Controlノード(UI要素)を画面の外から滑らかに表示させるアニメーションも簡単です。

# メニューを開くときの処理
func show_menu():
    var menu = $MenuPanel
    menu.visible = true

    # 初期位置を画面外に設定
    menu.position.x = -menu.size.x

    # Tweenで画面内の定位置まで移動させる
    var tween = create_tween()
    # Easing(緩急)を設定して、より自然な動きに
    tween.tween_property(menu, "position:x", 0, 0.5).set_trans(Tween.TRANS_QUINT).set_ease(Tween.EASE_OUT)

この例では、set_trans()set_ease()を使ってアニメーションに緩急をつけています。EASE_OUTは「最初は速く、最後はゆっくり」という動きで、UIアニメーションで非常によく使われます。

Tweenの連結と並列実行

Tweenは、複数のアニメーションを鎖のようにつなげたり(シーケンス)、同時に実行したり(並列)することもできます。

  • 連結(シーケンス): tween_propertyを連続して呼び出すと、それらは順番に実行されます
  • 並列: parallel()メソッドを呼び出すと、次からのtween_propertyは前のものと同時に開始されます
func complex_animation():
    var tween = create_tween()

    # 1. まず右に移動
    tween.tween_property($Sprite2D, "position:x", 500, 1.0)
    # 2. 次に下に移動しつつ、同時に回転する
    tween.parallel().tween_property($Sprite2D, "position:y", 300, 1.0)
    tween.parallel().tween_property($Sprite2D, "rotation_degrees", 90, 1.0)
    # 3. 最後に0.5秒待つ
    tween.tween_interval(0.5)
    # 4. そして消える(透明にする)
    tween.tween_property($Sprite2D, "modulate:a", 0.0, 0.3)

まとめ

Godot 4のTween機能は、コードベースで手軽に、かつパワフルにアニメーションを実装するための素晴らしいツールです。AnimationPlayerを使うほどではないけれど、オブジェクトを滑らかに動かしたい、という場面のほとんどはTweenで解決できます。

  • UIの演出
  • エフェクトの表現(点滅、フェードアウトなど)
  • 動く床やギミックの作成

これらの要素にTweenを活用することで、あなたのゲームの品質は格段に向上します。