Week 9!!

“The focus is not to make the game easy, but rather to make it so the player is able to easily experience the game. The game could be really hard, but it should be easy to figure out how to play it and improve.” – Philippe Chambon, UX Designer

Week 9 we took into consideration UI, Device Input Controls, and usability for our games; a crucial aspect that decides how our players will travel the distance from gameworld to real world.

What is Game UI?

A user interface helps people navigate and accomplish goals, like websites and mobile apps. A videogame UI is also an interface which helps players navigate and accomplish goals, with a large list of game UI components such as life bars, level maps, coin counters, etc. It requires close attention to detail and functionality. Badly done UI can be confusing and disorientating, which interferes with gameplay.

Non-Diagetic Examples:

• Ring Menu
  • A circular menu that allows a player to spin through resources or actions
• Life Metre
  • A metre that shows how much health the avatar has remaining
• Level Map
  • Small-scale map that shows the layout of a level

Diagetic Examples:

• Futuristic UI Overlays
  • Advanced UI often inside the player’s helmet that provides the avatar with vital stats and information
• In-Game Gadgets
  • Gadgets that hold important clues for a player’s avatar
• Physical Limitations
  • When a player’s avatar is phsyically hindered after sustaining damage

Spatial Examples:

• Selection Auras
  • A coloured bracket that the player uses to select certain objects
• Racing Lines
  • A highlighted line that indicates the path a player should follow
• Object text labels
  • A text label that hovers near an in-game object

Meta Examples:

• FOV Colour Filters
  • A colour filter that overlays the player view and denotes a change in resources, health, or scenario
• Grime
  • Materials like blood, dirt, and cracked glass that advance the player story but exist only on the 2D plane
• Scrolling text
  • Spoken dialogue that scrolls horizontally through the screen

When deciding on UI components, I must consider if the components exist in the game’s story, and if the component exists in the game’s world space. I will also need to account for aspects such as visual consistancy, typography, GRIDs, colour, iconography, and shapes (form following function).

Other questions to consider are:

• What affordances are key? (Minimum spec)
• What inputs are required?
• What outputs are required?
• What contexts will it be played in?
• What is the player’s relationship with the device? Player’s access needs?
• How do my decisions support the intended player experience?
• Should I use “standard grammar” for the device, or subvert expectations?
  

More points to consider are:
• Screen size and image quality, card size and print resolution
• Audio output (headphones, surround sound speakers)
• Play contexts (portability?)
• Market contexts (e.g., price points, platform expectations, where is your playership?)
• Possibilities for co-operative play
• Input controls
• Accessibility (embodied literacy, financial, physical, geographical etc.)

There are also custom control hardwares for specific games. For example, racing games sometimes require a toy wheel and pedals, and the Dance Dance Revolution games require a DDR mat.

Controls can also be used as adjectives and metaphors depending on the effect you want to have on your player:

---

Guest Lecture:

Interaction design is important because it connects the player to the mechanics, driving player immersion. The jump from physical world to virtual world should be as seamless as possible, so interaction design is invisible when done right, and annoying or alienating when done wrong.

There are a few principles to keep in mind when designing Loops:

• Usability – how efficiant, effective, and enjoyable is it?
• User Experience – what is the emotional and sensory experience of the game’s interaction
  • Eg; Nintendo’s large target demographic of both young and old audiences led them to maximise user experience and usability, with UI that is straightforward and intiutive.
  • Eg 2; Portal have a very intuitive interaction with its game mechanics as there is very little tutorial or over-explaining; players are encouraged to solve problems by themself with consistant mechanics that make the system rewarding over frustrating.
• Match Between System + Real World – Players intuitively understand what something done if the language or concepts that are used are familiar.
  • The weighted buttons in Portal are similar to real life buttons – without explanation, players understand that pushing it will unlock the door.
• User Control and Freedom – the player should be able to control when to back out of a situation or unwanted game states.
  • In Portal, players can always change the position of their portals
• Consistancy and Standards – players should not have to worry whether different symbols, words, or actions mean the same thing.
  • In Portal, portals cannot be placed on grey walls, while white walls are always able to have portals on them. When level design gets more flexible in the latter half of the game, white walls always remain consistant.
• Error Prevention – a good design should prevent user error
  • In Portal, the portals can only be placed on white walls so players can’t accidentally break the game or level design.
• Recognition over Recall – minimise memory load by making options, actions, and objects visible
  • In Portal, the doors and its required objective to open it is always visible with the coloured power lines.
• Flexibility and Efficiancy – Shortcuts can speed up interaction for expert players.
  • In Portal, more efficiant puzzle solutions can be recognised by expert players, allowing for some areas to be skipped
• Aesthetic and Design – all extra information competes with relevent information and diminishes visibility.
  • In Portal there are no unecessary UI elements to distract players. There ARE secrets and bonus areas, but these require a level of skill to get into
• Recognise, Diagnose, and Recover Errors – errors are plainly expressed, indicate a problem, and suggest a solution
  • For Portal there is immediate feedback to user error. Eg; destroying cubes will have them immediately replaced.
• Help and Documentation – sometimes keeping documents are necessary to help players understand tasks; the information should prioritise the steps needed to carry it out and shouldn’t be too much
  • In Portal, the signs at the start of levels indicate what is required of the player and the relevent obstacles.

Interaction and game controllers have come a long way from the start of videogames. The late 70s had basic buttons, joysticks, and adjustable knobs – this evolved into 80’s handheld controllers with directional buttons. Motion controls were popularised with Nintendo’s Wii, and the standard for most modern controllers come from the Playstation 1.

Affordances: design cues for interaction (eg; glowing doors, yellow paint)

Natural Mappings: eg; trigger for shooting

Human-Computer Interaction in Games:

• Representation or expectations develop internally in players about how an interface should work based on prior experiences (previous games or real world logic), feedback, and intuition
• Misaligned models: player expectations clash, can cause confusion and frustration

How Can Players Understand Game Systems?

• In Portal, momentum is both explained and intuitive
• In Firewatch, radio sounds indicate what players need to find in a room

Memory in Interaction:

• Working memory holds or processes information for immediate tasks actively
• Short term memory temporarily stores small amounts of information
• Long term memory is enforced over time to recall even after putting the game down

Improvised Controllers:

• WASD keyboard buttons were improvised
• Originally, Valve’s Steam controllers were improvised from two HTC vive controllers

Alternative Controls:

• Designed for recognisable and intuitive mental models. Eg; guitar hero controllers, treadmills, wii balance board

Accessibility and Inclusivity:

• Localisation
• Controller Customization
• Visual accessability and colourblind-friendly settings
• Subtitles
• Audio accessibility
• Motion and sensory accessibility
• Tutorials and onboarding