Camille Mennesson Portfolio

Context

Provide a brief overview of the project, including the context and objectives.

What I did

Describe the problem you aimed to solve with this project.

Tools

Outline the research methods used (e.g., user interviews, surveys) and summarize key findings.

What is Catan?

Catan Universe is a board game adapted online on web, steam and mobile platforms. I started playing again during covid on the web browser version. They launched a UI update 2.0 DURING COVID lockdown.

UX ISSUE

1. Invasive Welcome Screen

It’s been quite some time since I wanted to get back to Catan and play a few games. I’m welcomed on the landing page with an “Important Message” pop-up about Catan tournaments.

Here are the issues I found on this pop-up screen:

Relevance. I did not log-in for a long time, hence there’s a little chance I’ll be interested in tournaments

White space. I understand the intent for elegance and maintaining focus on the text and call-to-actions but, the message itself and the t-copy is poorly done

Text copy & design. Same style and color for every word, nothing stands out. If this is important information why not put it on this screen instead of redirecting users on the external Discord server.

This is the first screen I see when landing on Catan Universe Browser Game.

SOLUTION

Add the Discord link + external link icon for better visibility

Change CTA copy to be more clear

Change title and text in bold for visibility and readability

Add a close button (in coherence with the other screens interfaces)

UX ISSUE

2. Log-in and Password Reset

Stepping-in the bigger issues here, it took me around 4 minutes to reset my password and log-in (no, this is not normal).

No error prevention. There’s no error prompt when mistyping an email address. I didn’t understand why I could not click on the new password button until I saw a missing character in my email.

Legal freaks. This is the second time I’m asked to confirm if I’ve read the Terms of use and Privacy policy, which is blocking me from getting my new password.

Wrong Error prompts. I can see there are two error prompts here but I am not sure what’s really wrong: the code and the password fields are both highlighted in bright red but there’s only 1 error prompt saying “wrong code”. Is it my password ? or my code ?

Legal freaks #2. I managed to update my log in credentials, but… I’m asked to accept T&Cs again before I can log-in (for the third time).

UX ISSUE

3. Unintuitive Game Creation

Some critical information to understand how to create a game and play are missing and/or are badly delivered.

Issue of information structure. “The Game” is the first option I’m given, what are the others? not games? this interface needs better explanations on game options I have.

Both singleplayer and multiplayer “The Game” options have the same description when the content cannot be adapted for both, creating a confusion for players.

Confusing text copy. The “Scenario” and “Activate per buying gold” are out of context. Are scenarios games? Do I need to purchase something to activate the game?

SOLUTION

Adapt the content to the context and chose careful vocabulary that matches the real world for better understanding (Jakob Usability Heuristics).

Add an option to buy expansions if they are presented on the side of the screen.

USABILITY ISSUE

Use of radio buttons instead of checkboxes. when there are in fact a list of options where I can select any number of choices (Consistency & Standards).
The “Start game” button has a sun icon associated to it underlying I can’t play without those. This should be explained somwhere before so there’s no bad surprises.

UI ISSUE

4. A very crowded HUD

The overall game interface just feels very busy. For a strategic game like Catan, I really just need the relevant information so I can focus on my next move (Aesthetics & Minimalist).

Unnecessary UI elements.
I’m not sure this huge vertical menu on the bottom left is for. Here are 8 small icons that are not necessary (maybe keep the main settings and the chat?)

All the other elements can be hidden into the settings icon and shown when clicked if necessary.

Missing what’s happening during another player’s turn. The visual hints to understand what is currently happening are too small and going too fast (the bottom left white text, cards animations, yellow highlight on player’s picture) (Visibility of System Status)

An example of how quickly a turn goes.

It’s hard to see who is winning. I can’t easily distinguish key information from each player: number of points, development cards, biggest army, and longest road. This is an issue since it’s critical information for this type of strategic game.
I don’t know which and how many cards I have in my hand. This is a key information that I need to have in mind at all times (when it’s my turn or when exchanging with other players). Considering the size of the board, the number of other visual information and the pace of the game, it’s hardly impossible to quickly scan what types of cards I have in hand.

SOLUTION

Going back to the previous design would be a good start: full cards easily recognizable.

Dice button in the wrong place. The most frustrating miss-click in my life… the dice roll and skip your turn buttons are at the exact same position and if you’re acting too fast and misscliked, you lose your turn.

Emojis to replace human interactions. The only exchange I can have with my fellow AI co-players are emojis displaying expressions that range from happy, confused, angry, cocky, or sarcastic (from what I interpreted). The worst is “impatient” emojis from other players when It’s my turn and I usually need to think in calm on what will be mly next moves.

Final thoughts

Even though I am not a fan of the new design, I still play a lot online with friends because I love this game - it might not be the same experience for new players who are discovering it now.

Lire le prochain case study