skills.rest
phaserjs
phaserjsOFFICIAL
Explore all skills by this author →
Website𝕏@phaser_GitHub

curves-and-paths

Create and manage curved paths using Phaser 4 Path, Curve, and PathFollower APIs.

40.1k|7.2k|Updated Apr 12, 2013
Search Tags:#graphics#paths#phaser#game-development#curves#bezier#path-following
One-click install
npx skills add https://github.com/phaserjs/phaser --skill curves-and-paths-phaserjs
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: curves-and-paths
Source: https://github.com/phaserjs/phaser/tree/main/skills/curves-and-paths
Command: npx skills add https://github.com/phaserjs/phaser --skill curves-and-paths-phaserjs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Build and control complex motion paths for game objects, visuals, and interactions in Phaser 4, turning abstract trajectories into runnable paths.

Core Features & Use Cases

  • Create and manipulate paths from lines, splines, cubic and quadratic Bezier curves, and ellipses.
  • Sample points, measure length, and draw paths for debugging or visuals.
  • Drive sprites or graphics along paths with PathFollower and animation tweens.

Quick Start

In a Scene's create() method, create a Path, add curves, draw it with Graphics, and attach a PathFollower to move along the path.

Frequently Asked Questions about curves-and-paths

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

FAQPage Schema
How do I create and follow curved paths in Phaser for game objects?▼

To create curved paths in Phaser, build a Path using lines, splines, and Bezier curves, then attach a PathFollower to a sprite to move it along the route. You can draw the path using Graphics for debugging or visual rendering.

What types of curves can I use to build motion paths in Phaser?▼

Phaser motion paths support lines, splines, cubic and quadratic Bezier curves, and ellipses. You can construct complex trajectories by chaining these curve types together within a single Path object.

How do I sample points along a Bezier curve or spline in Phaser?▼

Sample points along a Phaser curve using getPoint, getPoints, or getSpacedPoints methods. These allow you to extract specific coordinates, distribute points evenly, and measure the total length of your path.

Can I rotate sprites while they follow a path in Phaser?▼

Yes, sprites can rotate while following a path in Phaser. The PathFollower API supports rotation behavior, allowing game objects to automatically orient themselves along the direction of the curve as they move.

What's the best way to draw and debug complex paths in Phaser?▼

The best way to draw and debug paths in Phaser is by using the Graphics API to render the Path. This visually confirms the trajectory built from lines, splines, and Bezier curves before attaching sprites.

How do I animate sprites along a path using tweens in Phaser?▼

Animate sprites along a path in Phaser by using the PathFollower API with animation tweens. Call startFollow to drive the sprite along the constructed route, controlling speed and movement duration.

Related Skills

Explore More Software Engineering Skills→
diegolinharesdiegolinhares

graphics-and-shapes

Create graphics and shapes in Phaser 4 using Graphics and Shape game objects.

Community
Intermediate
ArtRivArtRiv

tweens

Animate Phaser properties with tweens, easing, and staggered timing.

Community
Advanced
jallard-007jallard-007

curves-and-paths

Create, render, and animate sprites along mathematical curves in Phaser 4.

Community
Advanced
WanderTheWeebWanderTheWeeb
1

curves-and-paths

Construct Phaser 4 paths from curve segments and sample points.

Community
Intermediate