De Rosa Soccer Training, Responsive Web Design:
Desktop & App
A streamlined platform designed to make booking youth soccer training programs a breeze. Easily browse and compare programs, manage athlete information, and complete secure transactions, all in one place. Simplifying the process for parents to support their young athlete's soccer journey.
My Role
End to end designer
Tools
Project duration
5-6 weeks
The Problem
The current online presence of De Rosa soccer skills/strength and conditioning coaching relies solely on Instagram, lacking a dedicated website. This limits accessibility to information about services offered, an about page for the coach and complicates the process of scheduling and payment for training sessions on one website.
The Objective
Create a responsive web design for De Rosa Soccer Training addressing the current limitations of their online presence.
Proposal
A comprehensive, responsive website design providing detailed information about services offered, be able to view upcoming class & sessions offered, booking a session and streamlined payment on one website.
Knowing the Competition
Understanding the strengths & weaknesses of the competition so that our user’s experience can be better.
Coerver Hawaii
Teaches soccer players looking to improve their technical skills and understanding of the game through structured training programs. They cater to players of all ages and skill levels, from beginners to advanced.
Caters to players of all ages and skill levels
No coach bios, full schedule of programs cannot be seen w/o registering
MIA Elite Academy
Primarily targets serious players looking to advance their skills and potentially pursue college or professional opportunities.
High level training and International trips opportunity
Disorganized registration & payment process
Hi Soccer Academy
Teaches soccer athletes of all ages and skill levels, with programs ranging from recreational to competitive.
Club & training skills development
Lack of brand differentiation
Connecting with users
Gaining insights through conversations
5 interviews with soccer parents via Google Meet
Affinity Mapping
A structured approach to help see the bigger picture & prioritize key areas for action.
💡 To achieve a more accurate interaction between the user and the features that the website offers, affinity mapping was implemented with five user participants (user interviews); organizing common themes and patterns into categories. Based on the findings, we can ideate, sketch and create wireframes.
Interview Insights
Parents have a need for mobile design for easy booking/resume where they left off, skill-level matching for programs, improved website navigation for multiple children.
Parents preferred detailed information on sessions (skill level, what will be the focus in the coaching session)
Being able to see at a month’s view of upcoming training times on a calendar is helpful for parents planning kids soccer schedule.
Empower parents to make informed & timely booking decisions by emphasizing key points by providing clear, detailed descriptive information on soccer training programs & classes.
HMWs
Leveraging Affinity Mapping Insights to Develop Potential Solutions
How might we create a streamlined booking platform for soccer parents so that they can easily discover and book high-quality soccer training sessions for multiple kids?
How might we enable soccer parents to find detailed and informative soccer sessions and coach specialties so that they can confidently book soccer coaching sessions for their kids?
User Personas
Sarah Johnson
43, works p/t in marketing while juggling her kids soccer activities
Newport, Rhode Island
Dedicated soccer mom
Needs
› Easy filtering and discovery of soccer programs by age, skill, location
› Calender views to book classes 2-3 months in advance for both kids
› Detailed program information on training session
Goals
› Find high quality, focused soccer training programs for her two kids
› Ensure kids receive individual attention and progress steadily
› Easily manage schedules for multiple kids at different age and skill levels
Challenges:
› Difficulty navigating websites/apps to find suitable programs
› Advanced classes fill up quickly, making it hard to secure spots
› Cumbersome to compare and book classes for two kids simultaneously
“I feel like there's too much information on there and it gets confusing to navigate based on kid, their ability and their age group and everything and then you'll get things that don't even pertain to your kid.”
Michael Lopez
28, single father with an avid soccer player daughter
San Diego, CA
Soccer enthusiast & p/t soccer coach
Needs
› Calender views to book classes 2-3 months in advance for both kids
› Access to practice videos, drills, and customized training plans
› Prominent highlighting of advanced/elite training programs
Goals
› Find advanced, specialized soccer training for continuous improvement
› Easily access training demos for at home practice
Challenges:
› Lack of personalized resources for at-home practice and skill development
› Relevant advanced programs are often buried or hard to find
› Limited information on coach specialties and session focus areas
“What's also important is what is the agenda, is it gonna be shooting? Is it gonna be playing defense or one on one training? I wanna make sure I know what's going on and I can keep her well suited and feel prepped for the next session.”
User flow
Feature Set
The highest priority features listed in the must have section are critical for establishing the website's core functionality and were taken from the user interviews synthesis, personas and business goals and provides all essential information to potential clients. The nice to have features enhance user experience and engagement. Lower priority items listed under surprising & delightful list and can come later could be created once the core offerings are solidified and time permits. The prioritization aligns with competitive analysis, interviews, and the goal of initially focusing on the website's primary purpose of addressing all user interviews pain points, needs and goals.
Low Fidelity Wireframes
Mid Fidelity Wireframes
The early wireframes served as a valuable learning experience, highlighting areas where the booking process could be simplified. Creating the high-fidelity mockups underscored the importance of designing a booking flow that was not only efficient but also intuitive and easy for parents to navigate.
Hi Fidelity Mockups
We've streamlined the soccer booking system for parents and reimagined the process, putting parents in control with a simplified, intuitive flow. Now, parents can spend less time booking, and focus on getting their kids more time playing on the pitch.
Desktop
Usability Testings
We conducted an unmoderated usability test with 5 soccer parents to assess how easily they could find and book soccer training programs on our platform. Participants were given tasks related to finding programs and completing a booking, and we measured success rates, time on task, and confidence levels. Feedback from this test will guided improvements to the platform's usability, ensuring parents can confidently find and book the right training for their kids.
Finding and booking a soccer session was a clear process and easy to understand for most users.
Four out of five users rated it a 5 (easy) and one user rated it a 4.
“I love the easy navigation and selection process on the page, very easy and stress free.”
“I like that the language was easy to understand and that I could find what I needed with good logic.”
“it doesn't have too much unnecessary information to overwhelm users and there's a lot of parents I know that this would resonate with them easily.”
Next Steps
To enhance the overall experience
• A shop for team uniforms
• Incorporating updates on weather & playing conditions
• Educational resources on injury prevention and treatment, promoting optimal recovery and athlete performance for a safe and healthy environment for all active players.
