Tournament Content Management System

Introduction

My Roles

Known Challenges

Chess tournament instructors spending excessive time on tournament management instead of focusing on their passion for tutoring students in chess.

Project Management Plan

Initial Steps

Design Strategy

Our first task was to understand the existing application. In other words, this was a project to iterate an existing app, not make one for scratch. To see an example of how I made a product from scratch, please see the Ford section in Highlights, on the Home page).

To do iterate this existing application, we assessed any user research that Growing Minds had. In many cases this can be anything from A/B studies (click link for example), personas, content from tools like UserTesting, and so on. In this particular case study though, there was no existing User Research. The timeline and budget were also short (resourcing constraints) so there was no opportunity to conduct User Research as a part of a scope of this iteration (beyond a persona and journey map). In ethnographical/anthropological terms the research you will see here is a thin description. For future design iterations, we would recommend expanding the User Research to multiple personas as well as starting using tools such as usertesting.com or UserZoom to conduct in-depth UX research.

Therefore, we created a series of flowcharts (jump to example in this case study) and mindmaps and then conducted stakeholder interviews to tie them all together. The charts below are some examples of what we came up with during the process.

Player-Oriented Mindmap (click to zoom)

Current Means to Create Tournaments (click to zoom)

Discovery Phase

Initial Application Overview

This diagram helped our understanding of the application. This mindmap was created when we finished working with the stakeholders and help persuade Growing Minds to permit us to go ahead with the redesign of the application.

This project's essential User Research element was Usability Interviews, primarily due to the nature of Growing Minds' client business. As a small company with limited app users, macro approaches such as surveys proved less valuable (discussed in greater detail in the next section).

As user researchers, we should generally rely heavily on generative Usability Interviews. Qualitative data is better than qualitative data when the participant pools are small. This element was discussed in Design Thinking workshops at the project's inception, ensuring Growing Minds understood the need for Usability Interviews. They generously provided interviews with five of their instructors, which I explained was generally the ideal number per user type. The contextual inquiry was employed in the discussions to create personas, and these interviews were validated by reviewing our findings with stakeholders. The value of the contextual design became apparent when we discovered that the application/project goal ranked as a third-tier priority, behind managing the overall business and teaching chess to students.

Usability Interviews

Due to the small user sample size, surveys, card sorts, and tree tests would have been less helpful. Typically, a survey requires at least 25-40 participants to achieve statistical significance. The greater the number of participants in a study, the more statistical significance. As a result, these methods were primarily used to confirm lessons learned from usability interviews and in-app store feedback. Usability interviews were conducted first to eliminate potential biases and establish that usability subjects represented the overall user pool.

As a user researcher, I decided that the team should rely on Usability Interviews. Consequently, Growing Minds understood the need for Usability Interviews and generously provided interviews with five of their instructors, which I explained was generally the ideal number per user type/persona (1 for this iteration).

Before conducting usability interviews, a Usability Study Design Plan (with study goals and explanation) was created, followed by Usability Interview Scripts. This approach ensured that questions and encouragements were scripted and uniform across all usability subjects. I led my UX designers in the first usability interview, as most of the designers were junior. I then allowed them to conduct the remaining usability interviews independently.

Based on the Information Architecture (IA) and Usability interviews, the application's Critical Flow path was identified, and User Personas were created. For a more detailed example of how I conduct user research, you can download this PDF for an unrelated project where I employed a similar process.

Large Quantitative Data

As with nearly any Journey Map, the goal is to document and understand Victor's experience navigating the app, considering the current process flow, user research, and testing. Although Victor is a persona created from UX research rather than a real person, we strive to put ourselves in his shoes, comprehending his feelings and actions as he uses the app.

Journey Map Explanation

This basic journey map addresses the points outlined in the fundamental process flow, allowing for more comprehensive journey maps to tackle complex process flows in future iterations. The red text throughout the Journey Map highlights problems and pain points, signifying the necessary work in the upcoming design revision iteration and illustrating Victor's pain and frustration while using the app. We aim for other project participants to understand and empathize with Victor, enabling us, as User Experience Designers, to advocate for the user. The Heuristics Inspection that follows will identify additional work needed. The Journey Map and Heuristics Inspection aim to scope and prioritize pending tasks.

Based on the red text, we may modify some actions. We will try adjusting the flow, design, and overall user experience to alleviate Victor's pain. For example, we identified that Victor needs help with navigating between sections and remembering which students belong in the tournament. To address this issue, we plan to implement a more intuitive interface that allows for easy navigation and student management, ultimately improving Victor's user experience.

Design Audit

A design audit is a way of checking the quality of a website's design. It looks at how well the plan meets general standards for user experience. The audit identifies errors or problems on each page and marks them for further analysis. This helps the team to focus their research and make improvements efficiently.

The audit uses a set of heuristics, or rules of thumb, to evaluate the design. We used a 9-point heuristic analysis from Nielsen Norman Group for this case study. These heuristics are common in the industry and apply to this project. We examined each page for user goals, efficiency, error prevention, and consistency.

Admin Users Page

This is the page where the website managers control everything in the background. We looked at it using the same rules as the rest of the site. When we found something wrong, we marked it on the page and explained why in a table. We call it the "admin users page" because it's just for the managers, not the chess players who use the site.

Tournaments Page

The tournaments page is the most important page on the website. It is where users can see and manage chess tournaments. However, in the current design, it is listed second in the navigation menu, which is not ideal. We identified this as an information architecture problem. For this case study, we focused on changing the ordering of the navigation menu to prioritize the most important page.

Edit Tournament Page

The edit tournament page allows users to add and edit details about tournaments. It provides more detail than the tournament overview page. We evaluated this page using the same set of heuristics as for the other pages.

USCF Members Page

The USCF members page is where users can view and manage their membership with the United States Chess Federation. We noticed that in the current design, the process for importing data was not smooth. This created unnecessary friction for users.

Heuristics Frequency Breakdown

Usability Testing

During the Usability Testing phases of the project, we conducted extensive usability tests to validate the personas, heuristic evaluation, and journey maps. All of the testing was carried out in person so we did not use tools such as UserTesting for this particular project. In this particular project, techniques such as card sorting and tree tests would not be valuable because of the small possible participant pool, so instead we did do expectations questions and first click testing.

We used usability testing at different stages of the project to validate our research and test wireframes and prototypes. Based on the test data, we iterated our designs and concepts until they met our performance metrics.

We found that efficiency, recognition, and help & documentation were the top three factors that needed the most attention to maximize our ROI on UX investment. We concluded that a holistic approach to these three factors would be the goal of the redesign effort. We also observed that the middle to end of the process was more error-prone and frustrating for users than the initial part of the process.

New Happy Path

To address the issues identified in the journey map, we developed a new process flow chart, which we called the "New Happy Path". The goal of this new flow was to simplify the user's journey through the app while balancing the most important user goals. We reduced pain points by 80% by targeting lessons learned from the top three heuristics and applying the previous journey map. We also implemented a wizard to make the design more intuitive for users.

Updated Journey Map

We used usability testing, interviews, and post-development reviews to create an updated journey map that took into account the user's emotions, thoughts, feelings, and actions. We found that users reported that the switch function in the Tournaments screen allowed for a secondary reinforcement of the delete button right next to it, and that Victor's stress was reduced due to reduced information overload. We also found that the Tournament Wizard allowed for greater control and freedom for Victor while creating a more intuitive flow.

Explanation of the Updated Journey Map

UX Specification Document

The UX Specification Document is a reference guide that thoroughly examines all elements of the UX design from a developer's context. Its purpose is to provide a single, comprehensive document for other elements of the business to use after the design process has been handed over. Unlike a Style Guide typically used by visual designers, this document shows interactions, and it often includes redlining for pixel padding and typography.

Explanation

Interactive Prototyping

What Is Prototyping?

In this case the prototype was created with Invision. However, I also created prototypes with Figma when I wasn't using Sketch. A prototype is an interactive design used for:

What Did We Do?

Impact Summary