skills.rest
fiando
fiandoCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

dev-phaser-scene-management

Implements Phaser 3 scene transitions, data passing, and parallel scene lifecycle management.

1|Updated Mar 19, 2026
Search Tags:#typescript#game development#lifecycle#scene management#phaser#scene transitions#ui overlay
One-click install
npx skills add https://github.com/fiando/bake-tycoon --skill dev-phaser-scene-management-fiando
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: dev-phaser-scene-management
Source: https://github.com/fiando/bake-tycoon/tree/main/.github/skills/dev-phaser-scene-management
Command: npx skills add https://github.com/fiando/bake-tycoon --skill dev-phaser-scene-management-fiando

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires phaser.

What problem does it solve? Managing multiple game screens with manual DOM manipulation leads to fragile code, missing cleanup, and awkward data passing. This Skill provides patterns for using Phaser 3's built-in scene system to handle transitions, lifecycle, and inter-scene communication. ## Core Features & Use Cases - Scene Transitions with Data: Pass typed data between scenes via init() and apply fade or slide transition effects before switching. - Parallel UI Scenes: Run HUD or pause-menu overlays alongside gameplay using scene.launch(), sleep(), and wake(). - Reusable Scene Manager: A SceneManager class that persists scene data, applies transition effects, and handles overlay open/close flows. - Use Case: When building a Phaser game with a title screen, gameplay scene, and pause menu, use these patterns to switch scenes with fade effects, pass level and score data, and overlay a pause menu without stopping background rendering. ## Quick Start Show me how to transition from my TitleScene to GameScene in Phaser with a fade effect while passing the selected level and difficulty.

Frequently Asked Questions about dev-phaser-scene-management

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

FAQPage Schema
How do I pass data between scenes in Phaser 3?▼

Pass a data object as the second argument to this.scene.start(key, data) or this.scene.launch(key, data). The receiving scene reads it in its init(data) method, where you can apply defaults for missing fields.

How to create a pause menu overlay in Phaser?▼

Launch a separate PauseScene in parallel with this.scene.launch(), then call this.scene.pause() or this.scene.sleep() on the game scene. On resume, stop the pause scene and call wake() or resume() on the game scene.

What is the difference between scene.start and scene.launch in Phaser?▼

scene.start() stops the current scene and switches to the target scene. scene.launch() starts the target scene in parallel without stopping the current one, which is the correct choice for UI overlays and HUDs.

How do I add a fade transition between Phaser scenes?▼

Call this.cameras.main.fadeOut(duration, r, g, b), then listen for the camerafadeoutcomplete event and call this.scene.start() inside the callback so the switch happens after the fade finishes.

Why should I avoid scene.restart() in Phaser?▼

scene.restart() re-runs the full scene lifecycle including asset setup, which is expensive when called frequently. Prefer sleeping and waking scenes, or resetting only the specific state that changed.

Related Skills

Explore More Software Engineering Skills→
Yakoub-aiYakoub-ai
17

phaser-coder

Implement Phaser 4 game features with TypeScript and class-based scenes.

Official
Advanced
BasarEkinciBasarEkinci

save-system

Serialize and restore Unity game state across scenes using JSON.

Community
Advanced
Totes-MickGOATsTotes-MickGOATs
3

godot-tweening

Create programmatic animations in Godot Engine using the Tween node.

Community
Intermediate
dzyamikdzyamik

events-system

Unify EventEmitter usage across Phaser 4 game, scene, and input events.

Community
Advanced