Phaser 4 UI Development

Phaser has no built-in UI toolkit. Build UI from game objects — Text, Graphics, Image, Container — or use a parallel HUDScene. The two fundamental approaches:

1. Scroll-fixed objects: Add game objects to the scene, call .setScrollFactor(0) so they stay fixed when the camera moves.
2. Parallel HUDScene: Launch a separate scene alongside the game scene. That scene's camera never moves, so everything in it is inherently fixed. Use this for complex UIs.

Always call .setDepth(100) (or higher) on UI elements so they render above game objects.

Health Bar (Graphics-based)