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 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.
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.
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.
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.
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.
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.
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.
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.
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.
I designed a completely new icon library, replacing obscure, hard-to-identify icons for improved clarity and usability.
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.
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.
Back to Case Studies