For this project, I was able to secure a client who runs a small tennis coaching company called Rally Tennis Club out of Los Angeles, California. The owner previously did coaching services under a different company name and is rebranding to create a new company with their current coaching partner. 

My goals for this project were to gain experience working with an actual client and to build something tangible that would be used in real life. Finding this company worked well because they were already working on a logo with a graphic designer and were in need of inexpensive web design. They were happy to take a chance and give me this opportunity despite still being an inexperienced student.


Role: sole designer and researcher

Tools: Figma, Miro, Whimsical, WIX

Competitor Analysis

After securing the client and setting up our first meeting, I conducted a competitor analysis of three tennis coaching companies that operated similarly to my client. My goal was to better understand the services they offered and analyze the strengths and weaknesses of other companies currently in the market.

I identified fundamental elements that would need to be included in my work. Features that were consistent across all company websites included: lesson offerings, contact information, location details, and basic information about the company and its staff.

I also noted several common issues across the competitor sites, such as poor organization, difficult navigation, excessive text, and cluttered layouts—all of which could confuse users and reduce overall functionality. Based on this analysis, I determined it was a clear priority to make the Rally Tennis website clean, easy to navigate, and focused on simple, effective content.


First Client Meeting

I coordinated the initial meeting over Zoom with the two owners and main coaches of the company. During this session, I established a strong rapport with the clients, both professionally and personally by introducing myself, sharing my background, and answering all of their questions to build trust and alignment.

To better understand their brand, I came prepared with a list of targeted questions aimed at uncovering their company values, business goals, and vision for the new website. During the meeting, they also granted me access to their existing WIX account, which housed their previous site and would serve as the platform for the redesign.

To ensure consistent collaboration throughout the project, we agreed to hold weekly Zoom check-ins where I would present my progress and gather their feedback.

First Steps

To organize and make sense of the information I gathered during the initial meeting, I created user personas and a mood board. These tools helped me better understand the target audience I was designing for and how that might translate visually.

The personas were based on the two primary audience groups identified by the client: young working professionals and mothers with young children. Each persona reflected the goals, needs, and background of these user types, guiding both the content strategy and user experience design.

I developed the mood board using visual inspiration and references provided by the client. This helped capture their desired aesthetic and tone for the site, serving as a visual reference point throughout the design process.

Mood Board

Personas

Brainstorming and Organization

My next step was to define the site architecture and identify the core features needed for the new website, ensuring the project moved forward in an organized and strategic way. I began by annotating the company’s previous website to evaluate which features the client had been using, and to assess both its strengths and areas for improvement.

This process allowed me to retain familiar structural elements the client was comfortable with, while also introducing enhancements based on best design practices and principles. The goal was to guide the client toward a more effective, user-friendly design without losing the functional elements they valued.

Site Annotations

Lo-fi Sketches

Using the client’s previous website as a starting point, I sketched several layout concepts to visualize potential structures for the redesigned site. While developing these sketches, I prioritized the key sections the client requested: Summer Camp, Lessons, Locations, Testimonials, Contact Us, and About Us.

In addition to organizing this content, I incorporated one of the client’s primary requests that most content would be available on a single, scrollable home page to accommodate mobile users best.

User Flows

Keeping the target users in mind, I developed several user flows to map out how visitors might navigate the site and the steps involved in completing key actions.

New Mood Board

During further discussions about the visual direction of the site, the client expressed their preferences for colors including purple, hunter green, royal blue, cardinal red, or a traditional color palette complemented by one “completely crazy, out-of-the-box” color. They also favored a combination of a modern sans-serif font paired with a more playful and lively typeface to add personality.

Using these insights, I created an updated mood board to reflect their refined aesthetic vision, ensuring the design aligned closely with their brand identity and preferences.

Mid-fi Mockups

After checking in with the client and receiving approval on the work completed so far, I proceeded to develop the site’s layout by creating multiple mid-fidelity mockups in Figma. My goal was to establish a clear, cohesive layout to guide the development process before building directly in Wix.

I then presented these mockups to the client, and together we reviewed the designs to identify preferred elements from each. This collaborative discussion helped define the direction and structure for the final site layout moving forward.

New Visual Inspiration

The client ultimately chose a clean and minimalistic aesthetic featuring a black-and-white monochrome color scheme. To help guide the design, they provided two websites as inspiration that captured the look and feel they wanted to achieve.

High-fi Designs

Version 1

With a clear reference for the site’s layout and aesthetic, I proceeded to build the first version of the website on Wix, using placeholder images until the final assets became available.

Version 2


After reviewing Version 1, the client requested a more minimal, image-free design focused solely on content.

Iterations:

  • Client wanted a more sleek/clean feel 

    • Wanted no images throughout 

    • Just relevant text 

  • Shortened the navigation bar

    • Took out locations and FAQ’s links

  • Removed testimonial section 

    • Will have link to Yelp 

    • Don’t need reviews directly on the site 

  • Made a sign up button 

    • Links to a google form to sign up 

    • Removed phone number and email sign up

Version 3


I got feedback on version 2 from group critiques, my Design Lab mentor, and the client. While the client liked this version, feedback from the group critique and my mentor found the site too boring and unengaging visually. I was a bit concerned that this would be a problem after removing most of the images as the client requested. However, using advice given from my mentor and peers, I made version 3 with the following changes.

Iterations:

  • Summer camp section

    • Added more personality 

    • Used icons 

    • Created a timeline layout for daily schedule 

    • Redid the prices design 

  • Used lines to break up the different sections 

  • Lessons section

    • Added a calendar layout for the group lessons schedule 

    • Redid prices design 

  • Locations section

    • Layed out side by side 

      • More concise 

    • Added location addresses  

Iterations:

  • Summer camp section

    • Edited layout 

  • All prices 

    • Redesigned again  

    • Made more consistent throughout 

    • Went with a more simple look 

  • Lessons section

    • Cleaned up/simplified the calendar design 

    • Added a link to “Meet the Coaches” under private lessons 

      • More personal 

      • Users can get to know coaches if they are considering doing privates with them 

  • About us page

    • Redesigned coaches’ bio section 

    • Added boxes and circular pictures 

Version 4


After receiving more feedback from my mentor and client on version 3, I found the site was much more engaging and on the right track. The client liked the changes made and didn’t mind the use of color, which I was initially concerned about as they had only wanted black and white before. Minor adjustments needed to be made stylistically, but the overall elements worked. This version would be the one used for usability testing.  

Usability Testing

Methods:
Usability tests were conducted over Zoom, with participants’ consent obtained to take notes and screen-record each session for later analysis.

Participants:
Six participants aged between 23 and 55 took part in the testing. Their tennis experience varied from none to active players. The group was evenly split with half being parents of young children and half being young adults without children. Depending on their profile, participants were assigned either Task One or Task Two—but not both. Afterward, all participants completed the remaining tasks and answered follow-up questions.

To ensure consistency across sessions, I followed a prepared test plan that guided the flow and timing of each usability test.

Results:
Observations from the usability tests were compiled into a feedback grid to highlight successes and clearly identify pain points. Users appreciated that the site was easy to navigate, straightforward and simple, visually appealing, and facilitated easy sign-up.

However, the most pressing issues users encountered were a lack of detailed information about lesson sizes, structure, locations, and goals. Additionally, users expressed uncertainty around the criteria defining beginner, intermediate, and advanced player levels.

Feedback Grid

Final Iterations

I compiled the usability feedback into a grid to identify pain points and areas for improvement. The primary insight was that users appreciated the visual clarity and simplicity but wanted more detailed information about services.

Iterations:

  • Lessons sections 

    • Clarified groups are mostly for children 

    • Added the one adult lesson they do offer 

    • Added group lesson structure and goals 

    • Mentioned they do quarterly progress reports for students 

  • Frequently asked questions 

    • Added info about group lessons sizes 

    • Described what the different skill levels are 

    • Clarified how locations are chosen for lessons 


Reflection

This project was a valuable learning experience, as it was my first time working with a real client and developing a live product. I gained experience in client communication, project organization, and balancing user needs with client preferences. I truly enjoyed working collaboratively with the client. It was rewarding to hear their vision, apply it in the design, and receive their feedback. While I always adapted my work to their input, I also learned how to advocate for good design decisions and explain why some of their ideas might not be in the site’s best interest.

One of the biggest lessons I took away was the importance of adaptability. The design changed significantly throughout the process and there were times when I felt uncertain or stuck in the cycle of designing, getting feedback, and iterating again. But I kept moving forward and gradually the vision become clearer. In the end, I’m proud of the final product and grateful for what this project taught me: to trust the process, stay flexible, and always keep the user experience at the center.

Previous
Previous

Hobble

Next
Next

Puzzle Swap