Setting up our main character requires us to make a few animations with their own sprites. The required animations are:

These are just the basic animations; we might need to add more animations if needed, for example, to climb or swim. The character sprites that we will use are available at Platformer packExtra animations and enemiesAlien sprites; here, there are several ready-to-use aliens, along with their animations. We'll use the green alien sprites in this chapter, but you can use whichever color you like.

Add a new sprite game object and name it alien. We'll give it a few basic animations as follows:

For the Default animation, we'll use the stand sprite (alienGreen_stand.png). For the Walking animation, we'll use two walking sprites of the alien sprite (alienGreen_walk1.png and alienGreen_walk2.png). If we want to give more than one frame to an animation, we would need to use the Animation frames window. For the first frame, add the walk1 sprite as usual, but for the frames after this one, we will right-click on the Animation frames window and click on the Add frame option.

After we add a frame, we just need to load an image from a file. Now that this animation already has more than one frame, the animation will automatically start when we switch to the Walking animation. The problem is that we want this Walking animation to loop, not just stop after playing its last frame (like all default animations do). So, how do we do this?

The answer is by changing its property. Click on the name of an animation whose properties you want to change in the Animations window, and then take a look at the Properties bar. You can see that the Properties bar now shows the properties of the animation you selected. Change the Loop property to Yes, and then, this animation will automatically loop after it reaches its last frame.

We are now done adding frames to the Walking animation. Switch on to the Jumping animation and give it the jump image (alienGreen_jump). Close the edit image window, and we now have our character on the screen.

We now have our character on screen, but right now our character still can't move; we'll make it move as if it's aware that it is an object in a platformer game. Thankfully, there's an easy way to do this in Construct 2: using a Platform behavior. The Platform behavior is located at the movement section when you add the behavior. Add this behavior to the alien object, and it can move as if it's Mario. However, before it's able to do this, we need to define the ground for it. An object with a Platform behavior can't walk through any solid objects; so we'll add a Solid behavior to the grassMid object. Test the game now, and you can move your alien with the arrow keys.

I'm sure you have realized that when you move the alien object, it doesn't animate. It still shows its default animation. Well, this is because we haven't told it to change its animation. So, let's do that now.

To do this, we need to be able to detect whether the arrow keys are pressed or not. Construct 2 does this via its Keyboard game object; so, add this game object to your project. After that, change to the event sheet.

We want to switch the animation to Walking when we press the right or left arrow key and switch to Jumping when we jump and return to the default animation when we're not pressing anything. The combination of the Keyboard object and the Platform behavior has got this logic covered. We will change the animation to the Walking animation when the right or left arrow key is pressed; the code for the right arrow key event looks like this:

The code for the left arrow key event looks like this:

Then, we'll change the animation to the Jumping animation when our alien is in the air. Luckily, Construct 2's Platform behavior gives us easy ways to look for several states of the character, from jumping and falling to landing. Here, we'll change the animation when our character jumps:

What's left is to change the animation back to the default standing animation. There are two places where we can change this: when the player releases the left or right arrow key and when our character lands after jumping.

The Keyboard object has an On released event to check whether the player has released a key, and the Platform object has an On landed event to check whether the player has landed after jumping or not. However, we only change back to the default animation if the animation currently playing is the Jumping animation. This is because we can still move the character even if it's in the air, and we might want him to continue walking to one side right after landing. So, the code will look like this:

You might have observed the or keyword in the code snippet in the previous screenshot. Just like any other programming language, Construct 2 has the AND and OR keywords, which function as follows:

To make an Or block, right-click on an event and select the Make 'Or' block option; the Or keyword will be applied to that block.

Keep in mind that an event can't be an AND block and an OR block at the same time; it must always be one of the two. If you need to look for two conditions at once and then use an OR block, use a sub-event.

Test the game now, and you can see that the character can move using directional arrow keys. However, there's one problem: if we press the left arrow key, it moves backwards! Well, this is because we haven't flipped the image.

There are two kinds of flipping in Construct 2: flipping horizontally and flipping vertically. Flipping horizontally is called mirrored, and flipping vertically is called flipped. Here, we want to mirror the sprite when we press the left arrow key and unmirror it when we press the right arrow key. Change the code to look like this when we are setting the animation to Walking:

The code looks like this for the left arrow key event:

This will make our character face left when we press the left arrow key and face right when we press the right arrow key. Don't forget to save your project before moving on to the next part.

By now, the alien can move normally. However, if you try to move past the right-hand side of the screen, the player disappears! This is because the camera stays still while the player moves to the right, To fix this, we will make the camera follow the player.

It might sound difficult, but we actually only need to add one new behavior to the player: the Scroll To behavior. This behavior will force the camera to stick to the object with this behavior, or if there is more than one object with this behavior, it will stick to the center, between all the objects. Add this behavior, and the camera will automatically follow the player.

There's one more problem I want to address here while we're still in the topic of moving the character. If you walk too far to the left or right part of the layout, you can see that the alien can fall out of the layout. This is because there isn't anything that prevents the player from falling. There are two ways to prevent this: build a wall of solid objects on both sides of the layout or just use a behavior to stop the object from going out of the layout.

This behavior is called Bound to Layout. All objects with this behavior can't go out of the layout, as if there are invisible walls that prevent them from doing so. Add this behavior to the alien, and we can stop it from falling out of layout. Also, it's a good habit to make a believable space for players to be bound to. So, instead of an invisible wall, you can make an edge of a cliff or river, or something similar, depending on your game.

Now, let's make the most fun aspect of a platformer: jumping on platforms. Here, we will make two kinds of platforms: the one that you can hit from below and the one that you can jump through from below. All platforms can be stepped on. To make the first kind of platform, we'll just simply add a Solid behavior to the objects we want to make as a platform. We'll make the boxAlt object as this kind of platform, so let's add a Solid behavior to it.

Try to test the game now, and you can see that we have made boxAlt as a solid platform. However, right now, our alien's jump isn't high enough to make it reach on top of boxAlt in one jump; let's make him jump higher. To do so, we just have to change the value of the Jump strength property in the Platform behavior's properties, as shown in the following screenshot:

Test it again, and now, our alien can jump on to the solid platform in one hop.

The next thing we want to do is make a platform that the player can jump through from below. Luckily, for us, there's also a behavior for this kind of attribute called the Jump-thru behavior. Add this to the boxEmpty object, and we have the kind of platform we want. Try jumping below the boxEmpty object, and you'll see that we have our jump-through platform set up.

There's one more thing we can do with a Jump-thru platform: to jump down while we're on top of it. Construct 2 calls this fall through, and this is an action we can add to an event. So, let's make a button press as the event. We'll make the character fall when we're holding down the down arrow key and the Space bar, because this is a pretty intuitive design that will make the code appear as follows:

Test the game now, and you will see that we can now fall through a Jump-thru platform.

A platformer with only one level is boring; so now, we will add a new level and navigate to it. First, create a new layout, open your Projects bar, and right-click on the Layouts folder. Click on Add layout to add a new layout. A window will pop up asking you whether you want to add an event sheet to it or not. You can choose to not initially give this new layout an event sheet, but for now, we will add an event sheet along with it.

After clicking on the Add event sheet option, you will have a new blank layout; we'll design the second level here (it's not actually a level in a game because it's very short; I just call it that way for lack of a better word). One thing to note about designing in a new layout is that you don't have to add a new object; you can add an object from other layouts if you want to.

To do this, look at the Projects bar; you'll see that all the objects you've added to your project are listed under the Object types folder. To add an existing object to a new layout, drag-and-drop that object from the Object types folder to the layout. Remember that you can't drag an existing object if it is of the same type as the object that is added to the entire project; for example, a Keyboard or Touch object is already added to the entire project.

Now that we have a new layout, design it to have the grassMid, boxAlt, and boxEmpty objects like the first layout. Before we move to the new layout in the game, we would need something that serves as a connector between the two layouts. Here, we'll use a door, add two new objects from the Tiles folder inside the Base pack folder in freebundle.zip, door_openMid, and door_openTop, and place them at the edge of the layout as follows:

The logic of changing the layout is pretty much like this: when the character collides with the door, change the location to the new layout. You can design your own logic when making your own game; for example, perhaps, the player has to press a button first. The code for our logic is as follows:

If you test your game now, you can see that we are able to go to Layout 2. However, something is strange: the player is not on Layout 2; we can't move anything on the new layout. Well, this is because we didn't put our alien object there yet, so let's add our alien object to Layout 2 as follows:

Test it, and you will see that we can now move to layer two and move our character in the new layout. However, our character doesn't play the animation; why is this happening? This is because each layout has its own event sheet, and we only animated our character in Layout 1.

The event sheet for the new layout is listed in the Event sheets folder in the Projects bar; double-click on it to open it, and then paste the animating events there.

If you copy events, you can paste them in another event sheet or in another part of the same sheet. However, if you copy conditions, you can only paste them in another event where possible; for example, you can't put two trigger conditions in one event.

If you still remember, we have a coin box in layout 1 that we haven't manipulated yet. We'll modify it such that when a player hits this box from below, it will produce a coin.

This box will have an instance variable that will determine whether or not it has a coin inside. When the player collides with the box from below, we will check this instance variable. If its value is true, then we will spawn a coin; if it's false, then nothing will happen. We will also change the sprite based on this instance variable to visually indicate whether the player can hit this box or not.

So first, create an instance variable called hasCoin as a Boolean and change its initial value to true. After that, switch to the event sheet. We want to check a collision from below, so we will use the On collision event combined with comparing the y position of the alien with the box. If the alien's y position is bigger than the box, this means that the alien is below the box. After this, we will use a sub-event to check the Boolean instance variable's value:

I haven't written the action yet, because here, we want to spawn an object, so let's create that object first. Insert a new sprite object and name it coinGold. You can get the sprite from the Items folder under the Base pack and put it somewhere off the screen. We also want to change the boxCoin object's sprite, so we'll add a new animation to it. Double-click on the box to open the edit image window. Add a new animation called Disabled, give it the image of boxCoin_disabled from the Tiles folder, and then close the edit image window.

We want this coinGold object to do two things when it is created: to slowly move upward and to gradually disappear. We can do these with behaviors; a Bullet behavior can be used to move upward, and to make it slower, we will just set a slower speed. To make it gradually disappear, we'll use a new behavior called Fade. A Fade behavior changes an object's opacity over time and will destroy the object by default when it is invisible. Add these two behaviors to coinGold and set the Bullet behavior's Speed property to 200 (or lower if you want). Don't forget to add a Solid behavior to boxCoin so that we can collide with it.

Switch to the event sheet for layout 1; we only need to add actions to the boxCoin object's hasCoin sub-event. We want to create a new coin here, set its angle of motion upward so that it moves up, change the animation for boxCoin so that the players know that it has run out of coins, and finally, we'll set the hasCoin instance variable to false.

Now, we can test the game. Remember that after having more than one layout in a project, you need to be sure that the layout you selected last before testing is the layout you want to test. This is because Construct 2 always runs the layout that was opened last when testing; if you previously opened Layout 2, open Layout 1 before testing. Save your project before continuing, because you'll learn something new.