Distinguish This From That

APX_icons_color_Distinguish this from that

Design Problem:

Players cannot reliably identify differences within the game and/or its interfaces in order to know what is important and requires their attention.

Design Solution:

Players can change the presentation of information in a way that allows them to distinguish between, attend to, and use different important elements of information in the game and/or its interfaces.

Related Patterns:

APX Design Drivers:

The above design problem can occur in the following contexts:

  • Players with color vision deficiencies may need to recolor the game or its interfaces to keep colors out of their zone of confusion.

  • Players with color vision deficiencies may need symbols alongside colors to distinguish between different information in a game.

  • Players with low vision may need a higher contrast to distinguish information in the foreground from the background.

  • Players who use captions may require a dark contrast in the background to distinguish the text.

Examples of this Pattern in Action.

High contrast target reticle in Overwatch


Overwatch allows players to customize the reticle through a number of options that can change the appearance of the reticle during gameplay. Overwatch offers players several different types of reticles that include circle, crosshairs, circle, and crosshairs, etc. Players may also decide if they would like the reticle to display accuracy or remain static during firing weapons. In addition to these options, players are able to further customize their chosen reticle by changing the color, thickness, crosshair length, center gap, opacity, outline opacity, dot size, or dot opacity. Overwatch also features the option for players to customize and save a different reticle for each of the available playable characters so that each character may have their own custom reticle upon selection.

Colorblind mode in Fortnite Battle Royale


Fortnite Battle Royale includes 3 settings based on a player’s type of color vision deficiency. From the Accessibility menu, players may select one of 3 types of Color Blind Modes: Protanope, Deuteranope, or Tritanope. Additionally, players may further adjust the color blind settings of the game with the Color Blind Strength slider. The slider ranges from 0-10 with 9 increments in between each whole number. This makes for 99 different strength levels for each type of colorblind setting. To the right of the color blind selections, the game features 6 examples based on the Ishihara color test that players may use to adjust the color blind settings to their preference. By including the Ishihara color test examples, players are able to select their preferred color blind settings without having to repeatedly return to gameplay to see how their selections have changed the appearance of colors in game.

These colorblind settings are of particular significance due to the loot system in Fortnite Battle Royale. Loot in the game is tier-based and classified via colors with common loot represented with gray, uncommon loot represented with green, rare loot represented with blue, epic loot represented with purple, and legendary loot represented with orange. Given that pick-ups are colored with a neon glow based on the aforementioned tiers, it is important for players to be able to distinguish loot tiers during gameplay.

Minimap Recoloring in Call of Duty: Black Ops 3


Players may change the color of the mini-map in Call of Duty: Black Ops 3 through the Colorblind Mode accessed in the game’s options menu. The colors of the changed icons in the mini-map will also be reflected on the icons in the game’s world map. There are 3 settings available based on types of color vision deficiency: deuteranopia, protanopia, and tritanopia. Each setting changes the icon colors for the player, multiplayer allies, and multiplayer enemies. Icon colors for these settings maintain contrast between the represented elements for the player avatar, allies, and enemies.  This allows players to distinguish between different units in the game.

Highlight particular important words in texts (e.g. goals, locations, objects, actions) in Far Cry 5


Far Cry 5 highlights the text of important game mechanics, objects, destinations, and mission objectives. Through the game, these important words are highlighted in yellow in contrast to the standard white text. Some of the yellow colored text includes keywords in the quest objectives, enemy markers, and waypoints. Far Cry 5’s inclusion of this feature assists players in identifying information important to progression.

Mark enemies with colors and with symbols in ReCore


ReCore’s ranged combat is based on a color-coded weapon ammunition system. As the player progresses through the game, 4 ammunition colors are available for the player to use in combat: white, red, yellow, and blue. Enemies are also color-coded in a similar fashion. To maximize damage, players will need to use ammunition that corresponds to the color of the enemy. For example, a blue-colored enemy will take the most damage from blue ammunition. ReCore features another way to convey the ammunition color that should be utilized against each enemy. On the left corner of each enemy’s life bar is a directional arrow icon that corresponds to the directional arrow icons shown on the player’s colored ammunition radial. Red ammunition/enemies have a right directional iron, yellow ammunition/enemies have an up directional icon, blue ammunition/enemies have a left directional icon, and white ammunition/enemies have a down directional icon.

The added importance of the directional icons is that each enemy color has different strengths and abilities displayed throughout the game. In boss fights, the color that a boss changes to means that a different ability will likely be used. The directional icons offer a secondary method of determining how enemies will behave and what strategies the player can employ in order to progress.

Symbols to show color of dots in Two Dots


In Two Dots, players match dots of the same color to achieve particular goals for the level (e.g. clear 50 blue, red and yellow dots).   When a player turns on the Colorblind mode, the dots have symbols overlayed on them in order to identify dots that are the same color. These symbols do not have a particular meaning within the game, and thus are only used to indicate the difference in  color on the dot.

References and Other Citations.

Images taken from: https://www.recoregame.com/accessibility-and-recore