CoachU
Designing a Complete Responsive Website From Scratch for start-up company
Overview
*Please excuse new additions to site, as I no longer edit/monitor www.withCoachU.com*
CoachU is an early stage development sports company that supports personalized coaching for teenagers from top college athletes. They aim to empower student-athletes to capitalize on NIL by connecting them to personalized digital coaching.
The company consisted of two founders. I was the sole Product Designer tasked to create a dynamic, responsive, and informative website to help launch their company. I collaborated with the CEO to leverage the existing brand guide in order to design individual elements and pages for the website, which attracted new customers and funding.
I crafted a new website, increasing visitor traffic by 600% and gaining recognition from media outlets, such as FOX, USA Today, Digital Journal, and more.
My Role → Product Designer and Website Developer
Tools → Figma, WordPress, Adobe XD, Canva
Scope → 4 months with ongoing updates
The Problem
CoachU lacked a website. They needed a platform to help showcase their service, outline their process, and gain additional customers and coaches. The CoachU CEO also desired credibility and funding, which was impossible to gain with no website.
How We Found A Solution
User Research
I began the process with an initial phone call with the CEO to outline their wants and needs. I determined that they prioritized:
- Quick turn-around
- Clean, sporty look
- Simple user flow with easy navigation
The founders shared their product deck, user interviews, and research to further explain their vision (although these files will remain confidential, per request).
User Personas
Below are the user personas I built based on information received from the interviews with the CEO.
Competitive Research
Hover and click through the slides below to visualize the coaching sites.
The Takeaways:
- Include “Featured In” and media sections to increase user engagement.
- Use simple, relevant imagery and color blocking to draw the eye and enhance visual appeal.
- Create uniform buttons and distinct visual hierarchy to not confuse the user.
How Might We...
- How might we incorporate inclusive features to accommodate users of all ages, including parents, students, and investors?
- How might we create space in the site that allows for additional coaches, features, etc.?
Brand Design
The CoachU founders had previously hired a brand designer to help narrow down their creative direction. They shared the final decisions with me to help build their vision.
UI Design
Once the branding material was shared, I created CoachU’s UI system.
Information Architecture
The purpose of this site is to learn about CoachU and to contact the creators.
Product information and a contact form were crucial features for the CoachU creators to showcase their new company, so these two features will be exemplified in the user flow. However, it should be noted that all flows are fully functioning on the live site.
Wireframes
Sketching out a couple of pages that highlighted some card features and button placement helped me visualize information structure and overall layout. My next step was to transfer my sketches to Figma, then to my final platform on WordPress.
Prototype
In light of a tight deadline, I decided to skip building a hi-fi prototype on Figma. This way, I could send the website link to various testers, iterate as needed, and finalize the website sooner.
Due to time constraints, we prototyped directly in WordPress
Usability Testing
The goal of this usability testing was to ensure the site’s function, features, and appearance were in-line with the users and CoachU’s creator goals. The participants were tasked with 3 flows, listed below.
The Method:
Zoom & In-Person
The Participants:
n = 15 : Ages = 13-63 years old.
Consisting of: college athletes, teen athletes, students, and parents.
The Tasks:
- Book an appointment
- Access a coach’s profile
- Find and fill out onboarding survey
Findings
1.
Users were not aware of the company and expressed interest to know if it was growing.
2.
Users claimed it was difficult to access other pages when scrolling. They wanted "freedom" to navigate throughout.
3.
Users questioned the impact of the company, not knowing the extent of coaches and clients utilizing their platform already.
Iterations
Various rounds of iterations were performed, based on the usability test feedback.
1.
An "As Seen On" banner was added to promote their brand and boost views. Additionally, the CEO requested to include a Partnerships section to showcase brands, like Swing Vision, supported their company.
2.
Additional buttons to access seperate pages within the site were added for better user experience.
3.
We added testamonials of real clients and coaches to increase confidence in the brand.
Impact
- Crafted a new website, increasing visitor traffic by 600% and gaining recognition from media outlets.
- Conducted competitive analysis and user journey research to inform website design decisions.
- Implemented Figma components and a new design system, improving design efficiency by 30%.
- Leveraged existing branding guide to design individual elements and pages for the website, which attracted new customers and funding.
The main goal of this project was to design and create a functioning website to display an accurate account of the CoachU brand. This is a completed site, however, since the company is new and ever-evolving, I am continuing to iterate and add new features every week.
What is Planned
I have several additional features currently in-the-works or planned down the line. Some features include:
- Ability to filter through different coaches
- An “in-the-media” section to showcase their successes
