How to Make a Game Like Jetpack Joyride in Unity 2D – Part 1

Improving the Flames

The flames are looking good, but you’ll notice that the flame particles stop suddenly, as if they hit an invisible wall at the end of the particle emitter. You can fix this by changing the color of the particles as they fall further from the jet pack.

Select jetpackFlames in the Hierarchy and search for a section called Color over Lifetime in the Particle System component. Enable it by checking the white circle checkbox to the left of the section name and click the title to expand the section.

Click the white color box within Color over Lifetime to open the Gradient Editor. It should look like this:

Select the top slider on the right and change the Alpha value to 0. Then close the Gradient Editor.

Run the scene. Now the jetpack flames look much more realistic.

Creating a Level Section

Remember that the mouse should glide through an endless room, avoiding lasers and collecting coins. Unless you have a huge amount of time on your hands, I highly recommend not creating your endless room by adding everything by hand!

You are going to create a few different level sections and add a script that will randomly add them ahead of the player. As you might imagine, this can’t all be done at once! You’ll start by simply adding a few background elements in this tutorial.

In Part 2, you’ll start creating additional rooms for the mouse to fly through.

This is how one level section might look like:

The process of creating a level section (let’s call one section a room) consists of three steps:

• Adding the background
• Adding the floor and the ceiling
• Adding decorative objects

Adding the Room Background

Make sure the Scene view and the Project view are visible. In the Project view, open the Sprites folder and drag the bg_window sprite to the scene. You don’t need to place it in a precise location; you’ll take care of that in a minute.

Select bg_window in the Hierarchy and set its Position to (0, 0, 0).

After placing the central section of the room, you need to add a few more sections, one to the left and one to the right of the window.

This time use the bg sprite. Find bg in the Project view and drag it to the scene twice. First time to the left, and second time to the right of bg_window. Don’t try to place it precisely. Right now you only need to add it to the scene.

You should get something like this:

Looks like a room by Salvador Dali, doesn’t it?

Using Vertex Snapping

You could simply position every background element on the screen based on each element’s size, but moving objects by calculating these values all the time is not very convenient.

Instead you’re going to use Unity’s Vertex Snapping feature, which easily allows you to position elements next to each other. Just look how easy it is:

To use vertex snapping, you simply need to hold the V key after selecting, but before moving the GameObject.

Select the room background object that you want to move. Don’t forget to release the mouse button. Then hold the V key and move the cursor to the corner you want to use as a pivot point.

This will be one of the left corners, for the background to the right of the window, and one of the right corners (any) for the background to the left of the window.

Note how the blue point shows which vertex will be used as pivot point.

After selecting the pivot point, hold down the left mouse button and start moving the object. You will notice that you can only move the object so that its pivot point matches the position of the other sprite’s corner (vertex).

If you run the game scene, you will notice your jetpack flames are behind the background. It’s possible that even your brave rocket mouse is hiding from view! In fact, any new sprites you drag into the scene may not be correctly positioned by Unity with respect to depth.

New sprites may be positioned behind or in front of any other sprite. You will be adding some decorations to your room soon but they will look pretty silly on the outside of your house! So for perfect control of sprite depth in the scene, you’ll next look at using Sorting Layers to control their ordering.

Using Sorting Layers

To make sure your background stays in the background, and that your mouse does not duck behind a bookcase mid-game, you’re going to use a feature called Sorting Layers. It will take only a moment to set everything up.

Select the mouse in the Hierarchy and find the Sprite Renderer component in the Inspector. There you will see a drop down called Sorting Layer, which currently has a value of Default, as it is shown below.

Open the drop down and you’ll see a list of all the sorting layers that you currently have in your project. Right now there should be only Default.

Click on the Add Sorting Layer… option to add more sorting layers. This will immediately open the Tags & Layers editor.

Add the following sorting layers by clicking the + button.

1. Background
2. Decorations
3. Objects
4. Player

Note: The order is important, since the order of sorting layers defines the order of the objects in the game.

When you’re done the Tags & Layers editor should look like this:

For now you’re only going to need Background and Player sorting layers. Other sorting layers will be used later.

Select mouse in the Hierarchy and set its Sorting Layer to Player.

Now select the three background pieces, bg_window, bg and bg (1) in the Hierarchy and set their Sorting Layers to Background.

Thankfully, this new version of Unity introduces the same sorting layer parameters to particle effects. This makes the use of particle effects in 2D games far more practical. Select the jetpackFlames in the Hierarchy. In the Inspector find the Renderer tab at the bottom of Particle System and click to expand it. Set the Sorting Layer to Player and the Order in Layer to -1. The Order in Layer sets the order of the object within its sorting layer for even finer control.

You set the jetpackFlames to -1 so that they are always emitted from under the player’s mouse sprite.

Run the game and you should see that the jetpack flames are now displayed above the background.