From sketches to pixel perfect frames. Scroll to view the journey or tap the button below.

View figma prototype
View figma prototype

The problem ❗️

This fictional case explores the challenge users face when trying to book a time and court to play padel in their free time. The current booking process is unnecessarily complicated, making it difficult for users to quickly find and reserve available courts.

The Goal ⭐️

The goal of the project is to simplify the booking experience by reducing the number of steps required to reserve a padel court, making the process quicker and more intuitive for users.

User research

By synthesizing data from user interviews with three active padel players and a detailed competitive analysis of 3 major platforms, I identified three distinct areas where the current booking experience fails to meet user expectations.

Pain point 1

Complicated booking process

Users have to go through multiple steps and pages before completing a booking, which makes the process slow and frustrating.

Proposed solution

Simplified Booking Flow: Reduce friction by consolidating court selection, payment, and confirmation into three intuitive steps, all accessible within a more linear flow.

Pain point 2

Redirected to external platforms

Many padel websites redirect users to external booking systems. This breaks the experience and forces users to switch between platforms.

Proposed solution

Seamless In App Booking: Introduce an integrated booking engine to eliminate external redirects, providing a consistent, trusted, and unified brand experience.

Pain point 3

Lack of clear information

Important information such as available times, prices, and court types is often difficult to find quickly.

Proposed solution

Seamless In App Booking: Introduce an integrated booking engine to eliminate external redirects, providing a consistent, trusted, and unified brand experience.

About

Lucas, 36, works in an office and plays padel several times a week. He wants a fast, simple way to see court availability and book before times fill. He values convenience, clear info, and a smooth booking process so he spends more time playing and less planning.

Lucas Andersson 36 yo, Developer

Frustrations

  • Booking systems with too many steps that make the process slow

  • Being redirected to external booking platforms instead of booking directly

  • Difficulty quickly finding available times and prices

  • Risk of losing a time slot while navigating through the booking process

Goals

  • Quickly find available padel courts and times

  • Book a court with as few steps as possible

  • Easily coordinate games with friends

  • See clear information about prices and availability before booking

  • Receive a simple confirmation and reminder for the booking

User journey

Starting the design

LoFi wirwframe

This early LoFi prototype was created to explore ideas and empathize with the user problem. The flow is intentionally short, as other parts of the design had not yet been developed. The purpose was to illustrate a simplified booking process where the user can complete a booking in just three steps.

Early hi-fi wireframe

Usability test findings

  • User flow

  • Design system

  • Final design

Iteration

Design system

User flow

Final Version: breakdown

Login & Sign Up

User Driven Improvement: Added based on test results showing a high demand for account based bookings.

  • Reduced Repetition: Enables returning users to bypass manual data entry, significantly speeding up the flow.

  • Seamless Access: Introduced clear toggles between Login/Sign-up and added Social Auth options.

  • UX Strategy: Minimizes friction by prioritizing convenience for frequent players.

Landing Page: Evolution & Search

  • Static to Dynamic: Replaced the previous hi-fi prototype’s fixed view with a scrollable list to showcase multiple facilities.

  • Efficient Navigation: Added a search function to help users instantly find specific courts or locations.

  • Optimized Overview: Introduced information-rich cards featuring images, location, and pricing for faster decision-making

  • UX Strategy: Improved visual hierarchy and clear CTAs to reduce friction and increase conversion.

Facility Detail View: Clarity & Speed

Challenge: Added ratings, location, and facility info to eliminate uncertainty about what is included.

  • Enhanced Overview: Clear breakdown of court types and amenities to help users make informed decisions.

  • Quick Book Feature: Introduced "Next Available" time slots for instant booking without browsing the full calendar.

  • UX Strategy: Reduces cognitive load at the start of the journey and creates a much faster path to checkout.

Booking Setup: Iteration & Usability

  • Reduced Visual Noise: Consolidated form fields into a single, clean card to create a more organized and focused view.

  • Intuitive Interactions: Introduced dropdowns and plus/minus steppers to simplify selections and minimize input errors.

  • Visual Guidance: Used clear icons and a progress indicator to help users scan the page and track their booking status.

  • UX Strategy: Improved hierarchy with a dominant primary CTA for forward momentum and a clear "Cancel" option for user control.

Professionalism & Trust

Goal: Create a credible, professional form that reduces cognitive load and guides the user accurately.

  • Visual Progression: Added a top-level progress indicator to provide users with a sense of control and security.

  • Optimized Labeling: Moved field labels outside the inputs for constant visibility, paired with informative micro-copy.

  • Visual Feedback: Introduced color-coded states (e.g., green for correct, blue for active) to provide instant confirmation.

  • Clear Hierarchy: Used full-width fields and high-contrast buttons (Next/Cancel) to make the natural next step obvious.

Payment: Transparency & Trust

Challenge: Users felt uncertain before paying and requested a clear summary to verify details like date, time, and total cost.

  • Order Transparency: Added a consolidated summary module to prevent booking errors and reduce support needs.

  • Clear Payment Options: Introduced selectable tiles with recognizable logos and active states for a secure, easy-to-scan experience.

  • UX Strategy: Provides a final "double-check" phase to build user confidence before the final transaction.

Confirmation and undo

The Goal: Provide an immediate "undo" path on the confirmation screen to increase user autonomy and eliminate the need to search through menus or emails to fix a mistake.

  • Immediate Control: Directly addresses user expectations by placing the "Cancel" option where they first look for it.

  • Reduced Friction: Saves time by removing the extra steps of navigating to "My Bookings" to fix a mistake.

  • Safety Net: Acts as an instant "Undo" button, reducing post-purchase anxiety if the user spots a date/time error.

Booking Management: Control & ClarityChallenge:

User testing revealed a strong need for users to manage or cancel reservations directly after receiving their confirmation.

  • Direct Access: Added a prominent "Cancel" button to booking cards under "My Bookings" to eliminate unnecessary steps.

  • Clear Hierarchy: Separated "Upcoming" and "Past" reservations into tabs to provide an instant overview of active bookings.

  • Visual Polish: Improved clarity with facility imagery, bold time/location details, and a unified style that guides the eye to key actions.

Outcome

The result is a more inclusive Padel booking experience that uses gamification and social features to drive long-term player motivation. By streamlining the booking flow and introducing "match-finding" social groups, the redesign successfully meets diverse player needs while increasing court occupancy and user engagement.

What I Learned

I learned how to balance the fast-paced nature of a booking system with behavioral psychology. This project proved that reducing "friction" in the checkout flow and adding social "nudges" can significantly lower the barrier for new players to get on the court.

Future Development

  • Design System Refinement: Fine-tuning the UI library to ensure consistent components and faster scalability for new features.

  • Activity Feature Expansion: Developing a dedicated "Activity" hub to help users track their match history, join tournaments , and community rankings.

  • Accessibility Optimization: Focusing on deeper WCAG compliance to ensure the booking and social interfaces are fully accessible to all users.