Menu design

I had a talk with Mary, our UX designer to discuss the menu design (Tenney, M., and Waters, J., 2021.). We both agreed to collaborate on this as we both have artistic skills and enjoy drawing and alongside this, she possess UX skills and I have graphic design skills – all of which would come into play with the design of this menu.

It is important that the menu does not just serve the practical function of starting the game, but gives the player a sense of what the game offers and the atmosphere. Iconography and colour scheme will play an important part in this.

While the menu itself does not need to be stylish, it needs to make use of the iconography within the game, while also being legible. Menus also tend to work best when they have a clear and dominant logo present. (Dakinedi, A., 2016.)

Mary and I discussed what needed to be in the menus – this included the start menu and the in-game menu. Mary admitted that she has not played many games and not played games in a long time, so I took a lead on this, based on games that I have played.

As accessibility is important, we agreed that the player would have the options of either using the up/down and enter buttons to navigate between options or the mouse to select options.

We discussed potential options for the game, but since then, I have decided on some amends which I have agreed with Mary and I will specify as follows.

  • Main menu
    • Continue game: We initially discussed having the ‘New game’/’Play game’ option first, followed by the ‘Load game’ option. However, upon doing further reading (Hamilton, K., 2015.), I spoke with Mary and decided it would be better if the ‘Continue game’ option is first, if the player has played the game once before. The reason for this is that when a player is coming back to a saved game and is keen to continue, they will be more likely to hit that enter button or left mouse click more frequently to get back to it.
    • New game: As explained above, this will be the second option for players who have played before but the first option for those playing for the first time.
    • Options: This will take the player to a subsequent menu for Options, which may have the same aesthetic as the main menu. The Option menu will have a set of options that allow the player to tweak the game according to either their preference or to accommodate any disabilities they may have. The option menu will allow the player to choose a set profile, which has the subsequent options preset accordingly (which the player can further customise to their preferences or needs). The options in this menu will be as follows:
      • Accesibility: The first section of the options menu will control accessibility. These option in this menu can be customed manually or a preset profile can be selected. The options in the section are as follows:
        • Set profile: This will be a set of preset profiles for all of the subsequent fields in this menu, according to a range of difficulties the player may have. The player can configure this either with the left/right arrows on their keyboard or by clicking arrows either side of the selected field. The profiles we have roughly come up with (but will need to research further) are as follows:
          • Colour blindness
          • Hard of hearing
          • Partially sighted
          • Low sensory
          • Custom: This just means that the player has configured the settings to their own preferences. If they choose any of the above fields but then manipulate the subsequent settings further, this filed will automatically switch to ‘Custom’
        • Sound volume
        • Music volume
        • Brightness
        • Contrast
        • Colour
        • Hue/Saturation
        • Captions On/Off
      • Language
      • Screen resolution
      • Set controller: Some of the options present here will include keyboard, controller, joystick and mouse. We are considering allowing several profiles to accomodate different controllers and mouses.
    • Help: This will give instructions as to how to play the game, although there is a possiblity we may incorporate this into the hub level, which may or may not make this option redundant
    • Credits: We all want our work to be recognised, so we will include a screen with credits
    • Quit to Desktop: We can’t assume all our users know about Alt+F4, so to make leaving the game easier, we will add an option to the main menu to do this.
  • In game menu: This will be the menu the user sees when they are in game and choose to pause. This menu will take up a small portion of the screen and will overlay the paused game.
    • Initially the first option that we decided upon for this was a ‘Save game’ option. However, I have done a bit more reading, as well as game playing and decided that it would be better instead to have an autosave option where the game automatically saves at certain points in the game and is made obvious to the player through an onscreen visual cue. All players will have different habits when it comes to saving and having an autosave will remove the added labour of opening up the menu to save, as well as removing any frustration if players forget to save their game after a crucial point.
    • Options: The first option will take a player to a subsequent Options menu. All of the options within this menu will be the same as the ones listed above. However, this variation of the Options menu will also overlay the paused gameplay, rather than taking the user to a different screen.
    • Help: There will also be an option for the user to check instructions to play the game if need be
    • Quit to Title Screen
    • Quit to Desktop
    • Mute option in bottom corner of screen: This option will not be a field in the menu itself, but a button with a speaker icon, which if clicked, automatically mutes all sound or turns it back on. The user will also have the alternative option of pressing a button on this screen to trigger this function and there will be an instruction of what button they should press next to the button.

In the immediate short term, Mary and I have agreed to design the menus using Figma (Field and Wallace, 2021), as we are both familiar with this application and have used it for UX/UI design in our professional work.

I asked my team over Discord (Discord, 2021) which screen resolutions we should design according to and they said that we should aim for standard computer screens: 720p, 1080p, 1440p, 4k. Mary and I will design the menu according to each of these.

Additionally, Mary is going to work on a Map design for the background of the menu and I will do a refined tree of Life drawing to go in the foreground.

I have also started looking into designing the logo for the game and I have started searching for examples of good game logos (Pinterest. 2021.). This will be very important as it will be a dominant element of the main menu and prior splash screen.

References

Dakinedi, A., 2016. Video game UI: The design process explained. [online] Medium. Available at: <https://medium.com/@a_kill_/video-game-ui-the-design-process-explained-14c23fa70d37> [Accessed 8 July 2021].

2021. Discord. Discord, Inc. [Software]

Field, D. and Wallace, E., 2021. Figma. Figma, Inc.

Hamilton, K., 2015. The Ten Commandments Of Video Game Menus. [online] Kotaku. Available at: <https://kotaku.com/the-ten-commandments-of-video-game-menus-5955855> [Accessed 8 July 2021].

Pinterest. 2021. Game Logos. [online] Available at: <https://www.pinterest.co.uk/search/pins/?q=game logos> [Accessed 8 July 2021].

Tenney, M., and Waters, J., 2021. Meeting about Menu Design

One Reply to “Menu design”

Leave a Reply

Your email address will not be published. Required fields are marked *