This week’s classes were focused on User Experience and UI, as well as touching on designing control schema.
Game UI Design
All Game UI’s are an interface made up of several components that relay information to the player, usually to help them achieve goals.
They can usually be seperated into 4 types: Diegetic, Non-Diegetic, Spatial, and Meta UI components. The following video by Extra Credits gives an entertaining rundown of the 4 types and their differences, but I will also try to sum them up succinctly.
Diegetic UI components exist within the same game world the characters are in. Examples include the map and compass in Firewatch, the ammo display on the back of the assault rifle in Halo and the suit showing your health in Dead Space.
Non-Diegetic components, however, are the classical elements we are used to in games: Components displayed on “screen” over the game world, that do not exist there. Examples include the classic life bar and ammo counter you see in the corners of a lot of games.
Spatial UI components do not exist within the game’s world, i.e. the characters within the world cannot see them, however, they are visually placed within the game space, floating or overlayed over objects and areas within the world. Examples include outlines around enemies, button prompts floating above interactable objects and name tags above friendly characters.
Meta UI components are somewhat opposite to spatial ones, as they technically do exist within the game world, but are intended for the player to see and not the character, sitting in between the game world and the non-diegetic UI screen. The most famous example of this is the “bloody screen” seen in first-person games. While it is intended to look “real” and grounded within the game world, it solely exists for the player to tell them they have low health.
While my game could technically benefit from diegetic UI elements to emphasize the hand-crafted look of the collage art, I don’t think it is strictly necessary as my gameplay will have a lot of arcade-like elements, and immersion within the world is not a high priority over accessibility, readability, and fun. As a result I will most likely mainly make use of spatial UI components, for example to provide feedback of where ablities are being casted, as well as a small amount of non-diegetic components, most likely displaying the “energy” (working name) the player has left to perform said abilities.
I drew the following quick mockup of what a UI design for my game could look like, but this would need further polishing before implementing within my GDD.
Leave a Reply