Wednesday, 12 October 2016

Hud Guide

Hud Guide.jpg

  • 1: Joystick
    • Outer circle remains fixed in position
    • Inner circle rotates on axis to follow players touch movement. Inner circle always facing direction the player is moving
Untitled-1.jpg
    Moving up                                    moving right                           moving downward


  • 2: Attack Button
    • beings attack animation on touch
    • Button has normal and touch states
Untitled-2.jpg
  Normal state             touch state


  • 3: Dodge Button
    • beings dodge animation on touch
    • Button has normal and touch states
  • 4: Sprint Button
    • beings Sprint animation on touch
    • Button has normal and touch states
  • 5:  Sprint Meter
    • Indicates to player how much sprint they have used/have left
    • Meter decreases counterclockwise when player sprints, to indicate depletion
    • Meter increases clockwise whilst player is not sprinting
    • Meter depletes/increases in a linear fashion based on what % player has left
    • Meter hidden while full and not in use. Becomes visible when player touches sprint button. Stays visible until meter filled up to full level and becomes hidden again
Untitled-2.jpg
   Full Used a little                Used a lot          hidden


  • 6: Menu/pause Button
    • Pauses game
    • Opens menu
      • Menu options will be continue, quit, how to play, restart.
      • This can be a placeholder, although restart would be helpful for testing
    • Button has normal and touch states
  • 7: Body health Indicator
    • Indicates to the player how healthy the body is
    • Visible at all times
    • Heart will have 3 speeds of animation - healthy, damaged and unhealthy
      • Healthy 70-100%
      • Damaged 30-69%
      • Unhealthy 0 - 29%
    • Health displayed as text percentage between 0-100
    • Body health starts at 100% and goes toward 0% as damage is taken
    • When health reaches 0 gameover
  • 8: Game Clock
    • Indicates to player how much game time is left before boss fight
    • Clock counts down  
    • Clock is removed from UI during boss fight
  • 9: Infection Meter
    • Indicates to the player how infected the body has become
    • Meter is hidden. Meter becomes visible when the infection level hits a specific value.
      • Becomes visible at: 0% - 20% - 40% - 60% - 80% - 100%
    • If meter remains at 100% make visible again every 20 seconds
    • Once made visible, meter remains visible for 1.5 seconds then begins fading out for 0.5 second
    • 0% is the bottom of the meter, and 100% at the top. As the infection level goes up (getting more unhealthy) the meter climbs vertically, and vice versa
  • 10: Node Indicator
    • Indicates to player how many nodes are infected, and how many are clear
    • Captured Nodes are displayed in red, and clear in the white
    • Captured Nodes are displayed from the bottom up
    • Node Indicator is hidden until a node is cleared
      • The moment the node is clear of enemies, display Node indicator
      • The top node (in red) will flash and turn white (I have made this animation for class already - let me know when you need the specifics)
      • After flashing animation complete - fade out for 0.5 seconds
Untitled-3.jpg
3 nodes are infected, 2 are not                            a node was captured,
    The top coloured node is now white


  • 11: Player Health
    • Indicates to player the health of their hero
    • Remains hidden until player takes damage
    • Once made visible, meter remains visible for 1.5 seconds then begins fading out for 0.5 second
    • Must be made visible as the animation for the meter goes down, so the player can witness the health loss (gives context)
    • 100% health is at the top of the meter, with 0% at the bottom
  • Text
    • All is text is Roboto (google font), medium font weight, 12pt
  • Colours
    • Indicated below
      • Green - #48c37b
      • Red - #e35055

Untitled-4.jpg

No comments:

Post a Comment