Fitness classes booking system redesign

Local leisure centers have a booking system that’s hard to use, making people frustrated. Some customers end up dialing the support center hotline just to secure a spot and some even seek alternative fitness providers.

In this redesign, I’ll show how to make booking easy and hassle-free for everyone.

Process

  • UX research (user interviews, expert evaluation, usability testing)

  • Flowmaps and wireframes

  • Design concept

  • Visual design of all screens in Figma

Research findings

  • Complex booking process for regular users. Regular users encounter difficulties when attempting to book repeated fitness classes. The existing process involves multiple steps, leading to frustration and inefficiency.

  • Confusion regarding class categorization and navigation. Users don't understand how classes are categorised and how to find a class due to poor navigation.

  • Dependency on day-of-week knowledge. To find and book a fitness class, users must remember the exact day of the week it occurs. This reliance on specific days can be cumbersome and discourages seamless booking.

  • Separate booking system lacks essential information. The booking system operates as a separate website, lacking crucial features such as photos, detailed class descriptions, and direct links from the main website. Users are forced to search for the same class twice: once on the main website for information and again in the booking system for booking and payment.

  • Scattered account information hinders booking management. Users struggle to locate and modify their bookings because account-related information is scattered across different places.

Updated navigation on Home page

Adding navigation menu is a key improvement. It makes website structure visible and more intuitive for users.

Another improvement is adding links to users' recent classes.
Regular users now can make booking in 3 steps (compare it to 8 steps before).



Useful Class page

Updated Class page provides:

  • Full description and photos

  • Available classes for the next 2 weeks at the preffered location

  • Easy location switch

  • It's great destination for links from the blog posts and marketing emails.



Search page

Search page has different types of controls that have better UX than dropdown lists of the previous design.



Account and bookings pages

All user-related information available in one place. Users can find their previous bookings and book again or modify an existing booking.



Design concept

Composition with tiles. I’ve structured the layout using a grid of tiles, creating an organized and visually appealing arrangement.

Bright accents in a dark theme. To add vibrancy and draw attention, I’ve incorporated bright accents within an overall dark color scheme. These pops of color create visual interest and guide the user’s focus.

Typography contrast. For headings, I’ve chosen the Oswald font-face. Its bold and geometric style provides a contrast against the rest of the text, ensuring readability and hierarchy. Additionally, the IBM Plex Serif font-face is reserved for fitness class labels, allowing them to stand out prominently from other content.



Results

Enhanced user experience. The new design concept for the booking system prioritizes cleanliness and ease of use. Whether users are regular customers, occasional visitors, or complete novices, they will find the interface intuitive and straightforward.

Improved user satisfaction and efficiency. During usability testing, users expressed higher satisfaction levels with the new system. Additionally, they spent less time navigating through the booking process. Notably, the inclusion of filters and a category menu aligned with their mental models.

Anticipated business impact. As a result of these improvements, I would expect several positive business outcomes:

  • User growth. The user-friendly design will attract new users, expanding the customer base.

  • Increased engagement. With streamlined booking procedures, users are more likely to engage frequently with the platform.

  • Enhanced retention. A seamless experience encourages users to return, reducing churn rates.

  • Reduced support calls. Clear navigation, improved usability and new account page design should lead to fewer inquiries directed to the support centre hotline.

© 2024 Natalia Sergeeva