Personal Interface

APX_icons_color_Personal Interface

Design Problem:

Players cannot use the user interface components due to their size, layout, content, or structure.

Design Solution:

Players can show, hide, resize, pin, or rearrange user interface components so they can effectively and efficiently use them.

Related Patterns:

APX Design Drivers:

The above design problem can occur in the following contexts:

  • Players with physical disabilities may need to increase the size of interface components to make them easier to target.

  • Players with physical disabilities may need to rearrange interface components to move them closer together and reduce the distance traveled with the cursor.

  • Players with physical disabilities may need to pin components in a position around the interface to ensure they can reliably find, target and activate them.

  • Players with cognitive disabilities may need to hide interface components to reduce the number of things that they must attend to in the game.

  • Players who are neurodiverse may need to reduce the information in the interface components to reduce the amount or type of information provided to them.

Examples of this Pattern in Action.

HUD configuration in Fortnite Battle Royale (Mobile)

Description:

In Fortnite Battle Royale Mobile, players may customize the placement of various heads-up display (HUD) elements using the “HUD Layout Tool” menu. Using this feature, players are given the opportunity to move icons or buttons in the HUD to preferable positions that will be applied during gameplay. Both of the game’s player interfaces, “Combat Mode” and “Build Mode,” can both be customized separately to create a unique layout for each of these interfaces. Players may move a variety of HUD icons including but not limited to the scope icon for weapon aiming, the crouch button, the jump button, or the “build” button (for building structures in the game). Players may also choose to remove HUD elements from the gameplay screen. The removed icons are always available to be restored to the player interface.

Resizable icons in Fortnite Battle Royale (Mobile)

Description:

In Fortnite Battle Royale Mobile, players may resize the elements of the user interface that appear on-screen. Players may change the size and/or display scale of controls and HUD icons. Changing the size of a button adjusts the size of the input surface area for the button. Adjusting the display scale of a button adjusts the size of the button icon within the perimeter of the input surface area. Players may choose to have larger buttons to make them easier to select, smaller buttons to have fewer obstructions on screen, or vary the sizes of each button to create their optimal user interface. These options allow for players to customize the size of each button specifically to their preference.

Resizing and opacity setting for HUD elements in Battlefield 1

Description:

In Battlefield 1, players may choose from a number of individual settings that customize the appearance of the minimap and icons displayed on the minimap. Players have the options to change the size of the overall minimap, the size of icons displayed on it, as well as the visibility (opacity and blurring) of the minimap’s background, icons, and compass. The ability to change the opacity of the minimap’s texture in order to add or reduce details of the in-game terrain is also featured. Players may also decide if they want only heavy stationary weapons or all weapons available displayed on the mini-map.

Players may determine if the minimap rotates as the player character changes directions. Additionally, the game includes options to specify the minimap’s zoom level when on foot, in a land vehicle, or in an aircraft.

When the minimap is expanded to the full map, players can determine the size of the icons, visibility of the map’s background, icons, and compass, the opacity of the terrain texture, and the sharpness of the map’s background.

Players may also adjust the icon size and the icon opacity for friendly soldiers, enemy soldiers, gadgets, grenades, interactions, pick-ups, and squad requests in the in-game environment (or “world” as it’s called in Battlefield 1).

Show/hide elements of the HUD in Horizon Zero Dawn

Description:

Horizon Zero Dawn allows players to customize elements that appear onscreen in the HUD. Players may change which elements of the HUD are visible onscreen. For General HUD settings, there are 3 options. The first setting, “Always on,” will cause the main elements of the game screen at all times. The second setting, “Dynamic” will cause elements of the HUD to only appear or update as a result of player progression or specific interactions with the in-game world. Examples of these interactions include enemy NPC attacks on the player character causing the life bar to appear on-screen, or updates to the player’s current quest progression appearing when objectives are completed.  Important HUD features like quest waypoints and nearby campfire locations (the game’s version of save points) will still appear on-screen on this setting. On the “Dynamic” setting, the player may tap the touchpad on the DualShock 4 to view the HUD at any time.

The third and final setting, “Custom,” allows players to customize which elements of the HUD that appear are onscreen during gameplay. Each HUD element has 2 or 3 of the following options for appearance in the game: “Always on,” “Dynamic,” and “Always off.” “Always on” will result in the respective HUD element always being shown on-screen. Similar to the general setting, the “Dynamic” setting for an individual HUD element will cause the element to appear or update as a result of player progression or specific interactions with the in-game world. The “Always off” setting results in a specific HUD element never appearing on-screen during gameplay. If players select “Dynamic” or “Always off” players may tap the touchpad on the HUD to cause the chosen hidden HUD elements to appear on-screen.

References and Other Citations.

Screenshot Credits to YouTuber iChase: https://www.youtube.com/channel/UCROo4Ub0wQmU8yZLfH7thbw