TennisWorld 🎾

Academy XI: UX/UI Elevate Course Project - Court Booking Application

A 12 week period of learning and putting into practice the 4 stages of the Double Diamond method to solve a particular UX problem of choice.
Each stage across the Double Diamond method allowed me to explore certain tools to help the process of finding the most intuitive way to connect with our user.
Discover
Project scoping
User Research
1 on 1 Interviews
Guerilla Interviews
Define
Affinity Mapping
Empathy Mapping
Personas
User Journey Maps
How Might We?
Develop
Crazy 8's
Storyboarding
Minimal Viable Product
User Flow
Wireframes
Deliver
Lo-fi Prototype
Usability Testing
Prototype
Project Overview
TennisWorld manages the ultimate tennis facilities across Australia.
Players of all skill levels use these facilities, from amateur players to the world's very best. There are 7 facilities across Australia, but the one that I will be focusing on is Melbourne Park in Victoria. The home of the Australian Open.
My Contributions
Double Diamond
UX Research
Synthesis
Ideation
UX Architecture
UI Development
Wireframing
Prototyping
User Testing
TennisWorld - Melbourne Park

The Problem Statement

"Tennis players find it challenging and frustrating when booking a court at TennisWorld as the process is unclear and requires interaction with the front desk to confirm a booking."

Considering the user & the business

I wanted to consider not only the user but the business itself, so I conducted some 1 on 1 interviews as well as some guerrilla style interviews with some tennis players as well as some staff working at TennisWorld.
1 on 1 interviews:
In depth interviews:
2 frequent users, 1 infrequent
30 min duration
8 questions asked
Guerilla style interviews:
4 random players off court
2 staff who work behind the front desk
1 min duration
3 questions asked

Affinity Mapping

Affinity Mapping User Research data
Using that data, I was able to uncover common themes from the user such as: 

User behaviour - user’s preferred booking option
Motivators - what motivates people to play at TennisWorld
Pain points - having to call up the front desk to book or confirm a booking
Suggestions for improvements - having all court availability present

Empathy Mapping

Honing in on common themes found in the Affinity Mapping, I was able to define in more depth our audience.
What I learned was:
- Staff were feeling frustrated with the booking system due to the double handling
- Despite being frustrated with the online booking system, the user persevered with the process
- Some users would rather call and be on hold to make a booking as they had such little trust in the online booking process
Diving Deeper with an Empathy Map

Key Research Insight

Overall key research insights that were uncovered were:
User’s felt:
Despite frustrations with online booking, still preferred online
- Frustrated: with booking process, having to add an extra step
- Uninformed: only seeing one "available" court slot per time slot
- Distrust with the booking system: not sure what specific court they are booking at the time of booking
Staff mentioned:
- Members generally would book online
- New users would call up as the online booking system made them feel misled and felt confused

Personas

The personas created gave me the opportunity to put a face to the data and bring life to who we were building this app for.  

I created 2 personas, one for a frequent user and less frequent, to address a member’s experience as well as a “new users” experience, someone who may have to refamiliarise themselves with the process due to infrequent use.

Customer Journey Mapping

The Customer Journey Map, rounds off our persona, here we are able to see what our persona is thinking and feeling every stage of the booking process, helping us determine priorities and what our user values.

In this case we can see that our user is:
- Confused at the unclear booking process
- Adamant on booking a court as they are feeling inspired
- Had to call up TennisWorld to confirm information

How Might We?

The How Might We? Question is there to help spark idea creation. I didn't land on the right question the first go, but on the third attempt, after much consideration, "How might we off tennis players more control in the booking process?" opens up the possibilities for a range of different touch points/scenarios and elements to allow the user feel like they are in control during the booking process.

Ideation

Ideas were generated and processed through the Crazy 8's, Storyboarding method and then prioritised in the Minimal Viable Product graph.

We can start to see ideas that offer control to the user become a reality in terms of where they sit in the value chart for not only the user but the business. From this point on we have a clearer understanding of what is necessary to get the project off the ground.

Wireframes

I developed these wireframes as a foundation to inform and build trust with the user throughout their journey when booking a court.

Elements such as:
- distance/directions to the facility
- weather forecast within the app
- selecting time of day
- seeing a full map of facility
- court availability for prescribed timeslots
- success and error messaging
- confirmation screens

User Interface choices

When selecting colour for the app, I chose colours based off what you'd see and experience on the tennis court at a TennisWorld facility.
- The blue represents the court itself
- The white represents the white lines on the court
- The “yellow/green” represents the tennis ball on the court
selecting colour to effectively connect the user to the business
The icons & button choices were important to help bring life to the app, using visual representation of what court is available in relation to where the court is on the facility is the most challenging part. Being able to travel across the facility to find the court you want will be a feature that will be addressed in the next iteration.

Pairing suitable icons with the temperature to depict the weather widget within the app allows users to easily identify what weather conditions they will be facing on the day of play.

Using a tennis ball as the middle navigation button to prompt users to click to take you directly to book a court.
the use of icons and buttons to help the user navigate through the app

Usability testing with lo-fi prototype

Usability testing was conducted with 2 previous interviewees, as they were the most familiar with the process of booking courts at TennisWorld. Providing the subjects with with a lo-fi prototype enables the user to access the app for its core functionality without any bias from colours and images.

Key points the testers provided were:
Add in booking details to the payment page
Add directions button to the venue with the confirmation page
Look at additional list version of courts availability for users who prefer a list over a map

Prototype

Challenges faced & overcoming them
Guerilla testing - rejection: leaned into my extensive hospitality experience, persisted, changed my script/approach

Diving into solution mode before discovering: The ideas run wild and you want to go with you think is best because you feel like you are closest to the product, you think you are the expert. But it’s not just for you.

Pixel perfect designs: Step away and come back to it. There will be always chances to improve on initial designs

What did you think?

If you like what you see and want to work together, or just want to provide feedback...please get in touch!
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.