All projects
BabylonJS

BabylonJS Point-to-Navigate Character (PTN)

Click anywhere on the ground to move — point-to-navigate character controller in BabylonJS. Pathfinding via Recast, smooth rotation, blend animations.

Click a point on the ground → character pathfinds and walks there. Common pattern in RPGs, strategy games, and architectural walkthroughs. Touch-friendly — tap = destination.

How it works

Scene picks ground mesh on pointer down, passes hit point to Recast crowd agent via agentGoto(). Agent velocity drives animation state (idle/walk) and character rotation via LerpAngle each frame.

Visual feedback: a pulsing emissive disc marker placed at the click point.

Pathfinding

Recast navmesh built from the ground mesh at scene load. RecastJSPlugin + createCrowd() handles obstacle avoidance and path smoothing. Implementation logic in main.js in the js folder.

PTN vs WASD

PTNWASD
FeelStrategic, deliberateImmediate
PathfindingRequiredNot needed
TouchNatural (tap = destination)Needs virtual stick

Built by

Viseni Design Studio

3D, WebGL, interactive & VR/AR experiences

Visit viseni.com