Woogi

Manson Pickleball

One court, one flat rate, no sign-up. A booking site where what looks open is genuinely open.

Most players book from their phone between games. The site shows live availability from the booking database, takes a name and a Philippine mobile number, and lets the owners confirm by phone.

Discipline
Interfaces and products
Client
Manson Pickleball
Year
2026
Role
Web design, Development
Tools
React, Vite, Tailwind CSS, Express, MongoDB
mansonpickleball.site

The real build of the site, running here with its booking server switched off. Scroll inside it, or press play.

One photo becomes the whole page

The hero opens on a full-screen photo of the court. As you scroll, the stage pins and the photo shrinks into one tile of a bento grid, while the welcome copy hands over to cards with the day's hours, the rate and the next open slot. Every frame only moves and fades the pieces, so it stays smooth on a phone.

Below the hero, each kind of block has its own entrance: tiles rise, the booking panels slide in from either side, the map zooms out of a slightly tighter crop, and gallery photos wipe open from the centre while the picture inside settles from a slight zoom. They all play backwards as you scroll away.

Homepage

Book first, sign up maybe

Accounts are optional and only offered after a booking. Availability refreshes every 15 seconds while a date is open, and a small chat assistant can answer questions but always asks before it changes anything.

Mobile, where most bookings happen
  • #FFFFFF Canvas
  • #14181F Ink
  • #2F6FE4 Court blue
  • #1A4BB0 Deep court
  • #37A34A Open green

Manrope, at a few weights. The colours of the court itself: blue for the surface and actions, green only for slots that are open.

Thought process

  1. 01

    Remove the friction

    Players book between games on their phones. No account, just a time, a name and a number.

  2. 02

    Show the truth

    Availability comes straight from the booking database and refreshes while you look, so what is open is open.

  3. 03

    Help without taking over

    A small assistant answers questions but always asks before it changes a booking.