top of page

UI/UX Case Study: Youth Sports Organization Website


PlayWRA.com Hero Shot

ABOUT THE PROJECT


The Whitpain Recreation Association (WRA), a non-profit youth sports organization based in Montgomery County, Pennsylvania, serves more than 3,000 athletes and families. In 2022, realizing the inadequacy of their outdated wrasports.org website, the WRA acknowledged an urgent need for a contemporary, mobile-responsive website to improve the promotion of their sports programs, simplify registration, and enhance the overall participant experience. A fresh website linked to a new league management platform would be launched, complete with a new web address: playwra.com.



PROJECT GOALS

  1. Create an engaging platform to showcase all available sports programs.

  2. Provide comprehensive information for parents, coaches, and sponsors to make informed decisions.

  3. Simplify the registration process for athletes and volunteers.

  4. Ensure easy access to by-laws, code of conduct, and grievance procedures.

  5. Foster community engagement by sharing news, promoting social media accounts, and sponsor opportunities.

  6. Provide contact details for association leadership and commissioners.


DESIGN PROCESS

  1. User Research

  2. Competitive Analysis

  3. User Personas

  4. Insights Summary

  5. Architecture

  6. Wireframes

  7. Color Scheme & Fonts

  8. Website Design


1. USER RESEARCH


The initial phase of user research centered around engaging with essential association stakeholders, such as board executives and sports commissioners. These individuals not only contributed to the content of the previous website but also played a crucial role in unveiling the requirements and challenges of their sport or administrative position that the new website should address. This approach aimed to gain valuable insights into the association's management needs and a preliminary understanding of key participants, encompassing players, parents, coaches, and sponsors.



2. COMPETITIVE ANALYSIS


In this focused area of study, I observed that while most families typically enrolled their children in the sports association associated with their residential township, the WRA was unique in its ability to draw in players from neighboring townships. This phenomenon was attributed to the WRA's size and stellar reputation. Analyzing historical registration data unveiled crucial insights into the geographic reach of the WRA's services and its appeal to families from diverse areas.


Subsequently, a competitive analysis was carried out, focusing on the websites of neighboring sports associations. Reviewed sites included:


What became evident was a common thread among these websites, characterized by cluttered layouts, outdated designs, and a narrow focus on a single sport. In contrast, the WRA's strength lay in its diverse offering of six youth sports programs which catered to instructional and intramural play, as well higher-level travel play. This meant, regardless of age or skill-level, participants could stay within the WRA for their entire youth sports journey. The challenge at hand was to ensure that the WRA's website effectively highlighted this unique strength.



3. USER PERSONAS


Three persona types were identified:


1. Parents interested in enrolling their children to play.

2. Parents or community members interested in volunteering to coach.

3. Local businesses interested in sponsorship opportunities.



EXAMPLE 1:


Dana, 38, is a physician's assistant and the parent of three children. She's enthusiastic about fostering their interests and helping them develop skills through extracurricular activities. While her job demands her attention, she values quality time with her family and seeks convenient ways to support their interests.


Dana values convenience, information, safety, communication and flexible payment options. She's looking for a user-friendly website where she can easily register her children to play without a complicated process, saving her time and effort. She was clear information about the programs available, including schedule, fees, and required equipment. Safety is paramount, so she expects an organization's commitment to child protection, including background checks for all volunteers, etc. She appreciates clear communication lines. She prefers flexible payment options, whether by check, credit card, or the ability pay in installments. Her pain points include complex registration processes and lack of information.



EXAMPLE 2:


Dave, 42, is a real estate agent and a dedicated parent to his 10-year-old daughter. He's passionate about soccer and has played the sport at a college level in his youth. His busy career in real estate keeps him occupied, but he's eager to get involved in his own daughter's soccer journey now by volunteering as a coach for her team.


Dave values clear information, easy registration, support, and resources. He needs a website that defines the commitment of the sport he is volunteering for and one that provides a straightforward registration process that doesn't consume too much of his time. Although he played soccer, he would appreciate access to coaching resources, such as practice plans, drills, and guidance on working with players. His pain points include disorganized information and lack of support, as he wants to feel confident when he steps onto the field to coach for the first time.



EXAMPLE 3:


Michael, 55, is the owner of a local restaurant that has been a staple in the community for over a decade. A former baseball player himself, he has a deep-rooted passion for the sport. He recognizes the importance of giving back to the community and wants to use his restaurant as a platform to support the needs of the local youth baseball program. Michael is not only interested in contributing to the community but also in maintaining the awareness of his restaurant among the parents of baseball players.


Michael values community engagement, always seeking ways to give back to the local community. He values brand visibility, wanting to keep his restaurant top of mind especially with an increased number of restaurant options today. He also values networking, making connections with coaches and parents. His pain points include uncertainty on how to support the program and who to contact.



4. INSIGHTS SUMMARY


While the websites of neighboring sports association exhibited the same issues as the WRA's, the WRA's strength was in its diverse offering of multiple youth sports programs. The delivery of a new website, modern in look and feel, responsive to mobile devices, and one that organized the depth of information users were looking for had the potential to further separate the WRA from neighboring programs, simplifying the decision-making process for potential participants.


The new website needed to prioritize a user-centric approach, ensuring that it catered to the needs and pain points of each persona. For instance, for a parent like Dana, the design should provide a quick and clear path to the registration process, while also providing comprehensive program information, and emphasizing child safety procedures. Volunteers like Dave require clear information, coaching resources, and a headache free registration process. Sponsors like Michael needed a clear pathway for engagement and brand awareness.


By aligning the design with these insights, the WRA's website could enhance the user experience, draw in a wider audience, and more effectively cater to the needs of its various stakeholders.



5. ARCHITECTURE


PlayWRA.com Architecture


6. WIREFRAMES


Example provided below for home page:




7. COLOR SCHEME & FONTS


PlayWRA.com Color Scheme



8. WEBSITE DESIGN


Before commencing the design stage, I initiated a comprehensive technology assessment of sports league management platforms to identify an ideal solution for seamless integration, a necessity for league and registration management within the association.


After careful evaluation, TeamSnap emerged as the chosen platform, serving as a centralized hub to efficiently oversee all sports-related business operations. Leveraging WordPress for the website's construction enabled integration with TeamSnap, establishing key connection points into the platform, such as user dashboards and online registration forms tailored to the diverse sports programs offered by the association.


This integration also empowered TeamSnap to facilitate an effortless sponsorship procurement process for sponsors interested in supporting the association's teams or making a general donation.


A one-person 10-week development phase encompassing all UI and UX requirements, including wireframing, design, photography sessions, and content creation culminated in the launch of the website "playwra.com," which is live and viewable here.


See sample screens below.



NAVIGATION


PlayWRA.com Navigation


HOME PAGE


PlayWRA.com Home Page


SAMPLE INTERIOR PAGE


PlayWRA.com Interior Sample


RESULTS


In the wake of the website's launch, an overwhelmingly positive response was received from users - association board members, commissioners, coaches, and parents alike.


The feedback was a resounding testament to the intuitive and user-friendly nature of playwra.com. Users expressed appreciation for its sleek and modern appearance, seamless operation on both desktop and mobile, and its well-organized design that facilitated the hassle-free discovery of information and program registration.


Playwra.com, one year post-launch, now maintains an average of 1.5K monthly click-throughs and has efficiently managed nearly one million dollars in registrations fees.




25 views0 comments
bottom of page