skills.rest
onemanking
onemankingCOMMUNITY
Explore all skills by this author →
GitHub

cameras

Implements Phaser 4 camera controls including scroll, zoom, follow, effects, and multi-camera viewports.

Updated Apr 13, 2026
Search Tags:#game development#javascript#camera#viewport#phaser#minimap#camera effects
One-click install
npx skills add https://github.com/onemanking/the-operator --skill cameras-onemanking
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: cameras
Source: https://github.com/onemanking/the-operator/tree/main/.github/skills/cameras
Command: npx skills add https://github.com/onemanking/the-operator --skill cameras-onemanking

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Working with Phaser 4's camera system involves many subtle concepts—viewport versus scroll coordinates, follow lerping, effect lifecycles, and multi-camera ignore lists—that are easy to misuse without a consolidated reference. ## Core Features & Use Cases - Camera Control: Scroll, zoom, rotate, set bounds, and follow sprites with lerp smoothing and deadzones using the CameraManager and Camera APIs. - Camera Effects: Trigger fade, flash, shake, pan, zoomTo, and rotateTo effects with easing, callbacks, and completion events. - Multi-Camera Layouts: Build minimaps and HUD overlays using multiple cameras with ignore lists, plus apply v4 filter effects to cameras. - Use Case: When building a Phaser 4 game scene, use this Skill to correctly set up a main camera that smoothly follows the player, a corner minimap camera, and a screen shake effect on impact events. ## Quick Start Ask the AI to show how to make the main camera follow a player sprite with smooth lerp and add a fade-in effect in a Phaser 4 scene.

Frequently Asked Questions about cameras

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

FAQPage Schema
How do I make the camera follow a sprite in Phaser 4?▼

Call cam.startFollow(target) on the camera, optionally passing lerp values like 0.1 for smooth tracking. You can add a deadzone with setDeadzone(width, height) so the camera only scrolls when the target leaves that rectangle.

How do I create a minimap with multiple cameras in Phaser?▼

Add a second camera with this.cameras.add(x, y, width, height), set a small zoom like 0.2, and position its viewport in a corner. Use ignore() on each camera so the minimap skips HUD objects and the main camera skips minimap-only elements.

What is the difference between camera viewport and scroll in Phaser?▼

The viewport is the on-canvas rectangle where the camera renders, set with setViewport or setPosition. Scroll is where the camera looks in the game world, set with setScroll or scrollX/scrollY. They are independent of each other.

Why does my Phaser camera effect not restart when called again?▼

Camera effects like fade, flash, shake, pan, and zoomTo do not restart while already running unless you pass force: true. Check the effect's isRunning property or pass the force flag to override the active effect.

Does Phaser 4 camera support post-processing filters?▼

Yes, Phaser 4 cameras have filters.internal and filters.external FilterLists for effects like blur, glow, and color matrix. Filters require WebGL and framebuffer rendering, which you can force with setForceComposite(true).

Why is my camera follow jittering with roundPixels enabled?▼

The roundPixels option only works correctly with integer zoom values. Non-integer zoom combined with roundPixels causes visible jitter, so either use integer zoom or disable roundPixels.

Related Skills

Explore More Software Engineering Skills→
quochung-cyouquochung-cyou

cameras

Control Phaser 4 camera effects, viewport adjustments, and sprite following.

Community
Advanced
mahirocokomahirocoko

cameras

Manage Phaser 4 cameras, viewports, and effects across scenes.

Community
Advanced
travispwingotravispwingo

cameras

Configure Phaser 4 cameras for scrolling, zooming, following sprites, and applying visual effects.

Community
Intermediate
jallard-007jallard-007

render-textures

Coordinate off-screen rendering workflows for Phaser 4 using RenderTexture and DynamicTexture.

Community
Advanced