KATC (Key Action Tournament Cards) is a feature that was added to Mogul.gg’s core product. Mogul.gg is an esports tournament hosting platform, and KATC was created in order to solve for a high user drop-off rate between the registration & participation in a tournament.

Challenge

Users will often lose track of tournaments they have registered for. It is also not always easy for a user to understand what their next step is in the tournament process.

Process

The goal was to clarify site navigation in the context of a user’s tournament experience, reduce the drop-off rate for players from registration to participation in a tournament, and improve the tournament experience for players.

To do this, we created a new notification system, built a prototype and tested this new design with users, then iterated prior to implementing the new feature within Mogul.gg's product.

Success metrics

  • Reduce tournament no-shows
  • Reduce forfeits in later rounds
  • Decrease drop-off rates
  • Increase average participation rates

UX thought process

Because of our assumptions that users will lose track of tournaments they have registered for, our goal was for the tournament cards to both remain on a user’s screen at all times, and to also stand out enough that they are easily noticed by the user.

There are many different types of tournament formats hosted on Mogul, so our goal was to account for each type of tournament, and to create unique cards for each step of each tournament process. This required careful analysis of all supported tournament formats and their associated steps.

UI thought process

Our UI thought process was heavily guided by our UX requirements and assumptions. We wanted the cards to stand out as much as possible to users, so we created a color scheme for the cards based on different states of criticality: non-critical actions (grey cards), critical actions (blue cards), and extremely critical actions (orange cards).

Both critical and extremely critical cards, as well as the extremely critical modal, have animations associated with them in order to make them more noticeable to users. The animation is twice as fast when associated with extremely critical actions, to further convey the urgency of the action the user needs to take.

An example of a critical action modal

Research process

n order to understand the reason why users were dropping off between registration and play, we conducted user surveys asking users questions around tournament attendance.

We also used a prototype made in Figma to conduct unmoderated usability tests to test for the usability, understandability, and efficacy of this feature prior to implementation.

Post full live-implementation, we will collect quantitative data from analytics to further analyze the feature’s success. We will use this data to iterate on the feature, and A/B test on the iterated feature vs. the original implementation.

Affinity mapping

An affinity map was created out of user’s responses to the tournament experience survey in order to visualize how many similar responses were submitted.

Responses of those who have missed tournaments are in orange, while responses of those who have not missed tournaments are in blue. Responses in orange note why the respondent missed a tournament or what they think could have prevented them from missing it. Responses in blue note why they believe others may have missed tournaments.

Test findings

  • Users generally found the tasks easy to complete and understand:

    "Overall the task was very easy, I was able to do it in 2 clicks and like 5 seconds." - user on the ease of tournament check-in
  • Users generally found the tasks easy to complete and understand:• Users enjoyed the animation, and expressed that it caught their attention

    6/6 users mentioned that the animation caught their attention
  • The confusion users experienced was generally not on the KATC cards themselves, but on the screens that followed
  • 2/6 users thought they had completed tasks that they did not fully complete
  • You can also view the full research findings deck here.

Iterating

  • Reduce tournament no-shows
  • Reduce forfeits in later rounds
  • Decrease drop-off rates
  • Increase average participation rates

Next steps

KATC is in the process of being implemented fully by Mogul’s development team, and analytics will be collected as well.

Depending upon the nature of the statistics, we will delve deeper into any significant analytical findings, using A/B testing, unmoderated testing, and/or user surveys.

In the meantime, it’s also been recommended that we review our comms strategy and strengthen it so users are always reminded about their upcoming tournaments and matches. Our team has also recommended that we do eventually create a companion app to help users with their scheduling.