Industry Icon
Industry
Sport, SaaS, B2B, B2C
Skills Applied Icon
Skills Applied
Branding,
User Research,
UX/UI design, Responsive Design, Interface Design
Design Type Icon
Design Type
Web App, Mobile App
Illustration of a scheduling functionality of the web application.

Challenge

The primary challenge was to redesign the existing platform with a strong focus on improving the booking flow and scheduling options, as well as updating the overall style to make it consistent with modern software design. The original design had a solid foundation but lacked attention to UX and UI, which lowered the efficiency and satisfaction of its users, including gym owners, trainers, and clients. The goal was to create a more intuitive and seamless booking and scheduling process that caters to the operational needs of sports clubs and enhances overall user engagement.

Challenge Icon

Redesign the existing platform with a strong focus on updating the overall style to align with modern software design.

Challenge Icon

Ensure the platform meets the needs of various user groups, including gym owners, trainers, clients.

Challenge Icon

Create a more intuitive and seamless booking and scheduling process that enhances overall user experience.

Laptop, surrounded by the sport equipment and illustration of a part of the application functionality.
User friendly calendar design, a part of a booking flow. Checkout step of a booking flow.

Booking and Reservation System Design

We created a minimalist design with a lot of white space in the main interface, helping users focus on their primary tasks without distractions. The color palette was predefined by the current company branding. Intuitive navigation, user-friendly elements, and visual cues enhance the overall user experience.

Collage of the main screens of the booking flow.

Step 1 - Choose the trainer

One of the most important user interaction with the software is scheduling their appointments, so our goal was to make it as simple as efficient. The process is broken down into 4 simple steps that require user a couple clicks to proceed to the next one.

The first step of a booking flow - selecting a coach.

Step 2 - Choose the class

No matter how far you proceeded through these steps, on the right bar will always keep you informed on already made decisions.

The second step of a booking flow - selecting a type of class.

Step 3 - Select a date and a start time

Classic calendar functionality with possibility to switch between shifts.

The third step of a booking flow - selecting a day and a time slot.

Step 4 - Select the payment type

When booking a one-time class, the system will notify the user about any current classes or packages.

The fourth step of a booking flow - selecting a coach.

Step 5 - Forgot anything?

Generally, the mandatory flow consists of four steps. However, for marketing purposes, the service allows business owners to sell some equipment or essential goods. If you are not interested, you can proceed to checkout. However, if any of the goods capture your interest, you can click to learn more and take a closer look.

The fifth step of a booking flow - offers to obtain a company merch.

Step 6 - Finish the process

Sure, when booking a service, you need to pay for it. The platform allows you to store credit card information securely and add new payment methods if the stored ones are not suitable.

The sixth step of a booking flow - selecting a payment method.

Almost there

At checkout, the user has a chance to review all the booking and purchase information one last time before finally confirming.

The last step - confirmation.

Thank you!

A simple confirmation with a couple of action buttons allows you to either book another appointment or go to your calendar to review everything planned in advance.

A thank you pop up that appears after you finish the booking process.

Calendar

There are people who schedule their visits months in advance or attend more than one sports club, and Fitli software lets users keep all their records in one place. After you schedule a class, you can jump to the calendar page to check all your bookings. The simple calendar design allows users to switch the display type between day, week, and month views. Additionally, the filtering option provides the most accessibility and variety in how they want to review this information.

Week calendar view, where you can review all your bookings.
Collage of different calendar views - day and month. Althernative calendar view - a list view.

Branding

After the main functionality of the app was redesigned, we received a request to update the overall branding and logo. The concept behind the logo is quite simple: the stripes, which now represent the letter 'F,' also resemble booked time slots.

The company logo.
UI web typography.

Thinking of Boosting Your Brand or Product?

Let’s have a Chat

Smiley Image