tweens

Animate properties over time in Phaser 4 using tweens and easing functions.

Updated May 16, 2026

Search Tags:#game development #animation #easing functions #tweens #phaser 4

Ready to run

npx skills add https://github.com/ckyeon/claude-code-settings --skill tweens-ckyeon

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: tweens
Source: https://github.com/ckyeon/claude-code-settings/tree/main/project-templates/phaser/.claude/skills/tweens
Command: npx skills add https://github.com/ckyeon/claude-code-settings --skill tweens-ckyeon

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a comprehensive guide to animating properties over time in Phaser 4, including tweens, tween chains, easing functions, stagger, yoyo, repeat, callbacks, and the TweenManager, enabling smooth and dynamic animations in your game.

Core Features & Use Cases

Tweening: Animate properties like position, scale, alpha, and rotation.
Tween Chains: Sequentially execute multiple tweens.
Easing Functions: Apply different animation speeds and curves.
Stagger: Offset animations across multiple targets.
Yoyo and Repeat: Reverse and repeat animations.
Callbacks: Execute custom code at specific points in the tween's lifecycle.
Use Case: Enhance the visual appeal of your Phaser 4 game by smoothly animating game objects like characters, bullets, and effects.

Quick Start

Use the tweens skill to animate a game object's position and scale over time in your Phaser 4 game.

Frequently Asked Questions about tweens

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I animate game object properties over time in Phaser 4?▼

Animate game object properties over time in Phaser 4 by configuring tweens through the TweenManager. You can smoothly animate position, scale, alpha, and rotation by defining target values and applying easing functions.

Can I sequentially execute multiple animations in Phaser 4?▼

Sequentially execute multiple animations by creating tween chains in Phaser 4. This links tweens together so they run in order, enabling complex, multi-step animation patterns for characters and effects.

How do easing functions affect tween animations in game development?▼

Easing functions control the speed and curve of tween animations in game development. They define how property values interpolate over time, allowing animations to accelerate, decelerate, or bounce naturally.

Does Phaser 4 support offsetting animations across multiple targets?▼

Phaser 4 supports offsetting animations across multiple targets using the stagger feature. This applies tweens to a group of objects with a timed delay between each target, creating a ripple effect.

How do I reverse and repeat animations in Phaser 4?▼

Reverse and repeat animations in Phaser 4 by utilizing the yoyo and repeat configurations. Yoyo reverses the tween direction upon completion, while repeat loops the animation for a specified number of iterations.

How do I execute custom code during a tween's lifecycle in Phaser 4?▼

Execute custom code during a tween's lifecycle in Phaser 4 by defining callbacks. These functions trigger at specific points, such as start, update, or complete, allowing synchronization of game logic with animations.