Steering Behaviors Part 1: Seek

This tutorial shows an HTML5 implementation of the Seek Steering Behavior in which a vehicle (seeker) moves in a realistic manner toward a target using the seek algorithm.

The Steering Behaviors are artificial intelligence algorithms which allow autonomous characters to move in a realistic manner. They are developed by Craig Reynolds and the first one is the seek algorithm. It is presented here by math vectors, pseudo-code and a simple live demo programmed in HTML5 using Phaser framework.

The source code is included at the end of the tutorial. It is also available for download on Github!


Live Demo

The green arrow (seeker) seeks the blue circle (target) and moves toward it. Use your mouse to move the blue circle (target) on some other location.



Vectors and pseudo-code

Steps 1-3: Calculating the desired velocity


  • 1. Vector (desired velocity) = Position (target) – Position (vehicle)
  • 2. Normalize Vector (desired velocity)
  • 3. Scale Vector (desired velocity) to the maximum speed


Steps 4-5: Calculating the steering force


  • 4. Vector (steering force) = Vector (desired velocity) – Vector (current velocity)
  • 5. Limit the magnitude of Vector (steering force) to the maximum force


Steps 6-7: Calculating the vehicle’s new velocity


  • 6. Vector (new velocity) = Vector (current velocity) + Vector (steering force)
  • 7. Limit the magnitude of Vector (new velocity) to the maximum speed



The source code



Leave a Reply

Your email address will not be published. Required fields are marked *