Boutique-villa booking site we built end-to-end on ourselves — a host using this stack would save an estimated $691–$845 per booking versus an 18-22% OTA commission.
OBJECTIVES
PROJECT TYPE
Website
Boutique-villa booking site we shipped end-to-end on ourselves before pointing the same recipe at client work.
15-MINUTE INTRO CALL
OVERVIEW
Boutique-villa booking site we shipped end-to-end on ourselves before pointing the same recipe at client work. Cinematic editorial layout, native Stripe Checkout direct to the host, host-editable content. Casa Brickell is a fictional brand — the build, the live URL, and the Lighthouse scores are real; the OTA-savings figures are modeled for a hypothetical host running the same stack. Live at /demo/luxe-stays.
THE PROBLEM
Boutique villa operators lose 18-22% of every reservation to OTA commissions, and the OTA owns the guest. Custom direct-booking sites typically run $25K+ over 6-10 weeks — the math doesn't work for a single property doing six bookings a month.
CONSTRAINTS
DELIVERABLES
Editorial single-property site: hero, suites, story, gallery, journal, location, FAQ, contact, press.
Booking widget — date pickers, guest count, suite selection, pricing breakdown, native Stripe Checkout.
Mobile-first sticky booking bar that opens the full widget in a modal sheet.
Host-editable content surface for rooms, rates, photos, and copy.
Cancellation, confirmation, and post-booking flow.
KEY DECISIONS
Editorial cinematic layout or Airbnb-style listing card?
Editorial cinematic. Magazine-cover photo, Playfair italic title, deed-line meta caps. The booking widget gets its own moment, not bolted onto the photograph.
Boutique guests pay $480+/night because the property is curated. Listing-card aesthetics signal 'commodity rental' — the wrong category for a $3,840-per-week stay. The site's job is to communicate why the rate is the rate.
Native booking flow or embed an OTA-style booking widget?
Native flow on Stripe Checkout. The reservation lands directly in the host's Stripe account.
Embedded widgets carry their own chrome, their own checkout step, their own URL — and they take a cut. Native Stripe means the host owns the funds the second the guest taps Reserve, with no platform-of-record between them.
Inline booking widget on mobile, or sticky bottom bar?
Sticky bottom bar that opens the full widget in a modal sheet. Booking is one tap from anywhere on the page.
On a 390-wide phone an inline widget would push the editorial photo down the page and break the magazine-cover beat. The sticky bar keeps the photography full-bleed and surfaces booking from the first scroll.
OUTCOMES
Founding-stage studio. The build, the live URL, and the measured scores below are real; the dollar and time figures are modeled for a host running the same stack, with the basis stated inline.
$691–$845
Modeled OTA savings · per booking
We estimate a host using this stack would save $691–$845 per reservation versus Airbnb's 18-22% take, modeled on a typical $3,840 Brickell-rate booking. After roughly five direct bookings the build pays for itself.
5 days
Kickoff to live URL
What the studio took to ship the demo end-to-end — editorial layout, native booking flow, and host CMS, all live in five business days.
99 / 100 / 100
Lighthouse · home page
Performance / Accessibility / Best Practices on the demo home page, measured on a throttled 4G connection.
<60s
Booking flow · target completion
Designed checkout time from hitting Reserve to a Stripe-confirmed booking. Single screen, no account creation, Apple Pay / Google Pay supported.
TIMELINE
Brand voice, suite inventory, photography brief, booking-flow spec, content map.
Editorial layout, booking flow, native Stripe Checkout, host content surface, mobile booking sheet.
Editorial photography (43 shots: six suites, gallery, story, journal, location), copy pass, FAQ + policies.
Performance pass, accessibility pass, mobile-sheet polish, live URL on Vercel.
Book a 15-minute call about your project.
