{
  "markdown": "# phaser4-gamedev\n\nA portable agent-skills package and Claude Code plugin that makes building [Phaser 4](https://phaser.io) web games fast and easy. It ships **26 portable skills**, **5 Claude Code subagents**, **10 Claude slash commands**, and **2 Claude hooks** that encode deep Phaser 4 (v4.2.1) knowledge — so you can build any 2D web game without needing to memorize the API.\n\nIt covers the whole loop, not just the coding part:\n\n```\n/phaser-brainstorm ──► /phaser-gdd ──► /phaser-new ──► phaser-coder\n    shape & scope          plan          scaffold        implement\n                             │                               │\n                             │                               ▼\n                             │                       /phaser-playtest ──► /phaser-release\n                             │                        VERIFY RUNNING            ship\n                             │                          ▲       │                 │\n                             │                          └─ fix ─┘                 ▼\n                             │                              ▲             /phaser-feedback\n                             │                              └──── repro ───────┘\n                             └── acceptance criteria ───────────► playtest scenarios\n```\n\nTwo steps most toolkits skip. The first is `/phaser-playtest`. `tsc --noEmit` proves your code\n*compiles*; it says nothing about whether the game *runs*. A mistyped asset path, a\nscene left out of `scene: []`, a throw partway through `create()` — all type-check\nperfectly and all ship a black screen. The playtest harness boots the real game in\nheadless Chromium, drives real input, and reports what actually happened.\n\nThe second is `/phaser-feedback`. Paste what players actually wrote — Discord messages,\nitch.io comments, QA notes — and it triages them, reproduces each defect as a *failing*\nplaytest scenario, fixes it, verifies the fix, and drafts the reply. The scenario stays\nbehind as a regression test, so feedback compounds instead of recurring.\n\n## Features\n\n- **26 Portable Skills** — installable with `npx skills add` for Codex, Claude Code, Cursor, OpenCode, and other compatible coding agents\n- **5 Claude Code Agents** — specialized subagents for architecture, coding, debugging, asset management, and playtesting\n- **10 Claude Commands** — `/phaser-brainstorm`, `/phaser-gdd`, `/phaser-new`, `/phaser-run`, `/phaser-playtest`, `/phaser-validate`, `/phaser-build`, `/phaser-analyze`, `/phaser-release`, `/phaser-feedback`\n- **Feedback → failing test → fix** — paste raw player feedback and get it triaged, reproduced as a playtest scenario, fixed, and verified, with the scenario kept as a regression test\n- **Flake detection** — `--repeat N` classifies a bug as clean, intermittent, or consistent, and `--seed` separates an RNG bug from a timing bug. \"It only happens sometimes\" becomes actionable\n- **Full Phaser 4 renderer coverage** — Filters (which replaced FX *and* masks), stencils, cone lights, `Mesh2D`, `SpriteGPULayer`, tint modes, alpha strategies\n- **Headless Playtest Harness** — a real, runnable Playwright script that boots the game, catches black screens, asset 404s, uncaught exceptions and FPS collapse, drives scripted input, and asserts on live game state\n- **2 Claude Hooks** — PreToolUse v3 API guard (catches deprecated APIs before code is saved) + SessionStart Phaser project detector\n- **9 Game Archetypes** — platformer, top-down RPG, space shooter, match-3 puzzle, tower defense, endless runner, card game, fighting game, racing — full specs with `/phaser-new`\n- **Game Design Documents** — generate comprehensive 13-section GDDs with `/phaser-gdd`\n- **Project Analysis** — analyze existing projects for architecture, performance, and code quality with `/phaser-analyze`\n- **Device Profiles** — platform-specific optimization guides for iOS, Android, desktop, Capacitor, and PWA\n- **Asset Sourcing** — guides for finding free assets, creation tools, and placeholder-to-production workflows\n- **Phaser 4 Beam renderer knowledge** — the new WebGL renderer, shader system, and performance improvements\n- **All v3→v4 breaking changes encoded** — `Geom.Point`, `Math.PI2`, `Structs`, `DynamicTexture.render()`, removed plugins\n- **TypeScript-first** — all examples and templates use TypeScript with correct tsconfig for Phaser 4\n\n---\n\n## Installation\n\nChoose the install path based on what you want:\n\n| Install path | Best for | Installs |\n|---|---|---|\n| **skills.sh / `npx skills`** | Codex, Cursor, OpenCode, Claude Code standalone skills, and other Agent Skills-compatible tools | Portable `skills/*/SKILL.md` only |\n| **Claude Code plugin** | Claude Code users who want the full plugin experience | Skills, Claude subagents, slash commands, and hooks |\n\nThe portable skills and Claude plugin can coexist. Use the skills.sh path for cross-agent portability; use the Claude Code plugin path when you specifically want Claude Code commands, agents, and hooks.\n\n### skills.sh / Agent Skills\n\nThis repository is compatible with the open Agent Skills CLI that powers [skills.sh](https://skills.sh). The CLI discovers every `SKILL.md` under `skills/`, so the Phaser toolkit can be installed directly into Codex or any supported coding agent.\n\nList the available skills:\n\n```bash\nnpx skills add Yakoub-ai/phaser4-gamedev --list\n```\n\nInstall all Phaser skills into Codex globally:\n\n```bash\nnpx skills add Yakoub-ai/phaser4-gamedev --skill '*' --agent codex --global\n```\n\nInstall all Phaser skills into Claude Code as standalone Agent Skills:\n\n```bash\nnpx skills add Yakoub-ai/phaser4-gamedev --skill '*' --agent claude-code --global\n```\n\nInstall all Phaser skills into every supported agent:\n\n```bash\nnpx skills add Yakoub-ai/phaser4-gamedev --all\n```\n\nRestart your coding agent after installing so it reloads its skills directory. For Codex global installs, the target skills directory is `~/.codex/skills/`.\n\nThe portable skills include the original lifecycle skills plus portable equivalents of the Claude subagents:\n\n- `phaser-architect`\n- `phaser-coder`\n- `phaser-debugger`\n- `phaser-asset-advisor`\n\n`phaser-playtest` is the portable equivalent of the `phaser-playtester` subagent — the harness is a plain Node script, so it works from any agent (or from your own terminal and CI) with no Claude Code dependency.\n\nThe repository also includes `.codex-plugin/plugin.json` with `skills: \"./skills/\"` for Codex plugin discovery.\n\nTo make this repository discoverable/installable through skills.sh-compatible tooling, keep the `skills/<skill-name>/SKILL.md` structure valid and publish the repository. There is no `skills.sh` file to edit in this repo; users install from the GitHub repo with `npx skills add Yakoub-ai/phaser4-gamedev`.\n\n### Claude Code plugin\n\nUse this path when you want the complete Claude Code integration: plugin-scoped skills, subagents, slash commands, and hooks.\n\n#### Prerequisites\n\n- [Claude Code](https://claude.ai/code) CLI installed and authenticated\n\n#### Recommended: Playwright (for `/phaser-playtest`)\n\nThe playtest harness needs a browser. Install it once per game project:\n\n```bash\nnpm install -D playwright && npx playwright install chromium\n```\n\nWithout it, everything else still works — you just lose runtime verification, which is\nthe part that catches black screens.\n\n#### Optional: Context7 MCP Server\n\nThe agents verify Phaser 4 APIs against `node_modules/phaser/types/phaser.d.ts` in your\nproject first — that is the exact signature for your installed version and cannot be out\nof date. [Context7](https://github.com/upstash/context7) is an optional addition that\nsupplies the prose and examples type definitions lack, which is useful during the RC\nphase. The agents' `tools` allowlists already grant the Context7 MCP tools, so it works\nas soon as the server is configured.\n\n#### Method 1: Interactive (recommended)\n\nInside a Claude Code session, run these two slash commands:\n\n```\n/plugin marketplace add Yakoub-ai/phaser4-gamedev\n/plugin install phaser4-gamedev@phaser4-gamedev\n```\n\nWhen prompted, choose your preferred scope. Claude Code plugin scopes map to these settings files:\n\n| Scope | Settings file | When to use |\n|---|---|---|\n| **User** | `~/.claude/settings.json` | Personal use across all projects |\n| **Project** | `.claude/settings.json` | Share with your team (commit this file) |\n| **Local** | `.claude/settings.local.json` | Personal override in a shared repo |\n\nRestart Claude Code after installing so the plugin is loaded from Claude's plugin cache.\n\n#### Method 2: Manual Claude Code settings\n\nAdd two entries to your settings file directly.\n\n**User scope** (`~/.claude/settings.json`) — active in all your projects:\n\n```json\n{\n  \"extraKnownMarketplaces\": {\n    \"phaser4-gamedev\": {\n      \"source\": {\n        \"source\": \"github\",\n        \"repo\": \"Yakoub-ai/phaser4-gamedev\"\n      }\n    }\n  },\n  \"enabledPlugins\": {\n    \"phaser4-gamedev@phaser4-gamedev\": true\n  }\n}\n```\n\n**Project scope** (`.claude/settings.json` in your game repo) — loads automatically for everyone who opens the project:\n\n```json\n{\n  \"extraKnownMarketplaces\": {\n    \"phaser4-gamedev\": {\n      \"source\": {\n        \"source\": \"github\",\n        \"repo\": \"Yakoub-ai/phaser4-gamedev\"\n      }\n    }\n  },\n  \"enabledPlugins\": {\n    \"phaser4-gamedev@phaser4-gamedev\": true\n  }\n}\n```\n\nThen start (or restart) Claude Code — the plugin loads automatically.\n\n---\n\n#### Method 3: Claude Code CLI\n\nClaude Code also supports non-interactive plugin management from the shell:\n\n```bash\nclaude plugin marketplace add Yakoub-ai/phaser4-gamedev\nclaude plugin install phaser4-gamedev@phaser4-gamedev --scope user\n```\n\nUse `--scope project` instead of `--scope user` when you want to write the plugin install to `.claude/settings.json` for a shared repository.\n\n---\n\n#### Verify the installation\n\n```\n/plugin\n```\n\nYou should see `phaser4-gamedev` in the installed plugins list. Then verify the Claude Code plugin features you need:\n\n- Run `/help` and confirm the Phaser slash commands are present.\n- Check `/agents` for the Phaser subagents.\n- Test a command such as `/phaser-new` or `/phaser-gdd`.\n\n---\n\n## Claude Code Agents\n\nAgents are autonomous subagents that Claude Code launches automatically based on your request. You never need to call them by name.\n\n### `phaser-architect`\n\nDesigns game architecture before you start coding.\n\n**Triggers:** \"design a game\", \"plan scene flow\", \"structure my Phaser project\", \"what scenes do I need?\"\n\n**Produces:**\n- ASCII scene flow diagram\n- Complete `Phaser.Types.Core.GameConfig` TypeScript config\n- Module directory structure (`src/scenes/`, `objects/`, `managers/`)\n- State management plan (Registry, events, direct refs)\n- Asset pipeline strategy\n\n---\n\n### `phaser-coder`\n\nWrites all Phaser 4 game code. This is the primary coding agent.\n\n**Triggers:** \"add a player\", \"implement movement\", \"create game logic\", \"add enemies\", \"implement scoring\", \"create animations\"\n\n**Knows:**\n- Full scene lifecycle (`init` / `preload` / `create` / `update`)\n- Arcade Physics sprites, groups, colliders, overlaps\n- Input (keyboard, pointer, gamepad), animations, tweens, audio, tilemaps\n- Object pooling for bullets/enemies\n- HUD and parallel scene patterns\n- All Phaser 4 TypeScript types\n\n---\n\n### `phaser-debugger`\n\nDiagnoses and fixes Phaser 4 issues systematically.\n\n**Triggers:** \"black screen\", \"sprite not showing\", \"physics not working\", \"collision not detected\", \"game crashes\", \"error in console\"\n\n**Diagnoses:**\n- Black screen (missing scenes, 404 assets, canvas sizing)\n- Invisible sprites (position, alpha, depth, key mismatch)\n- Physics failures (wrong creation method, missing collider)\n- Animation failures (key mismatch, wrong frame dimensions)\n- Performance problems (object pooling, particle caps, static groups)\n- All v3→v4 migration errors\n\n---\n\n### `phaser-playtester`\n\nVerifies the game actually runs. Owns runtime verification the way phaser-coder owns implementation.\n\n**Triggers:** \"playtest my game\", \"does it actually work\", \"verify the game runs\", \"smoke test\", \"write a playtest scenario\", \"check FPS\", \"screenshot the game\"\n\n**Does:**\n- Boots the game in headless Chromium and reports what really happened\n- Catches black screens, asset 404s (including files the dev server masks as `200 text/html`), uncaught exceptions, dead scenes, FPS collapse\n- Drives scripted input — keys, clicks, touch — and asserts on live `Phaser.Game` state\n- Turns GDD acceptance criteria into regression scenarios\n- States plainly what it could *not* verify (audio audibility, real-device perf, whether the game is fun)\n\n---\n\n### `phaser-asset-advisor`\n\nGuides asset loading, packing, and optimization.\n\n**Triggers:** \"sprite sheets\", \"texture atlases\", \"loading assets\", \"tile maps\", \"audio formats\", \"game loads slowly\"\n\n**Covers:**\n- Spritesheet vs atlas vs individual images\n- Texture atlas creation (free-tex-packer, TexturePacker)\n- Audio: mp3+ogg pairs, audio sprites, Web Audio\n- Tiled editor workflow (JSON export, collision properties)\n- PreloaderScene with progress bar\n- Asset size budgets and optimization\n\n---\n\n## Skills\n\n### Core Skills\n\n### `/phaser-init` — Scaffold a New Project\n\n```\n\"create a Phaser 4 game\" / \"scaffold a Phaser project\" / \"set up a new game\"\n```\n\nScaffolds a complete Phaser 4 project with TypeScript + Vite:\n\n```bash\nnpm create @phaserjs/game@latest   # official scaffolder (recommended)\n# or manual: creates package.json, tsconfig.json, vite.config.ts,\n#            index.html, src/main.ts, src/scenes/{Boot,Preloader,Game}Scene.ts\n```\n\nIncludes `examples/` with ready-to-copy templates:\n- `game-config.ts` — complete GameConfig with all options annotated\n- `boot-scene.ts` — minimal BootScene starter\n- `vite-config.ts` — Vite config with `base: './'` for itch.io deployment\n\n---\n\n### `/phaser-scene` — Create Scenes\n\n```\n\"create a scene\" / \"add a menu scene\" / \"create a pause screen\" / \"set up scene transitions\"\n```\n\nGenerates any scene type with correct patterns:\n\n| Scene Type | Pattern Used |\n|---|---|\n| BootScene | Minimal, fast, hands off to Preloader |\n| PreloaderScene | Loading bar with `this.load.on('progress')` |\n| MainMenuScene | Interactive buttons with hover states |\n| GameOverScene | `init(data)` to receive final score |\n| HUDScene | Parallel via `this.scene.launch()`, event-driven |\n| PauseScene | Modal overlay with `this.scene.pause('GameScene')` |\n\nCovers scene transitions, cross-scene communication (Registry, events, direct refs), and data passing via `this.scene.start('Key', { data })`.\n\n---\n\n### `/phaser-gameobj` — Add Game Objects\n\n```\n\"add a sprite\" / \"create a player\" / \"add text\" / \"create particles\" / \"add a tilemap\"\n```\n\nCovers every game object type:\n\n- **Sprites** — static and physics-enabled, atlas frames, animations\n- **Images** — backgrounds, parallax with `setScrollFactor()`\n- **Text / BitmapText** — styled text, HUD labels, floating damage numbers\n- **Graphics** — draw shapes, health bars, debug overlays\n- **Containers** — group objects for relative positioning\n- **Groups** — static and physics groups, object pooling\n- **Particles** — emitters with `maxParticles` cap for performance\n- **TileSprites** — scrolling backgrounds\n\n---\n\n### `/phaser-physics` — Set Up Physics\n\n```\n\"add physics\" / \"set up collisions\" / \"create a platformer\" / \"top-down movement\" / \"detect overlaps\"\n```\n\nFull Arcade Physics coverage with **genre recipes**:\n\n- **Platformer** — gravity, jump (`blocked.down`), variable jump height, coyote time\n- **Top-down** — no gravity, 8-directional, diagonal normalization\n- **Space shooter** — velocity-based, angle firing with `velocityFromAngle()`\n- **Object pooling** — bullet groups with `classType`, `maxSize`, `runChildUpdate`\n\n---\n\n### `/phaser-build` — Build and Deploy\n\n```\n\"build my game\" / \"run my Phaser game\" / \"deploy to itch.io\" / \"fix build errors\"\n```\n\nCovers:\n- Dev server (`npm run dev`), production build (`npm run build`)\n- TypeScript errors: `input.keyboard!`, body casting, scene casting\n- Common issues: 404 assets (must be in `public/`), a missing `phaser` dependency\n- Deployment to itch.io, GitHub Pages, Netlify/Vercel, Capacitor (iOS/Android)\n- Includes `scripts/validate-project.sh` — automated health check\n\n---\n\n### `/phaser-playtest` — Verify the Game Actually Runs\n\n```\n\"playtest my game\" / \"does my game actually work\" / \"test it in a browser\" / \"smoke test\"\n```\n\nRuns the game in headless Chromium and reports what really happens:\n\n```bash\nnode skills/phaser-playtest/scripts/playtest.mjs --project .\n```\n\n```\n[PASS] page loads — HTTP 200\n[PASS] canvas created — 800x600\n[PASS] Phaser game instance found — window.__PHASER_GAME__\n[INFO] renderer — WEBGL (Phaser 4.2.1)\n[PASS] active scenes — GameScene(43 objects)\n[PASS] frame rate — median 60 fps, 5th pct 59 fps (91 frames)\n[PASS] canvas renders content — 333 distinct colours, 5.6% non-background\n[FAIL] all assets load — HTTP 200 but served as text/html — file is missing\n       and the dev server returned index.html instead  /assets/player.png\n```\n\nChecks the page loads, the canvas exists and is **not blank**, Phaser booted, scenes\nare active and holding display objects, frame rate holds, and every asset loaded — plus\nconsole errors, uncaught exceptions, and failed requests. Writes `.playtest/report.json`\nand PNG screenshots. Exits non-zero on failure, so it drops straight into CI.\n\nScenarios drive real input and assert on live state:\n\n```javascript\nexport default [\n  { name: 'walk right', action: 'key', key: 'ArrowRight', duration: 600 },\n  { name: 'player advanced', action: 'expect',\n    expect: { expression: `game.scene.getScene('GameScene').player.x > 400`, equals: true } },\n  { name: 'attack lands', action: 'press', key: 'Space',\n    expect: { expression: `game.registry.get('enemyHp')`, atMost: 90 } },\n];\n```\n\n`--mode build` tests the production bundle (where `base`-path and tree-shaking bugs\nlive). `--device iphone` tests a mobile viewport. Requires\n`npm install -D playwright && npx playwright install chromium`.\n\n---\n\n### `/phaser-migrate` — Migrate from Phaser 3\n\n```\n\"migrate from Phaser 3\" / \"upgrade to Phaser 4\" / \"my v3 game broke after upgrading\"\n```\n\nScans your `src/` directory for every breaking change and applies fixes:\n\n| v3 (removed) | v4 (use instead) |\n|---|---|\n| `Phaser.Geom.Point` | `Phaser.Math.Vector2` |\n| `Math.PI2` | `Math.TAU` (correctly π×2) |\n| `Phaser.Structs.Map/Set` | Native JS `Map` / `Set` |\n| `DynamicTexture.draw()` | `.draw()` + `.render()` |\n| `TileSprite.setCrop()` | `RenderTexture` |\n| Camera3D, Layer3D | No replacement (2D only) |\n| Facebook plugin | Removed |\n| Bundled Spine plugin | Official Esoteric Software plugin |\n\n---\n\n### Game Systems\n\n### `/phaser-audio` — Audio System\n\n```\n\"add sound effects\" / \"play background music\" / \"set up audio\" / \"audio not playing on mobile\"\n```\n\nCovers Web Audio vs HTML5, loading mp3+ogg pairs, sound pooling, audio sprites, volume management, mute buttons, mobile audio unlock, crossfading between scenes, and cleanup on shutdown.\n\n---\n\n### `/phaser-animation` — Animations and Tweens\n\n```\n\"animate a sprite\" / \"add walk cycle\" / \"tween a button\" / \"create particle effects\"\n```\n\nCovers spritesheet and atlas-based animations, character state machines, animation chaining and events, tweens (fade, scale, slide, bounce), easing functions, tween timelines, and particle animations.\n\n---\n\n### `/phaser-input` — Input Handling\n\n```\n\"add keyboard controls\" / \"handle mouse clicks\" / \"add gamepad support\" / \"detect touch input\"\n```\n\nCovers keyboard (cursors, WASD, combos), pointer/mouse (drag-and-drop, input zones), multi-touch (swipe detection), gamepad (analog sticks with dead zones), and virtual joystick patterns.\n\n---\n\n### `/phaser-tilemap` — Tilemaps\n\n```\n\"add a tilemap\" / \"set up Tiled\" / \"tile collision\" / \"parallax layers\"\n```\n\nFull Tiled Editor workflow — creating maps, tilesets, collision properties, layer naming conventions, object layers (spawn points, triggers), camera/world bounds, dynamic tile manipulation, and parallax.\n\n---\n\n### `/phaser-ui` — User Interface\n\n```\n\"add a health bar\" / \"create buttons\" / \"build a dialog box\" / \"add a minimap\"\n```\n\nCovers health bars (Graphics-based), score/text displays, interactive buttons, dialog boxes (Container-based), minimap, progress bars, BitmapText for performance, DOM overlay, responsive scaling, and HUD-as-parallel-scene pattern.\n\n---\n\n### Advanced Features\n\n### `/phaser-matter` — Matter.js Physics\n\n```\n\"use Matter physics\" / \"polygon collision\" / \"add constraints\" / \"create sensors\"\n```\n\nCovers Arcade vs Matter decision guide, body types (rectangle, circle, polygon, compound, static), forces, collision filtering with categories/bitmasks, sensors/trigger zones, constraints (distance, spring, pin/hinge), and debug rendering.\n\n---\n\n### `/phaser-saveload` — Save and Load\n\n```\n\"save the game\" / \"load game state\" / \"add auto-save\" / \"multiple save slots\"\n```\n\nCovers what to save vs reconstruct, localStorage patterns, typed SaveData with defaults, SaveManager class, multi-slot saves, auto-save (event + periodic), Registry integration, settings storage, hi-score tables, save data versioning, and cloud save architecture.\n\n---\n\n### `/phaser-mobile` — Mobile Deployment\n\n```\n\"deploy to mobile\" / \"responsive scaling\" / \"touch controls\" / \"make a PWA\"\n```\n\nCovers Scale Manager modes (FIT/ENVELOP/RESIZE), touch controls and responsive layout, preventing browser gestures, mobile audio unlock, device detection, performance guidelines, Capacitor deployment (iOS/Android), and PWA setup (manifest, service worker). Includes device-specific profiles for iOS Safari, Android Chrome, desktop, Capacitor, and PWA.\n\n---\n\n### `/phaser-gdd` — Game Design Document\n\n```\n\"write a game design document\" / \"create a GDD\" / \"design my game\" / \"plan game progression\"\n```\n\nGenerates a comprehensive 13-section Game Design Document: game overview, core loop, mechanics deep dive, progression system, level/world design, characters & entities, UI/UX wireframes, art direction, audio design plan, technical requirements, platform targets, monetization/release plan, and machine-checkable acceptance criteria. Includes example GDD templates for platformer, puzzle, and RPG genres.\n\n---\n\n### `/phaser-analyze` — Project Analysis\n\n```\n\"analyze my game\" / \"review my Phaser project\" / \"audit project health\" / \"find bottlenecks\"\n```\n\n5-phase analysis for existing Phaser projects: discovery (file/scene/LOC counts), architecture assessment (A-F grade), performance audit (pooling, particles, static groups), API correctness (v3 scan, TypeScript strictness), and best practice check (lifecycle, cleanup, debug flags). Produces a structured report with improvement roadmap and quick wins. Includes automated `analyze-project.sh` script.\n\n---\n\n## Claude Code Commands\n\n| Command | Description |\n|---|---|\n| `/phaser-new [template]` | Scaffold a new game — optionally from an archetype (`platformer`, `topdown`, `shooter`, `puzzle`, `towerdefense`, `runner`, `cardgame`, `fighting`, `racing`) |\n| `/phaser-run` | Start the dev server and verify the game boots |\n| `/phaser-playtest [dev\\|build\\|mobile]` | Run the game headless and verify it actually works |\n| `/phaser-validate` | Run the project health check (structure, runtime, smoke tests, deploy checklist) |\n| `/phaser-build` | Production build and deployment prep |\n| `/phaser-gdd [genre]` | Generate a comprehensive 13-section Game Design Document |\n| `/phaser-analyze` | Analyze an existing project for architecture, performance, and code quality |\n| `/phaser-brainstorm [idea]` | Shape a game idea into something buildable and correctly scoped |\n| `/phaser-release [check\\|prepare\\|ship]` | Run the release gate and prepare the game for players |\n| `/phaser-feedback <paste>` | Triage player feedback, reproduce it, fix it, and verify |\n\n---\n\n## Claude Code Hooks\n\n| Hook | Event | Purpose |\n|---|---|---|\n| **v3 API Guard** | PreToolUse (Write/Edit) | Catches deprecated Phaser 3 APIs (`Geom.Point`, `Math.PI2`, `Structs.Map`, etc.) before code is saved |\n| **Project Detector** | SessionStart | Detects Phaser projects, shows available agents/commands/skills, and warns when Phaser is pinned to a pre-release |\n\n---\n\n## Phaser 4 Key Facts\n\n| Topic | Value |\n|---|---|\n| Install | `npm install phaser` — **not** `phaser@beta`, whose tag still points at `4.0.0-rc.7` |\n| Latest version | v4.2.1 (Giedi) |\n| Effects | Filters replaced FX *and* masks. Game objects need `enableFilters()` first; cameras do not |\n| Masking | `BitmapMask` and `createGeometryMask()` are gone. Use a camera viewport or `filters.internal.addMask()`. There is no `camera.setScissor()` |\n| Scaffold | `npm create @phaserjs/game@latest` |\n| Renderer | \"Phaser Beam\" (new WebGL, up to 16x faster filters on mobile) |\n| TypeScript types | Resolved automatically via Phaser's `exports` map — use `moduleResolution: \"bundler\"` and `import Phaser from 'phaser'`. The v3 `typeRoots`/`types: [\"Phaser\"]` pair breaks v4 builds. |\n| Core API vs v3 | Mostly identical (scenes, physics, input, audio, cameras) |\n\n---\n\n## Validation\n\nValidate the plugin structure:\n\n```bash\nbash scripts/validate-plugin.sh\n```\n\nValidate a Phaser 4 project's structure:\n\n```bash\nbash skills/phaser-build/scripts/validate-project.sh /path/to/your/game\n```\n\nVerify a Phaser 4 project actually runs:\n\n```bash\nnode skills/phaser-playtest/scripts/playtest.mjs --project /path/to/your/game\n```\n\n---\n\n## Plugin Structure\n\n```\nphaser4-gamedev/\n├── .claude-plugin/\n│   ├── plugin.json\n│   └── marketplace.json\n├── .codex-plugin/\n│   └── plugin.json\n├── agents/\n│   ├── phaser-architect.md      (opus)\n│   ├── phaser-coder.md          (sonnet)\n│   ├── phaser-debugger.md       (opus)\n│   ├── phaser-asset-advisor.md  (sonnet)\n│   └── phaser-playtester.md     (sonnet)\n├── commands/\n│   ├── phaser-new.md\n│   ├── phaser-run.md\n│   ├── phaser-playtest.md\n│   ├── phaser-validate.md\n│   ├── phaser-build.md\n│   ├── phaser-gdd.md\n│   ├── phaser-analyze.md\n│   ├── phaser-brainstorm.md\n│   ├── phaser-release.md\n│   └── phaser-feedback.md\n├── hooks/\n│   ├── hooks.json\n│   └── scripts/\n│       ├── check-v3-api.sh\n│       └── detect-phaser.sh\n├── skills/\n│   ├── phaser-init/         scaffolding + 9 game archetypes\n│   ├── phaser-architect/    portable architecture planning skill\n│   ├── phaser-coder/        portable implementation skill\n│   ├── phaser-debugger/     portable debugging skill\n│   ├── phaser-asset-advisor/ portable asset pipeline skill\n│   ├── phaser-scene/        scene creation and transitions\n│   ├── phaser-gameobj/      sprites, text, particles, containers\n│   ├── phaser-physics/      Arcade Physics + multiplayer patterns\n│   ├── phaser-playtest/     headless runtime verification harness + scenarios\n│   ├── phaser-build/        build, deploy, validate + testing patterns\n│   ├── phaser-migrate/      v3 → v4 migration\n│   ├── phaser-audio/        Web Audio, audio sprites, mobile unlock\n│   ├── phaser-animation/    spritesheets, tweens, state machines\n│   ├── phaser-input/        keyboard, mouse, touch, gamepad\n│   ├── phaser-tilemap/      Tiled workflow, layers, collision\n│   ├── phaser-ui/           health bars, buttons, dialogs, HUD\n│   ├── phaser-matter/       Matter.js physics, constraints, sensors\n│   ├── phaser-saveload/     save/load, auto-save, versioning\n│   ├── phaser-mobile/       Scale Manager, Capacitor, PWA, device profiles\n│   ├── phaser-gdd/          Game Design Document generation\n│   ├── phaser-analyze/      brownfield project analysis + automated script\n│   ├── phaser-brainstorm/   concept shaping, hooks, honest scope calibration\n│   ├── phaser-fx/           filters, masks, lights, stencils, Mesh2D, shaders\n│   ├── phaser-particles/    emitters, zones, gravity wells + 12 worked recipes\n│   ├── phaser-release/      readiness gate, versioning, store presence\n│   └── phaser-feedback/     player feedback → failing scenario → fix → reply\n└── scripts/\n    └── validate-plugin.sh\n```\n\n---\n\n## License\n\nMIT\n",
  "bytes": 28025,
  "sha": "75fda6935fdbc8e5d8f075e0f9fff98dcf7e33e648aa9a5287afc62110eaebc9",
  "repo_slug": "yakoub-ai/phaser4-gamedev",
  "fonte": "repo",
  "truncated": false,
  "api": "https://api.agentalog.com/api/listings/skl_yakoub_ai_phaser4_gamedev_phaser_scene_a41e889d/readme"
}