Loss & Win In Game Menus

Purpose

In-Game loss & win menus allow for the player to control the behaviour of the game when they lose or clear a level, giving the player a sense of direction in the game. These menus give players' options about how to proceed next once they have failed or cleared a level.

Menu Format

Both menus appear on the screen as floating boxes or 'pop-ups' such that the rest of the game screen is still be visible behind them. Menus feature buttons which allow the player to choose whether to continue, retry or return to the main menu.

Loss menu

Buttons & Interaction: The Loss menu features 2 buttons, 'Replay' and 'Return to Main Menu'.

Structure & Design: The menu colour is a 'cold' blue with 'cold' (blue, purple) embellishments, the specific colours chosen was based on the colour palette of the game. (See Design Guide). This style was chosen to represent the contrast with the win screen, which has 'hot' embellishments (yellow, orange, pink).

Activation: The loss menu appears when the player's health drops to 0.

Level Cleared / Win menu

Buttons & Interaction: The Level Cleared / Win menu features 3 buttons, 'Continue', 'Return to Main Menu' and 'Replay'.

Structure & Design: The menu colour is a 'cold' blue with 'hot' (orange, yellow, pink) embellishments, the specific colours chosen were based on the colour palette of the game. (See Design Guide). This style was chosen to represent the contrast with the loss screen, which was 'cold' embellishments (blue, purple).

Activation: The win menu appears when the player clears the level by reaching the right-most edge of the screen.

Both screens feature design assets shown in the Design Guide for a consistent style throughout gameplay.

Implementation

Key Components

PlayerWinDisplay & PlayerLossDisplay Creates the visualisation of the pop up menus.
PlayerWinActions & PlayerLossActions Handles the actions taken when the buttons on the menus are pressed.
PopupMenuActions Handles actions after pressing buttons that are common across all pop up menus
PlayerWinPopup & PlayerLossPopup Triggers the pop up menus based on the status of the game
ForestGameArea Is used to keep track of the player e.g. health status, position on the map. This will be extended as additional maps are added into the game.

Currently, the menus are UIComponent's of the MainGameScreen, which are passed a reference to the player (Entity), game (GdxGame) and currentMap (GameArea) so that they can keep track of the player state in the game, make changes to the game accordingly (eg, set the new screen) and be aware of their location in the currentMap.

In the MainGameScreen's createUI method:

Entity ui = new Entity(); 
ui.addComponent(new ...)
.addComponent(new PlayerLossPopup(game, currentMap.getPlayer()))
.addComponent(new PlayerWinPopup(game, currentMap));

The MainGameScreen's constructor has been changed to retrieve a reference to the ForestGameArea object, so that it's player Entity and the endOfMap can be retrieved:

public MainGameScreen(GdxGame game) {
    ...
    this.currentMap = forestGameArea;
    createUI();
}

The appropriate getters were added to the ForestGameArea to retrieve the endOfMap and player.

public Entity getPlayer() { return player; }
public Entity getEndMap() { return endOfMap; }

Usage

Add a win or loss menu to a player by adding it to the MainGameScreen UI. Inside the MainGameScreen createUI method:

Entity ui = new Entity(); 
ui.addComponent(new ...) // Other entities for the UI
.addComponent(new PlayerLossPopup(game, currentMap.getPlayer()))
.addComponent(new PlayerWinPopup(game, currentMap));

The LossPopup only requires the player as it does not need to know where the player is in the currentMap. The WinPopup is passed the currentMap object so that it may have access to the currentMap information (when the player has cleared the currentMap) and the player, (from ForestGameArea's getPlayer method).

Menu Designs

The final designs for the Loss and Win menus which will be placed into Ragnorak Racer are below. These screens are a second iteration after changes made from user testing. See the Pop-up Menus User Testing wiki page

Sprint 1

Below are the designs of the previous Win and Loss screens added to the game.

Previous Win Menu	Previous Loss Menu

Sprint 2

The designs of the Win and Loss menus were further developed and updated in Sprint 2, see the Score System page for more information. Custom loss screens were created to display and notify the player of the various loss conditions caused by different enemies and obstacles. Some information about the enemy obstacle will also be presented to the player, along with their score and button options to redirect to the main menu screen or replay from a checkpoint.