Type

Mobile App

Work

User Flows, Wireframes, Designs

Role

UX Designer

When

Mar 2020

MVP For Innovative Soccer Training App

Boosta

Background

There is a niche community of serious youth soccer players and high demand soccer coaches. Alfredo Sainz is one of these highly sought after youth soccer trainers as he is most notable for training the youngest female soccer player to be recruited into the Olympics. Young players and their parents are so eager to get some time with Alfredo that he had people from all over the world emailing videos of their kids doing drills and asking for feedback, because not everyone could afford to travel or relocate to be in proximity to him.There is a niche community of serious youth soccer players and high demand soccer coaches. Alfredo Sainz is one of these highly sought after youth soccer trainers as he is most notable for training the youngest female soccer player to be recruited into the Olympics. Young players and their parents are so eager to get some time with Alfredo that he had people from all over the world emailing videos of their kids doing drills and asking for feedback, because not everyone could afford to travel or relocate to be in proximity to him.

What is the app?

Boosta is a unique private training app centered around an interactive step-by-step learning system that provides a one-on-one connection between athlete and trainer. This app aims to give players around the world access to high level training and feedback, with a vision to expand this technology to other sport and training sectors.

Project Summary

I helped the Boosta team take their initial ideas and wireframes into a captivating first MVP iteration to showcase the concept to potential clients and investors.

With a limited time and budget, I was able to deliver Boosta the app that got them to the next level of growth, and to this day continues to grow.

www.boosta.training

My Role

The Boosta team came to JLOOP digital agency to help design and develop their app. It was me (UX Designer), a project manager, and a developer who worked in collaboration with the Boosta founders who provided branding/art direction.

Define Scope & MVP

The Boosta team came to us with an initial set of rough wires and a vision for what they wanted this first version of the app to be. After discussing development power and cost, we agreed on a vision for the MVP phase. We wanted to make sure the app would have a Player and Trainer side of the interface. At it’s simplest, we wanted the trainer to be able to create drills and give feedback, and we wanted the player to be able to complete drills and view feedback. This would give Boosta enough to demonstrate the purpose and effectiveness of their app concept to get more buy in from investors.

To have a clear visibility and consensus of the scope of this MVP scope I made a wire map of all the screens we needed, with the understanding that we would expand on the more complex flows in the next user flow & wireframing phase.

Player Side

Player Side

Browse training drills and complete steps of the drill.

Browse training drills and complete steps of the drill.

View trainer feedback and resubmit steps of the drill

View trainer feedback and resubmit steps of the drill

Trainer Side

Trainer Side

Create drill exercise broken down into components for player to learn in chunks

Create drill exercise broken down into components for player to learn in chunks

Review students’ drills and record video feedback to send back.

Review students’ drills and record video feedback to send back.

Mark players as succesfully passing a drill

Mark players as succesfully passing a drill

User Flows

There were two major areas that needed a bit more thought and architecting:

-A player’s experience of going through a challenge and getting feedback and then re-doing the drill, What does that look like?

-A trainer’s experience of creating a challenge, what does that look like?

This was the most challenging part of the app. I’m no stranger to competative analysis, but there really was nothing like this out there for me to reference. I had to devise the interface and flow from scratch.

These user flows helped me map out the wireframes I would need for this part of the MVP.

Wireframes

I was now able to take the MVP map and the user flows and start producing wireframes for the team to review and refine.

Trainer Creating A Challenge

Uh Oh! Ran into a problem!

When it came time to review wireframes with the team, we discovered that I had let my young ambitions for the best user experience design something that would be too hard to build at this MVP phase. As I was trying to solve for the experience of a player sending his recorded step and then getting feedback for the step, I decided a chat box to contain these back and forth interactions would be best to contain the interaction and so both people can review past history of the step.

Trainer giving feedback to a step of the drill

It was a great idea, but not realistic, and a big lesson learned for me. So I pivoted and created something simpler and more 2 dimensional for the MVP phase.

Revision

Key Issues Solved in Wireframe Phase

Key Issues Solved in Wireframe Phase

Key Issues Solved in Wireframe Phase

-If someone gets good feedback on their final/full step, but errors on the individual steps, do they pass the challenge? Do we send all steps at once or one by one?

-What is the best experience of a player viewing a step and also the associated trainer tip.

-Can a trainer edit a published challenge? Only trainer tip because many kids might already be working on a version of the step.

Designs

The designs and color pallete were branded to the existing Boosta App Logo which the Boosta team provided

2023 Pearl Framer template crafted with love by Dawid Pietrasiak

2023 Pearl Framer template crafted with love by Dawid Pietrasiak

2023 Pearl Framer template crafted with love by Dawid Pietrasiak