SquadFlow log large and centered on the page with a lacross team huddled up in the background.

TEAM. PLAYERS. WINNING.

Helping teams and players make a name for themselves

TEAM
PROJECT
CEO | Project Manager | UX Writer
UX Designer | Two Developers
Increase usability of MVP on iOS and Android
MY WORK
TIMELINE
UX Writing, persona creation, usability testing
Three-week design sprint

The Challenge

SquadFlow is a sports management app for youth teams. The  goals of the sprint were:

  • Help increase product usability
  • Test the Minimum Viable Product (MVP) for usability, especially the In-app Purchase (IAP) flow
  • Discover current Net Promoter Score (NPS) and research what would help users raise their score

RESEARCH

The Game Plan

Before crafting any content, I interviewed the co-founders to determine the core of the SquadFlow brand.

Why?

Help athletes become the best version of themselves.

Personality

personable, energetic, a mix of traditional and modern, more serious than fun but some fun too, and accessible to all

Brand Voice

  • Motivational
  • Goal-oriented
  • Confident
  • Clear

Tone Map

With the brand voice decided, I created a reliable tone map for SquadFlow content.

A cross-hair diagram with content instances displayed in the four quadrants. The four main tone words are motivational, confident, goal-oriented, and clear.

Tell Me About Yourself, Coach

Surveys and interviews revealed some key findings.

20-60yrs
Age range of coaches
33%
Coach more than one sport
100%
Need more time in their day
83%
Administrative tasks are too tedious
66%
Coach because they enjoy the kids

"I need it to be as plain as day."

Coaches need an easy way to streamline administrative processes to minimize frustration and give them time back for what they love.

How might we:

USABILITY TESTING

MVP or WIP?

Test Goals for the user:

5
Users in the target market
100%
Failed to find IAP flow
6-8
Reported NPS range

Key Insights:

ITERATIONS

Game-time Adjustments

The SquadFlow original page with the custom blue/green color on the top fourth of the screen and itemized information about the squad in the center on a white background. Below are two buttons—"Update Squad Plan" and "Delete Squad".
  • CTA button color — make the color stand out
  • "Update" changed to "View" — people like to view what's already theirs and viewing their plan puts the user into the IAP flow
The SquadFlow original page with the custom blue/green color on the top fourth of the screen and itemized information about the squad in the center on a white background. Below are two buttons—"Update Squad Plan" changed to an orange color and "Delete Squad".
Profile page with an image of a woman on the top 1/3. The bottom 2/3s is an itemized list of information about the woman in the picture including Name, Email, Phone, Gender, and Position. At the bottom is the global navigation with Home, Roster, Calendar, Chat, and Profile buttons.

I added the updated CTA button to the profile page because that is where the users looked for the IAP flow first.

Profile page with an image of a woman on the top 1/3. The bottom 2/3s is an itemized list of information about the woman in the picture including Name, Email, Phone, Gender, and Position. At the bottom is a "View Squad Plan" button in orange and below that is the global navigation with Home, Roster, Calendar, Chat, and Profile buttons.
Announcement is displayed at the top. The rest of the screen is white with options to create and customize an announcement.

I changed the copy to be more concise while conveying the same message.

I led with the important information on notifications.

Announcement is displayed at the top. The rest of the screen is white with options to create and customize an announcement.
The SquadFlow logo is at the top, centered over the blue/green colored rectangle. Below is white with an itemized list of personal information. At the bottom are options to "Add Profile Photo", go to the "Previous" screen or the "Next" screen, both in blue.

Adding microcopy to the “Gender” question helps clarify the request for the user, gets recruiters the information they need, and minimizes liability.

Switching the order of the buttons and changing the UI helps users know where to go next.

The SquadFlow logo is at the top, centered over the blue/green colored rectangle. Below is white with an itemized list of personal information. At the bottom are options to "Add Profile Photo", go to the "Next" screen in orange or the "Previous" screen outlined in blue with blue text.
Plan page with a white card centered that has an itemized list of benefits the user receives from the Basic SquadFlow plan.

By eliminating a few words and adjusting the spacing, the card is easier to scan while making it appear that the user is getting more benefits.

Plan page with a white card centered that has an itemized list of benefits the user receives from the Basic SquadFlow plan spread across the card.
A success message in a white rectangle with the SquadFlow page in the background. The message reads, "Successfully Updated Squad!" with a blue "OK" below.

I updated the copy to be conversational and feel more human.

A success message in a white rectangle with the SquadFlow page in the background. The message reads, "High five! You updated your Squad!" with a blue "OK" below.

REFLECTING

Let's go, SquadFlow!

With a start-up SaaS company like SquadFlow, everything has to get done by a few people, which means things can get missed. While the UX writing was useful, it needed help being clear and concise. I gave the app a personal touch with the creation of a brand voice and tone that speaks directly to users. With these systematic changes, coaches, players, and parents will be cheering for SquadFlow for years to come.

In future design sprints, I would conduct A/B tests to determine if the suggested changes are effective and intuitive for users.

NEXT PROJECT
© 2024 Michelle Thorne. All rights reserved
LinkedIn logo connecting to Michelle Thorne's Linked in profile.