skills.rest
simon-tanna
simon-tannaCOMMUNITY
Explore all skills by this author →
GitHub

animations

Automate sprite animation creation and playback in Phaser 4 games using YAML frontmatter.

Updated May 24, 2026
Search Tags:#game development#sprite animations#phaser 4#animation management#atlas animations#spritesheet animations
One-click install
npx skills add https://github.com/simon-tanna/pip-maze-v-2 --skill animations-simon-tanna
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: animations
Source: https://github.com/simon-tanna/pip-maze-v-2/tree/main/.claude/skills/animations
Command: npx skills add https://github.com/simon-tanna/pip-maze-v-2 --skill animations-simon-tanna

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires phaser, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill unit helps automate the process of creating and controlling sprite animations in Phaser 4 games, reducing the manual labor involved in animating spritesheets and handling animation states.

Core Features & Use Cases

  • Automated Animation Creation: Build animations from spritesheets and atlases without manual frame-by-frame editing.
  • Animation Management: Control animation playback, including play, pause, stop, and chaining animations.
  • Event Handling: Trigger actions based on animation events such as start, complete, and frame updates.
  • Use Case: If you are developing a game in Phaser 4 and need to animate your characters' movements and actions, this Skill can greatly simplify the animation workflow.

Quick Start

Create a sprite animation and play it using the following command:

this.load.spritesheet('dude', 'dude.png', { frameWidth: 32, frameHeight: 48 });
this.anims.create({
    key: 'run',
    frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 7 }),
    frameRate: 10,
    repeat: -1
});
const sprite = this.add.sprite(400, 300, 'dude');
sprite.play('run');

Frequently Asked Questions about animations

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

FAQPage Schema
How do I automate sprite animation creation in Phaser 4?▼

Control sprite animation playback in Phaser 4 using built-in scripts for play, pause, stop, and chaining animations. This allows seamless management of character movements and action states.

Can I trigger game events based on Phaser 4 animation updates?▼

Trigger game events based on Phaser 4 animation updates by attaching actions to animation events such as start, complete, and frame updates. This synchronizes game mechanics with sprite animations.

Does the Phaser library support both spritesheet and atlas animations?▼

The Phaser library supports both spritesheet and atlas animations. This Skill automates building these animation types from your assets without requiring manual frame-by-frame editing.

What is the best way to manage character animation states in Phaser 4?▼

Manage character animation states in Phaser 4 by defining animation parameters in YAML frontmatter. This streamlines switching between character movements and actions during game development.

Do I need the Phaser library to use this sprite animation Skill?▼

You need the Phaser library installed to use this sprite animation Skill. It requires Phaser's built-in animation capabilities to generate sequences and control playback.

Related Skills

Explore More Software Engineering Skills→
ArtRivArtRiv

animations

Manage Phaser 4 sprite animations with global definitions and per-sprite playback.

Community
Intermediate
diegolinharesdiegolinhares

animations

Automates sprite animation creation and management in Phaser 4 games.

Community
Intermediate
AutinhorseAutinhorse
3

animations

Create and control Phaser 4 sprite animations with spritesheets and atlases.

Community
Intermediate
ckyeonckyeon

animations

Create and control sprite animations in Phaser 4 games.

Community
Intermediate