Giving Your Game a Main Menu

And yourself some credit.

All games should have a Main Menu with a splash scene. In our game all we need is a cool graphic and a New Game button.

Main Menu Scene

The splash screen / Main Menu should be a scene on its own. When the New Game button is selected, the game scene is loaded.

Right-click on Scene, create, Scene and name it Main_Menu.

Creating new Main_Menu Scene

Double-click on the Main_Menu scene to activate it. In the Hierarchy window, lets create a new image object to hold the splash screen sprite.

Right-click, UI, Image, and rename it to Title_Screen_img.

new UI image object

In the Image section of the object, where it says Source Image, lets drag in the sprite MainMenu found in our sprite collection in the UI menu.

Adding sprite to image object

The image should now appear on the Canvas screen. Resize it to fit in the Canvas and make sure the Preserve Aspect is activated.

We have a cool graphic but our background isn’t right. To fix this, as we did in the Space Shooter scene, select Main Camera, in the Camera settings, change Skybox to Solid Color, and set the color to black.

Changing Background color

Now, lets add the same background sprite we used for our game, the SpaceBG_Overlay sprite found in our Sprites folder.

Zoom in to the scene and resize the sprite to fill the game window.

Resizing Background sprite to fit screen

Now we need a button in order for the player to play the game.

Right-click on the Canvas and select UI, Button. Rename the button to New_Game_button.

Creating a new button object

Drag the button object off to the right and anchor it to the right center.

Open the New_Game_button object to get access to the Text inside it. Change this to New Game.

Select the New_Game_button Text child. Change the text to New Game.

By selecting the New_Game_button, we are presented with many options on how the button reacts to mouse-over, select etc. You can also switch out different sprites if you wanted to.

Button options
Mouse over and click button reactions

Now we have our visuals set up, we need to make the button actually load the game when selected by the player.

To do this, lets create a new C# script and call it MainMenu. Once it has compiled, drag it onto the Canvas object.

MainMenu script

Open the script.

Remember that to load scenes, we must add the SceneManagement at the top.

We need to create a method that will load the game scene.

Loading Scene 1

As it is, this will not work. We need to go back into Unity, open the File, Build Settings window.

Since we have worked in here before, remove all scenes by selecting the scene, right-clicking a removing scene. Then drag onto the Build Settings window the two scenes in the following order: 1. MainMenu, 2. Game.

We can see the index Unity applies to each scene. Our MainMenu scene is index 0 and our game scene is index 1.

Scene indexes

This is why in our LoadGame method, we are loading scene(1), the game scene.

Now, this will work fine. What isn’t working though is the restart scene by pressing the ‘R’ key. The reason is we are loading scene(0) in the GameManager script. So, lets change this to load scene(1) and all should be good.

Loading game scene upon ‘R’ key press

Who desn’t like to take credit for their work and effort. Lets add a credits text so our friends and family knows we made it.

Back in Unity, lets create a new Text object by right-clicking on Canvas, UI, Text. Rename it to Credits_text.

Select it and change the Text content to Created by: <your name here>. Set text to white.

Position it in the center of the splash screen or where you think it looks best.

Credits Text

Now our Main Menu has a cool graphic, our credits and a New Game button.

Working Main Menu

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store