How to Create a Basic Unity Platform Game

In our part 1 of “How to Create a Basic Unity Platform Game”, we went through the steps of creating your basic character, adding physics, platforms, and mouse input. In this next part, we’ll go over how to add procedural platforms, a game menu, and some resources to find models and additional Unity plug-ins you can use in future projects.

Creating Procedural Platforms

So in part one of this tutorial, we just made a basic platform that your character can bounce around on (and fall off to their doom) – but for a true platformer, we need to add additional platforms. But we don’t want to add a million platforms – we want Unity to automatically create platforms as our character bounces along.

For this, we need a platform template – otherwise known as a “prefab”. Prefab is short for prefabricated, and it simply means “pre-made” – usually a copy of a game object that you can reuse over and over again. In fact, prefabs can contain hierarchies of game objects, which means you could “prefab” an entire scene of game objects.

So what you need to do is create a new assets folder named Prefabs, then drag and drop our platform from the Hierarchy panel into this new folder. Prefabs will be recognizable in the Hierarchy panel by the color blue.

Now in order to instruct Unity to create procedural platforms, we need to create a script called GameManager, and attach it to the camera. GameManager scripts basically contain important instructions for the engine to relay to the gameplay – in this case, it will be generating platforms as our character hops along.

The reason we attach it to the camera is because the camera is never destroyed, and it remains constant – so the script is never destroyed and remains constant by being attached to it.

Here is what needs to be included in the script:

To explain this code a bit, it’s necessary for us to create a reference to both the prefab panel and the sphere (our character), so you need to drag and drop them into their specific slots in your editor.

This code also contains three private variables – the lines that start with private var. These will instantiate (reference) the prefab panel in the following ways:

In this next bit of script, we’re going to add a check for every frame whether or not our sphere (character) is above the boundary (that generates new platforms) – if our character is above the boundary, we will raise the boundary limit to create a new panel / platform higher than the last.

Our next step is adding code which determines the next panel position:

We’re using a do while loop in this code to ensure that the vector’s X and Z values (its position in the game world) is not identical to the previous platforms – so our procedurally generated platforms will always be increasing in height.

Of course, we don’t want these values to be strictly placed – a little bit of randomness is a good thing, otherwise we’re just making a perfect staircase. So we’re using the Random.Range function, between values -1 and 2, to call random values for X and Z. You can play with these numbers a bit if you want to fool around.

Creating a Game Menu

So far, we’ve created a “game” where you can jump with increasing height and move the mouse around to control the direction. The problem is that if you fall off the platform, you’ll just fall endlessly – we need to script in a “death” / game menu to start over.

So basically, we’ll write a script that checks if our sphere (character) falls below the first platform of the game. If so, the script will load a new scene.

Our first step will be to check if the sphere has fallen below a specific threshold. Go into the GameManager script we made earlier and look to the if statement of the update function.

We’re going to use an else if statement here, to check if our sphere’s position is below -2.0 units of the Y-position – if it is, our private function gameOver will…well, that bit of script is self-explanatory.

That last bit of script is the function to use for handling a “game over” state and load our game menu.

This harkens to Unity’s Application class – we’re able to call the LoadLevel function to bring up a new scene, which in this case, is simply our game menu – remember that basically everything in Unity is “levels”. Main menus (Start Game – Options – Credits – Etc.) are basically just levels / scenes with bits of clickable text. Kind of like Skyrim’s loading screens, eh? They’re just 3D models in an empty worldspace with a loading bar.

In any case, we need to create a scene through File > New Scene, and give it the name Menu while saving it. Then we’re going to add both scenes to the build process. This is done through File > Build Settings.

Our menu scene should still be open, so just click the “Add Current” button and add the scene to your Build Settings – do this again with the level scene.

When we die in the game, the script we created should transition us from the game level to the menu scene.

Add a “Start” Button for Players

Now, we’re able to play the game in a test-mode, but as of right now, players have no way of starting the game if we were to upload this game somewhere. So we need to create a game menu that has a button for starting the game.

So switch to the game menu scene, and add this bit to the camera (in the Inspector panel, remember from pt. 1 of this tutorial?).

This will give us a solid black background for our game menu – this is done in RGB values, not hex – so blue would be 001, green is 010, red is 100, etc. I could explain this for you, but all you need to do is Google “RGB picker” if you want a specific color.

Moving on, we need to add our button to start the game. This is done through UI elements – basically, we can add UI elements the same way as we add 3D elements, through the Hierarchy panel. So go ahead and create a UI button, and you’ll see some new elements in the Hierarchy panel:

To break this down – the canvas is our container for all UI elements, and we can make it responsive (by responsive I mean “scaling to screen size”, not responsive like it will answer questions you ask. That’s best left to AI scripts). In any case, we’re going to change the button’s position to this:

To make this a bit more elegant, you can remove the button’s “source image”, and set a color for it. And to change the button’s text, just edit the Text element to something like “START GAME”, and give it a font-size around 16.

To make the button clickable, we’ll add a function to the UIController script in the Button element. Just add this bit of code below:

Apply this function to the button’s Inspector settings, and in the Button (Script) component settings, we will simply add a function that executes when the player clicks our Start button. So just add a function to the On Click() event, and drag/drop the Start Game button to the input field. Finally, select the newly made function from the UIController script (UIController.StartGame)

We can apply this function in the button’s Inspector settings. In the Button (Script)component settings, we can execute a function whenever a player clicks it. For this, we add a new function to the On Click () event, by clicking the + icon. Now we can drag and drop the button itself onto the input field. Then we select the function we just wrote from the UIController script (UIController.StartGame).

How to Export / Publish as a WebGL Browser Game

Open the build settings, and choose WebGL as your target platform. Now click the Switch Platform button, and finally, click the Build button and give your game a title. After it builds, it will be exported / saved as an .HTML file, which can be opened / viewed in any WebGL-enabled browser. Although if you want to publish your game, there are two methods to achieve this:

You can tweak those iframe values and do a number of different things with it. For example, adding iframe tags like allowfullscreen=true would allow your browser game to go full-screen.

Additional Resources:

I would recommend not trying to publish this game we made in this tutorial to a platform games portal; you’ll look really silly without polishing it up a bit first.

One way of making your game look much better, especially if you aren’t particularly good at creating 3D models, is to utilize free (or paid) resources. Here are some libraries worth checking out:

There’s really a ton of resources out there, you just to be careful and read the fine prints – some free assets are allowed to be used in commercial projects, others only let you utilize their resources if your game is free-to-play.

The post How to Create a Basic Unity Platform Game appeared first on Appuals.com.