Building a basic board game - Board, tokens and moving them!

Favourite 65 favourites
Tutorial written by vee41Originally published on 15th, August 2013 - 1 revision


In this tutorial I describe one way to set up a basic board game. I'll go through creating the board, tokens and moving the tokens. It's designed to be easy to expand, so you can start adding your own rules and mechanics on top of it with little effort. This could be the base for more traditional board game or turn-based strategy game.

Prior knowledge and requirements

This tutorial requires some prior construct 2 knowledge, so you should be familiar with following concepts:

- UID's and IID's
- Arrays
- Behavior expressions

The full .capx file is attached to this tutorial.

There are lots of comments in the .capx file, so most of the details are explained there. This tutorial mostly overviews what the example file holds.

Requires: MoveTo plugin by rexrainbow

The board

This is the basic board. Squares and tokens!

Lets start with the board. It's done with sprites (note the uniform size of 64x64) to give control over what is happening on the board. The square sprite in the example .capx has two animations; one for walls and one for standard empty squares. Walls block movement, they have the solid behavior enabled. The squares are linked together with an array, which is representation of the board in numerical form. This allows us for example to easily refer to surrounding squares, it is used to highlight the movement range of tokens.

This example requires that the board is rectangular, but you can set squares invisible if you wish to go around this limitation.

The array creation. Deep stuff.

The tokens

The possible token movements are highlighted when you click on a token. This utilizes the array we built at start of the layout to check if the neighboring squares are free to move into. In this example, walls and other tokens block movement.

Moving a token with range of 2 squares. As you can see, other tokens and walls are blocking movement

The token movement is done using pathfinder behavior. When pathfinder finds it's route, we create movement markers on the board to display the squares token moves through. The movement itself uses custom MoveTo plugin for convenience. You can fetch the plugin here:

The token movement. As you can see, it's quite 'automated' and just done for purpose of this tutorial. If you wish your tokens to move in different way, it's easy to modify. That's it!

Feel free to message me with any questions or improvement suggestions! :)

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.


DUTOIT 12.8k rep

.capx file? I built my own token movement via C2 without plugins, would love to see what moveto looks like. And if it can handle multiple players etc. Could you please re attach the .capx file it seems to be missing. So that I can get a better Idea of movement. Seeing a working example is better ;)
Thanks for tuts.

Edit: I'm blind .capx file top left corner in margin "Tutorial Downloads"
Edit: Damn, its saved in beta version 141 - I'm still using 139 stable.

Thursday, August 15, 2013 at 3:00:58 PM
DUTOIT 12.8k rep

Okay, just installed latest beta. This is pretty cool. Thank you so much, I was trying to avoid using plugins, but this is so pretty. Glides smoothly etc. I am going to have to play around with this. Very nice tut, thank you.

Thursday, August 15, 2013 at 3:24:37 PM
vee41 7,352 rep

@Dutoit Yeah, moveTo is basically simple way of doing the movement in single event. It's nothing that could not be done with standard behaviors, but I like the simplicity of it :)

Glad you liked the tutorial, thank you very much for the comments!

Friday, August 16, 2013 at 6:08:40 AM
AbelaNET 14.9k rep

Thanks for this tutorial. Really cool.

Friday, August 16, 2013 at 8:55:55 AM
vee41 7,352 rep

@AbelaNET Glad you like it! :)

Saturday, August 17, 2013 at 5:37:50 PM
Wolod 6,264 rep

Very good tutorial! Found some bugs. First: you can highlight movement for multiple tokens at the same time. Solved it easily. Second: in some cases tokens moved through each other to reach their destination point. Solved with enabling solid when square is taken and regenerating obstacle map. I wasn't able to solve the last problem. When I change token.move variable to a number greater than 2 highlighting is behaving odd. The central vertical coulumn i lacking highlighted squares. I played with events for a bit and it seems like some symmetry issues. What would be the best way to fix it?
PS: Just create a big blank board without walls to see that bug I was talking about.

Saturday, September 14, 2013 at 2:05:11 AM
vee41 7,352 rep

@Wolod Thank you for spotting those! I fixed them all, and uploaded a new version of the .capx to the tutorial :)

Saturday, September 14, 2013 at 8:23:39 AM
Wolod 6,264 rep

Was glad to help! After all those completed projects of mine, I've developed a special tester skill xD Thanks again for great tutorial!

Saturday, September 14, 2013 at 11:55:47 AM
Lordshiva1948 44.3k rep

Thank you very nice

Monday, September 16, 2013 at 10:00:41 AM
Tedg 9,893 rep

Thank you for share this.Really good!

Tuesday, September 17, 2013 at 1:13:19 PM
Effregy 1,381 rep

Hey, the code is excellent, and it works very smoothly in the capx... But I've been trying to adapt it to a 32x32 size, and it just won't happen.

It's able to to show the possible moves, but when I left click, nothing happens.

I'm trying to make a turn based strategy game(like fftactics)
And this system is a perfect fit.

Thursday, October 24, 2013 at 3:19:51 AM
andias77 388 rep

Where is the example.capx?

Friday, March 07, 2014 at 11:45:42 PM
KoolEcky 16.3k rep

Thanks for sharing. Nice work!

Tuesday, October 04, 2016 at 6:05:24 PM

Leave a comment

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