Dome Keeper

Dome Keeper is a roguelike survival miner game, developed by Bippinbits and published by Raw Fury.

I was contacted in 2022 to offer consultancy on UX, specifically on accessibility matters and scoreboard design.

The Premise

The game was first a product of the game jam Ludum Dare 48, by a team of two: René and Anne.
I was hired about a month before the release date and had about 1-2 weeks to complete my work. This included analysing and suggesting improvements in visual communication and providing a leaderboard mockup.

Due to the small team and short time to carry out the work, I started playing the game immediately, recording my gameplay, and taking screenshots and handwritten notes. After playing for some hours and reading through the community’s messages on the Discord server, I started preparing mockups.

Leaderboard

One of the requests was to provide a leaderboard wireframe for the Prestige Mode of Dome Keeper. The main task was to improve the readability of the leaderboard placeholder.

The Original Placeholder

The original leaderboard provided a simple idea of what information the client would have liked to be included. It is a simple design, though unclear in some areas.

Leaderboard Redesign

There were a few solutions I had thought of immediately, and after researching and analysing leaderboards from other games I proceeded with the redesign.

My goal with the redesign, other than improving on clarity, was to offer the players the option to filter out information. While taking into account that the game was in its final development phase, I wanted to make sure the mockup covered any other items that might become relevant to the game.

Main leaderboard redesign points.

1. I used the game’s alternative colour scheme, to check if the colour contrast would still work.

2. On the left, details about the finished run are displayed. While the original leaderboard used only text, the redesign displays the relevant icons next to the written information to convey the message faster and better.

   • The player is able to check the other players’ stats if they’d like to, to see how they fared in comparison. As it is not the strongest element of the leaderboard, I did not opt to display both players’ information side by side.

3. The middle section displays the players’ ranking, being the central and biggest element of the UI.

   • The player’s score and details are fixed at the bottom so that even if they scroll through the leaderboard, their own information is always readily available.

   • Each column now has an explanatory title, reminding the player what game element the icons refer to.

4. On the right, players are able to filter out the ranking by time frame, players, and game elements.

   • Due to the game offering a wide variety of options to customize your own playing experience, the ranking displays a variety of icons which the user won’t remember the meaning of. Therefore, I opted to utilize buttons with text and icons to act not only as a leaderboard filter system, but as a legend as well. In case the player does not want to filter the information, they can still read and comprehend it with the visual aid on the right side.

Gameplay Accessibility

In this section, I will present only some examples of improvements I suggested to the development team.
For some of the identified issues, I was able to provide quick and dirty mock-ups to better communicate my thoughts. However, I conveyed some of the proposed improvements only verbally due to time restrictions and urgency.

Visual Impairment and State Change Communication

Among the first things I like checking when seeing a new menu, is whether the color contrast is good enough for anyone to navigate it with ease. In this case, even without the colour blindness filters, it was hard to understand which items were selected.

Due to limited time, I didn’t focus on redesigning the whole selection menu. However, I did provide examples for other visual-related issues.

Another section of the game where the lack of colour contrast would affect the player’s experience is when the interactable items are highlighted. For example, see the circled item in the pictures below when the player is far from it, and when they approach it.

In this instance, I provided two quick examples of how this problem can be solved.

1. Make the object’s colour value lighter

2. Make the object’s colour hue different while keeping the value lighter as well

While I couldn’t cover all the areas I would have liked to within the time frame, I redirected the developers to good examples of good accessibility design to consider in future updates.

1. Allow the end users to customize the colours to their own personal needs, due to how unique everyone’s vision and colour sensitivity can be.

2. Allow the end user to select a colourblind mode preset, an option that also grants the developers more control over the final look of the game (e.g. The Last Of Us Part II by Naughty Dog).

Consistency

Another aspect I addressed in my feedback was the change in the presentation of information, which would be introduced to the player in one manner at the beginning, and then another later in the game.

The following example showcases how different icons are utilized to indicate the shield gadget.

Sense of Control and Interactivity

One of the most fun features you can unlock during a run, after some hard work, is a second laser to aid you in destroying waves of monsters. With two weapons at your disposal, the player can feel quite invincible.

However, when you are using two identical weapons that mirror each other’s movements, it’s hard to tell which one you are actually controlling. For example, you might try to move the laser on the right to the left, only to discover that’s the mirror weapon and you’re really controlling the on the left. This becomes an issue when the player is in a dire situation, surrounded by a horde of powerful aliens.

A quick solution I presented to the developers, in case they could implement it for the release date, was to change the second laser to represent the it’s “mirroring“ property. For example, it could be a lighter shade or a different colour to make it seem more like an echo, a reflection or a ghost of the main laser the player is actually controlling.