Aaron Terrazas

Senior UX Product Designer

Aaron Terrazas

Senior UX Product Designer

Case Study

GotSport
GotSport Mobile App
  • UX Research
  • UX Design
  • UI Design
  • Prototyping
  • Chat
  • Mobile App

GotSport

GotSport (GotSoccer) is the leading provider of soccer software in the USA. They have been developing tools to help get players on the field since 1996, and help make things simple and easy for the sports community.

The Challenge

The existing mobile application exhibited numerous inconsistencies in its UI, including varying font sizes, off-brand colors, and inadequate contrast that failed to meet accessibility standards. Additionally, users faced several experience challenges, such as a confusing chat interface and the absence of a dashboard to quickly provide essential information upon opening the app.

The Solution

Although I didn’t have direct access to users for interviews, I was able to interview stakeholders to gather insights. They provided feedback they had received from users and shared existing personas with me, which helped me understand the user perspectives indirectly.

I designed a dashboard that features alerts from teams and coaches, an upcoming events module, chat notifications, and a dedicated space for sponsors. I completely reorganized and revamped the chat, contacts, and profile systems to enhance intuitiveness, allowing users to manage everything in one convenient location within the app. Additionally, I simplified and streamlined the processes for creating posts, starting chats, and setting up events by standardizing a familiar icon throughout the UI for a consistent user experience.

The Result

Happy customers! The new experience significantly boosted engagement with the app among parents, children, teams, and coaches. The introduction of pre-defined customizable color themes within the design system not only enhanced consistency across teams, but also streamlined the onboarding process for clients.

Dashboard

Instead of a dashboard in the home section, the app originally featured a news feed, which didn’t fully meet users’ needs upon login. I relocated the news to its own dedicated section and designed a new dashboard that provides users with alerts from their teams and coaches, upcoming events, chat notifications, and a space for sponsors.

Schedule List View

The schedule section featured nearly indistinguishable icons, colors that failed to meet accessibility standards, and lacked a legend to explain the meanings of the icons and colors. I introduced a legend for each event type, eliminated the icons, and redesigned the UI to be simpler and more readable at a glance.

Schedule Month View

The month view was a user-requested feature, but it was challenging to see the times of each event, and clicking on a day led users to an entire event list. I redesigned this to use simple dots to represent each event type. Now, clicking on a day opens a pop-up overlay displaying the events for that specific day.

Simplifying: Chat / Contacts / Profiles

The chat, profiles, and contacts sections were overly complicated, with multiple options for initiating chats and an unnecessarily lengthy process. I streamlined the user experience by consolidating all chats into a single section, enabling users to manage everything in one place. Additionally, I pinned the team and coaches chats to the top of the feed and introduced filters for direct messages and group chats.

Chat

In the old flow, starting a direct message required users to click on a contact, access the ellipsis menu, select chat, and then create a new chat. To initiate a group chat, users had to navigate to the chat section, click search, choose "create a group chat", and then select participants. The new flow I implemented allows users to be taken directly into a chat by clicking on a contact. To start a new chat, users simply click the "create" button at the bottom of the screen and add the desired participants. Each chat can also be named and have a customized avatar.

Profiles

I designed a user ID card that allowed users customize their wallpaper and provides options to view a child's parents, message them in the app, or call them directly.

Icon Library

I designed a completely new icon library, replacing obscure, hard-to-identify icons for improved clarity and usability.

Avatar Library

I developed an avatar library not only to enhance design and showcase to stakeholders, but also to allow users to select from a range of pre-designed avatars.

Color Guide

Building on the existing brand guide and legacy mobile app, I repurposed the color styles and introduced additional colors for use throughout the new app as part of the new design system.