Building a platform game - a beginner's guide

Favourite 217 favourites
Tutorial written by VelojetOriginally published on 6th, January 2012 - 29 revisions

You'll learn how to:
- Best use built-in behaviors
- Switch animations: standing > running > falling ...
- Test for progress and award points

Screenshot - Level 2 reached


Building blocks - the objects to insert

Key to a platform game are two types of objects: Solids and Platforms.

Solids are obvious: they form the floors and walls that restrict players' movements. Platforms have a name which might confuse you initially: rather than being the platforms on which players stand and fight and run and jump, they're the objects that do the standing and fighting and running and jumping.

What's so great about Platform objects in Construct 2 is that you get all their basic behavior that you'd expect, without your having to do a single bit of programming:

- When you press the left and right arrow keys, Platform objects move right and left (you can change these keys, say to 'A' and 'D', if you like, or replace them with touch gestures on mobile devices).

- When you press the 'Shift' key, they jump (again you can change this key or substitute a touch gesture).

- When they've not got a Solid object beneath them, they fall.

Part 1: Beginning the build

I'm assuming you've worked through the 'Beginner's guide to Construct 2', so I'll try to avoid repeating what you've already learnt from it.

Constructing the playing layout

To get you off to a flying (jumping? running?) start, I've put together a very basic layout. Download it here and it'll be the foundation for this game:

The basic layout


Here's what you see on the layout:
- Four floors at different heights and with different lengths, so that the gaps between them become increasingly harder to jump. Click on them and you'll see that their Object type is 'Flooring'.
- Walls on either side. Click on them and you'll see that their Object type is 'Wall'.
- A player on the lowest floor (Tim by name, from the highly acclaimed platform game Braid - its graphic artist, David Hellmann, has generously made images freely available).

Tim's Object type is Player. But look under 'Object types' in the Project Bar, and you'll see that 'Player' is shown as a simple blue rectangle. And underneath it is another Object type named 'PlayerImages', looking just like Tim. Why this separation into two objects?

Two separate objects to represent the Player
It's because the Manual advises: "For the most reliable platform movement, it is recommended to use a invisible rectangle sprite with no animations with the Platform movement. Then, the animated player object can be positioned on top of that.Otherwise, the changing size and collision polygon of the object as its animation plays can interfere with the Platform movement's floor, wall and slope detection, causing a shaking or glitchy movement."

Our invisible rectangle sprite is the Player object - click on it in the Project Bar, and under 'Object Type Properties' on the left, you'll see that its 'Initial visibility' is set to 'Invisible'. This is what will be moved by our actions and pinned to it will be the PlayerImages object, with a size and collision polygon that change as its animations play, and consequently giving unreliable detection results. Look closely at the layout, and you'll see that Tim is standing within the blue border of the Player object (helpfully visible on the layout, but invisible when the game runs).

Comments

15
Bigheti 12.6k rep

Very cool ! I'm making a game in Plataform and this tips is very useful...Thank you very much!

Friday, January 06, 2012 at 10:46:41 AM
18
Wink 9,520 rep

Very nicely done Velojet :) This is exactly what I believe the community needs more of. Detailed, step by step, from start to finish tutorials like this one on different game types. It makes learning much faster, and fun. Looking forward to reading your next installment. Keep up the good work!

Friday, January 06, 2012 at 12:00:11 PM
11
Lost 3,060 rep

Thanks for the tutorial. Very informative!

Friday, January 06, 2012 at 2:45:55 PM
16
Ashley 112.8k rep

Looking good! I was going to do a similar tutorial but you beat me to it :) Might finish mine anyway, can't hurt to have two ways of approaching it!

Saturday, January 07, 2012 at 9:01:00 AM
8
sman118 5,995 rep

Extremely useful. I was just starting to work on a platformer and this has explained so much. Looking forward to more tutorials.

Saturday, January 07, 2012 at 1:47:39 PM
6
Cpryd001 4,236 rep

I'm following your tutorial and here's the problem I saw.

Page 3 - "Remember that we need to pin the PlayerImages object to the Player object, so give it 'Pin' behavior (under 'General')."

It reads like you should give the 'Pin' to the Player object.

Maybe replace it with :

"Remember that we need to pin the PlayerImages object to the Player object. So click on the 'PlayerImages' object in the Project Bar, and give it the 'Pin' behavior (under 'General')."

Looks good! Could use a few more photos to break up some of the text. I can help out with that too.

Tuesday, January 10, 2012 at 1:21:54 AM
5
rjgoodman 2,517 rep

Terrific! This is really a great help

Tuesday, January 10, 2012 at 2:20:10 AM
4
Velojet 16.9k rep

Many thanks for all the positive feedback, folks - much appreciated.

@Cpryd001: Thanks for your suggestion for clarification - I've edited the tutorial accordingly. A few more photos would be welcome!

Wednesday, January 11, 2012 at 7:50:42 PM
6
UrbanKhalifah 3,683 rep

very nice tutorial, thank you so much :)

Monday, January 16, 2012 at 5:25:55 PM
6
LE5LO 2,226 rep

Thankyou Velojet for providing a mighty fine Construct 2 tutorial, we are indebted to you sir.

I had one problem towards the end but I've resolved below, hopefully helpful for someone:

if the player slides after landing from a fall it's because nothing is telling it run if moving (on landing), ergo player simply stands whilst moving after landing, and slides better than tom cruise in tube socks in "Risky Business".

Solution:

Open Events and right click on
Player -> Platform: On landed
then click 'Add another condition'

ADD:
Player -> Platform: Is moving
Action: PlayerImages -> Set animation -> "Running"

FIXED!!! TOM CRUISE IS GONE!!! YEA BOOIIIIII!!!

Velojet, feel free to add this to your tutorial ;)

Tuesday, January 17, 2012 at 12:29:28 PM
6
Velojet 16.9k rep

Many thanks for pointing that out, LE5LO. I couldn't bear to have Tim looking like Tom (love your 'tube socks' remark!).

I think it's probably better handled with a couple of 'if/else' sub-events:

Player -> Platform: On landed
- Player -> Platform: Is moving
-- Action: PlayerImages -> Set animation -> "Running"
- Player -> Platform: Is not moving
-- Action: PlayerImages -> Set animation -> "Standing"

... and I will add this to the tutorial.

Blessings on your sharp eyes!

Wednesday, January 18, 2012 at 2:04:24 AM
3
bchan009 2,163 rep

Hi!

I'd love to do this tutorial, but when I downloaded the sample file I found everything was already completed....

Do you have the original barebones file so that I can follow along with the tutorial? Thanks! =)

Thursday, February 02, 2012 at 2:55:49 PM
3
Velojet 16.9k rep

#bchan009 : Thanks very much for alerting me to that fault - due to an error in updating. It's now the intended original barebones file. I hope it's smooth going for you from now on. Best wishes!

Thursday, February 02, 2012 at 5:54:39 PM
3
Joomler 2,092 rep

I am facing strange problem: instead of summing score when jumping, score start counting very fast, about 100 per second even if player stands on its initial position. No matter moving or not.

Friday, February 03, 2012 at 12:44:54 PM
3
Velojet 16.9k rep

@Joomler: If you post your capx in Dropbox, I'll take a look at it and see what might be causing your problem.

Friday, February 03, 2012 at 6:28:17 PM

Leave a comment

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