Tutorial Downloads

File Size


Know another language? Translate this tutorial!

Grid-Based Movement

Favourite 49 favourites
Tutorial written by stemkoskiOriginally published on 4th, August 2014 - 1 revision

In this tutorial, I'll explain a simple way to move characters smoothly from one grid location to another.

The moving character will require two behaviors: Bullet and Timer. Set the initial Bullet speed to 0 in the properties window.

The main idea is to use the formula: speed = distance/time.
If you want to move a character D pixels over a total of T seconds, you need to set the Bullet speed to D/T. (I stored the time required to move one grid square as an instance variable.) Stop moving (set the speed to 0) after the time interval has finished (the Timer handles this). Also, you should not accept another input while the character is moving. And finally, at the end of each movement you need to round the character's position to the nearest grid square location.

If your character also needs to navigate around walls, I recommend doing preventative collision detection: add another condition to each event and check if there is a wall in the position you will be moving to by using the "overlapping at offset"; if there is, don't allow the movement. Also, make sure that your character is a few pixels smaller than the grid size (for instance, a 30-by-30 character on a 32-by-32 grid), otherwise, the character might along the edge of an adjacent square, producing unexpected (and undesired) results.

A screenshot of the Event Sheet is below, and you can download a Capx file that implements this idea.

Event Sheet for Grid-Based Movement

Hope this helps!

Unlock your full gamedev potential

Upgrade to the Personal Edition of Construct 2, it has way more features and won't holding back from making money and using your full creativity like the free edition does. It's a one off payment and all Construct 2 editor updates are free for life!

View deals

Plus, it's got a lot of additional features that will help you save time and make more impressive games!

Congratulations on finishing this tutorial!

Did you learn a lot from it? Share it now with your friends!

Share and Copy this Tutorial

You are free to copy, distribute, transmit and adapt this work with correct attribution. Click for more info.


Trimeister 1,308 rep

Hello Lee,

Thank you for including Grid-Movement.capx file. May I ask how to have the player moves faster.

Thank You,

[email protected]

Wednesday, April 27, 2016 at 7:28:48 AM
TwoCatsYelling 480 rep

I've recreated the basic code you have here (minus the checking for collision, since I don't have any walls in there yet). Instead of stopping after the move, my 'Player' object just keeps going. I've double, triple, even quadruple checked my setup to yours, side-by-side, using the same variable names, values, etc... and mine isn't working as it should. The GridSize, the MoveTime, the Timer, everything is setup identically.

Is there something you're doing in your project that you don't mention in the article, maybe?

Friday, June 10, 2016 at 2:01:24 AM
KoolEcky 16.3k rep

Good start but am trying to figure out how it can be improved. Thanks for the inspiration @ stemkoski.

Saturday, October 01, 2016 at 7:11:26 AM

Leave a comment

Everyone is welcome to leave their thoughts! Register a new account or login.