animations

Create and control sprite animations in Phaser 4.

Updated Apr 25, 2026
One-click install
npx skills add https://github.com/dzyamik/furry-match3 --skill animations-dzyamik
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: animations
Source: https://github.com/dzyamik/furry-match3/tree/main/.claude/skills/animations
Command: npx skills add https://github.com/dzyamik/furry-match3 --skill animations-dzyamik

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Create and manage complex sprite animations in Phaser 4, simplifying animation pipelines for games and interactive apps.

Core Features & Use Cases

  • Understand AnimationManager vs AnimationState and how to apply global vs local animations across multiple sprites.
  • Define, load, and play animations from spritesheets and texture atlases, including frame callbacks and events.
  • Use in real-world game flows: character idle/walk sequences, particle-like effects, and chained animation transitions.

Quick Start

Load your sprites, define an animation, and play it on a sprite to see the sequence in action.

Frequently Asked Questions about animations

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

FAQPage Schema
How do I create and control sprite animations in Phaser 4?

Sprite animations in Phaser 4 are controlled via AnimationManager for global definitions and AnimationState for per-sprite playback. You generate frames from spritesheets or texture atlases, then manage playback using play, pause, stop, and chain controls.

What is the difference between global and local animations in Phaser 4?

Global animations in Phaser 4 are defined once on the AnimationManager and shared across sprites, while local animations are managed by the AnimationState on individual sprites. This allows you to apply a single configuration broadly or handle per-sprite playback configurations independently.

How do I generate animation frames from a spritesheet or texture atlas in Phaser 4?

You generate animation frames in Phaser 4 by loading a spritesheet or texture atlas into the scene, then defining the frame sequence within the AnimationManager. This process extracts individual frames and prepares them for playback controls and frame callbacks.

Can I chain multiple sprite animations together in Phaser 4?

Yes, you can chain sprite animations in Phaser 4 to create seamless transitions like character idle to walk sequences. The animation system supports chaining playback, allowing one animation to trigger another automatically upon completion.

How do I handle animation events and frame callbacks for sprites in Phaser 4?

You handle animation events and frame callbacks in Phaser 4 by attaching listeners to the AnimationState during playback. This allows you to trigger specific code execution on designated frames or when animation events occur across individual sprites and groups.

Does this Phaser 4 animation approach work for managing multiple sprites in a group?

Yes, the Phaser 4 animation system supports handling playback configurations and events across individual sprites and groups. You can apply global animations defined in the AnimationManager to multiple sprites simultaneously while maintaining local control.