When I originally started creating a main menu, I was using only UI elements in a blank scene. After completion this felt extremely dull and boring with just some text on an uninteresting background. I really felt like something needed to change.
So I copied the second level scene I had created and remove all gameplay elements (player/AI/triggers...). I began by creating a new main camera and placing it within the scene in a location which suited a main menu, adding the post-processing profile I created earlier. Here is how it looked without any UI elements:
After this it was time to create the canvas and functions.
The main canvas consists of a non-interactive button (game logo), and four interactable buttons ('play', 'options', 'controls', and 'exit to desktop').
The logo I created using Photoshop. I created text using the INKFREE font and simply ran the smudge tool through each letter a number of times vertically. I made it white originally and wanted to implement a highlighted sprite to change the colour, however, this didn't look very good with the surroundings. Because of this, I changed it to black and then when highlighted, would be white. This looked much better. Here is what the logo looks like on the menu both normal (black) and highlighted (white):
Adding buttons is fairly simple. I created the sprites in Photoshop, then created buttons and positioned them below the logo. All I then needed to do was create a script and create functions to relate to the buttons, such as playGame() for the play button. Here is the script:
This script does not include anything about the options or controls buttons however. The reason is that those menus are not part of different scenes or anything, they are other canvases in the scene, meaning I could easily sort this using button functions. I wanted the camera to aim somewhere else for the options and controls menus, which is something else I could do with the simple button functions. Here are how the buttons are setup:
Play Button
Options Button
Controls Button
Exit Button
The controls menu looks like this:
The options menu looks like this:
To create more of an atmosphere for the menu, I included a particle system to represent dust particles in the air of the world. It gives the effect of abandonment and emptiness. To create this effect, I used a looping white circle shape that has random rotation and direction, with random lifetime duration. Here is how the particle system's settings are set up:
Adding buttons is fairly simple. I created the sprites in Photoshop, then created buttons and positioned them below the logo. All I then needed to do was create a script and create functions to relate to the buttons, such as playGame() for the play button. Here is the script:
This script does not include anything about the options or controls buttons however. The reason is that those menus are not part of different scenes or anything, they are other canvases in the scene, meaning I could easily sort this using button functions. I wanted the camera to aim somewhere else for the options and controls menus, which is something else I could do with the simple button functions. Here are how the buttons are setup:
Play Button
Options Button
Controls Button
Exit Button
The controls menu looks like this:
The options menu looks like this:
To create more of an atmosphere for the menu, I included a particle system to represent dust particles in the air of the world. It gives the effect of abandonment and emptiness. To create this effect, I used a looping white circle shape that has random rotation and direction, with random lifetime duration. Here is how the particle system's settings are set up:
Comments
Post a Comment