Description

The UI in a game is used to provide information to the player; ammo counters, health bars, mini maps etc. However, this information is only really relevant when the player wants it. If the player has no intention of gathering information from the mini map, then let’s tone that down a bit, shall we? With Clean UI, all UI elements can be dimmed down to any level of transparency, and appear in full only when the player looks at that specific element.

Implementation variations

• The most common way to implement Clean UI is to use the gaze point to trigger a UI element when the gaze point hits the trigger area; its a binary state, player looks there or not.
  • Make sure the UI element instantly shows up at full opacity, there shouldn’t be any delay here. The player should get the information instantly.
  • To avoid the sense of flickering, the UI element should fade out over time, not instantly.
  • A timer can be used to make sure the element doesn’t start fading out immediately. For example, the fade out starts after the player has looked away for 2 seconds.
• Another way is to have a more dynamic state of the UI elements, where they are constantly changing opacity depending on how far away the gaze point is from the element. For example, when the player is looking at the center of the screen, a UI element in the top left corner is equally faded out as a UI element in the bottom right corner. When the player looks at the top left element, the bottom right fades out even more.

Design considerations

Size of the UI element

UI elements come in all shapes and sizes. For Clean UI, it’s important that if the element is small, that some padding around it, to make the “hit surface” larger. Otherwise, a player with a slight offset in their eye tracking accuracy will have a hard time activating a small UI element when looking at it, as the registered gase point won’t hit the trigger area. Having extra margin here solves the problem. It should also be taken into account that during gameplay, the size of the UI element can change, and Clean UI needs to be able to handle this change.

New players and learning the game

One thing to remember is that a player that plays a game for the very first time doesn’t know where all the UI elements are located. When the UI is fully visible all the time, peripheral vision picks up on the general shapes and sizes of the elements, and finding things is easier. When the UI is dimmed down, the player may have to look around and search for the desired element. With time, however, the position of the UI elements will be remembered and this is no longer an issue.

• For this reason, we don’t recommend fading out a UI element completely, but rather dim it down to  a 10-15% transparency at the most.

A more cinematic experience

Due to the reduction of “gamey” things like health bars, ammo counters and so on, the game becomes more cinematic. With Clean UI, all the information provided is still there, it’s just toned down and available when needed. The level of transparency when faded out is of course a determining factor here.

The risk of missing information

When UI is faded out, certain information could be missed; the player simply didn’t see what the UI tried to tell the player. For example; a new mission objective appears, but the user was not looking at the Mission Objectives UI element at the time, so the text appeared in a faded out state.

• The solution to this is to always let new information or updates appears and stay fully visible until the player has looked at it again. This gives the player the best chance to receive this information before the feature goes back to behaving normally. In the case of the mission objective; the player will see that the mission objectives UI element lights up, read the updated information, then continue player, and the UI element fades out again.
• We also recommend to not use Clean UI for button prompts, such as “Press E to interact” or similar.
• When “the UI is the game” such as many strategy games, we don’t recommend using Clean UI, or at least be very conservative with which elements are faded out.

Conflict with other features

The UI is usually positioned along the edges of the screen, meaning the player will be looking to the sides of the screen to find information. When the player is also using Extended View with eye tracking, the camera will also move when the player is looking at the edges of the screen.

• In a UI intensive game, consider turning down the impact Gaze has on extended view, or only allow head tracking for extended view.

Settings