Sport Class Booking Mobile App: A UI/UX Design Case Study
In this case study, we will explore the design thinking process behind the creation of a Sport Class Booking Mobile App. This app aims to simplify the process of booking sport classes at various locations and times, facilitating a seamless user experience.
Iceberg was approached by Yofitt, a fitness company based in Casablanca, to design an app that would allow users to book classes at over 30 partner gyms in the city. The challenge was to create an app that would address the pain points of gym-goers in Casablanca and provide them with a seamless and convenient booking experience
The process
To ensure that we met our client's objectives, Iceberg adopted a user-centered design approach. We followed a structured process that enabled us to understand the needs and pain points of our target users, ideate solutions, and prototype and test our designs. By prioritizing user experience, we were able to develop an app that is intuitive, visually appealing, and meets the requirements of both the client and end-users.
Empathize
Stakeholders interview
User interview
User personas
Define
Business Model Canvas
Pain points
User journey map
Brainstorming session
Ideate
User flow
Sketches
Feature ideas list
Prototype
Low-fidelity wireframes
High-fidelity mockups
Test
Clickable prototype
Usability testing
Empathize
To understand the pain points of gym-goers in Casablanca, Iceberg conducted extensive market research and user interviews. The goal was to gain a deep understanding of users' needs and empathize with their experiences.
Empathize
Question
What do you like most about using Yofitt?
Answers
Convenience and ability to book classes at multiple gyms.
Question
What do you like most about using Yofitt?
Answers
Convenience and ability to book classes at multiple gyms.
Question
What do you like most about using Yofitt?
Answers
Convenience and ability to book classes at multiple gyms.
Question
What do you like most about using Yofitt?
Answers
Convenience and ability to book classes at multiple gyms.
User Personas
Amin El Aroui
Gym-Goer Gold is committed to a healthy lifestyle, attending gym classes like strength training and cardio to challenge himself and improve his fitness.
Age
35 years
Gener
Male
Occupation
Business Man
Gener
Casablanca
Behaviors
Gym-Goer Gold is committed to a healthy lifestyle, attending gym classes like strength training and cardio to challenge himself and improve his fitness.
Thoughts
Gym-Goer Gold seeks a user-friendly app for convenient and efficient gym class bookings, allowing him to quickly find and book preferred classes hassle-free.
Feelings
Gym-Goer Gold seeks an app for seamless gym class bookings, helping him stay organized and motivated without disruptions.
Motivations
Motivated to improve fitness and track progress, Gym-Goer Gold seeks an app for challenges and goal achievement.
Amin El Aroui
Gym-Goer Gold is committed to a healthy lifestyle, attending gym classes like strength training and cardio to challenge himself and improve his fitness.
Age
35 years
Gener
Male
Occupation
Business Man
Gener
Casablanca
Behaviors
Gym-Goer Gold is committed to a healthy lifestyle, attending gym classes like strength training and cardio to challenge himself and improve his fitness.
Thoughts
Gym-Goer Gold seeks a user-friendly app for convenient and efficient gym class bookings, allowing him to quickly find and book preferred classes hassle-free.
Feelings
Gym-Goer Gold seeks an app for seamless gym class bookings, helping him stay organized and motivated without disruptions.
Motivations
Motivated to improve fitness and track progress, Gym-Goer Gold seeks an app for challenges and goal achievement.
Empathize
Define
We analyzed the gathered insights to pinpoint the problem areas and identify opportunities for improvement.
Pain Points
User Journey Map
Ideate
To generate ideas for the app's features and functionality, Iceberg brainstormed and collaborated with stakeholders and gym partners. Ideation was based on insights from the previous phases.
User Flow
Sketches
Feature Ideas List
Prototype
Iceberg created low- and high-fidelity prototypes of the app's user interface and experience to test and refine the design. Prototyping allowed for user feedback and improvements before moving on to development.
Medium-Fidelity Mockups
Design System
High-Fidelity Mockups
Based on the users' pain points, we have come up with the fetures listed below
Discover
The User Profile page contains of the following elements:
Card Layout: Use a clean and modern card layout with thumbnail images, tags, time, gyms, and classes for each item.
Grid View: Arrange items in a visually appealing grid view with dynamic tags displayed above thumbnail images.
Time-Based Filtering: Allow users to filter items based on time, using icons or labels.
Map View: Incorporate a map view with pins representing items based on location.
Schedule
The User Profile page contains of the following elements:
"Your Next Class" Box: Prominently display the user's next scheduled class.
Filter Options: Include filters for "All," "Pending," "Refused," and "Available" classes.
Scheduled Classes List: Display a clean list of scheduled classes, sorted based on the selected filter option.
Class Details: Allow users to click/tap for more details.
Time-Based Sorting: Optionally, include time-based sorting within each filter option.
User Profile
The User Profile page contains of the following elements:
Personal Info Card: Display user's personal information and subscription status.
Gym Partners: Highlight affiliated gyms or fitness centers.
Share the App: Encourage users to share the app.
Navigation: Include user-friendly menu or tabs for easy navigation.
Test
To gather feedback and improve the app's features and user experience, Iceberg conducted user testing and incorporated user feedback into the app's development. Testing was an essential part of the iterative design process.
Clickable Prototype
Conclusion
Through the design thinking process, we successfully developed a user-centric Yofitt Sport Class Booking Mobile App that simplifies the process of finding and booking classes, offers personalized recommendations, and enables users to track their progress and achievements. This case study highlights the importance of empathizing with users, defining clear problems, ideating creative solutions, prototyping iteratively, and testing rigorously to create an engaging and effective user experience.