05/07Client project
All case studies

Casa Paraiso

Request-to-book site for a private residence in Uvita, with a calendar the owner controls

Visit live site(opens in a new tab)
Sector
Vacation rental
Location
Uvita, Costa Rica
Year
2026
Role
Design · Development · SEO
Home page of the Casa Paraiso website: the residence at dusk with its pool and terrace, the name in large serif type and the main menu.
01Context

The brief

Casa Paraiso is a private residence on the Pacific coast in Uvita, offered for private stays by referral. Its website has two jobs: show the house properly, and give each guest a clear way to ask for dates.

We designed and built it end to end. Nine design directions came first, and one became the site. Then came a booking-request flow with a live calendar, a private admin area for the owner and an editor for photos and text. The site credits the house itself to Vista Arquitectos.

026 features

What we built

01/06

A calendar that stays current

Visitors pick check-in and check-out on a month calendar. Past days cannot be chosen, and dates the owner has blocked are struck through. Each time the calendar opens, it asks the server for the latest blocked dates.

See fig. 01
02/06

Requests, not instant bookings

The form asks for a name, an email and dates. Each request reaches the owner’s admin first; then one email goes to the owner and one to the guest, with a reply promised within 24 to 48 hours. A request does not confirm a stay.

See fig. 02
03/06

Admin that updates the calendar

Behind a login, the owner sees every request, sets its status, adds notes and sends the guest the matching email with one button. Confirming a request blocks its dates on the public calendar, and undoing it frees them. Dates can also be blocked by hand.

04/06

A site the owner can edit

Photos on the home, residence and contact pages, the room galleries and the local-experience cards are edited in Sanity Studio. Alt text is required on page and gallery photos. If Sanity cannot be reached, each page falls back to built-in content.

See fig. 06
05/06

Photos that load light

One home-page photo is stored at 8192 pixels wide, yet modern browsers get resized AVIF copies. Scrolling the whole home page on a desktop screen loads 21 photos that add up to under 800 KB, and none is over 150 KB.

See fig. 05
06/06

Ready for Google and WhatsApp

Each page has its own title, description, canonical address and 1200 by 630 share image for WhatsApp previews. Structured data describes a vacation rental with four rooms, seven amenities and check-in times, and robots.txt tells crawlers to skip admin and API pages.

03Facts only

Results

from first commit to booking requests, admin, editor and domain
22 days
dates blocked on the public calendar when a request is confirmed
Auto
of photos loaded by the whole home page on desktop: 21, all AVIF
<800 KB
photos on the four live pages carry alt text
All
for each request: one to the owner, one to the guest
2 emails
048 images

Gallery

Request form next to a month calendar: a stay is selected in gold and appears in the dates field, while the name, email and message fields are empty.
01Picking two days on the calendar fills in the dates field.
Phone view of the availability calendar with a stay selected, and the first form field below it.
02The same calendar on a phone.
The entrance of Casa Paraiso at night, lit by path lights, with the Milky Way above the trees.
03The entrance at night, from the residence gallery.
Residence page: a full-width photo carousel showing the infinity pool at sunset, with a slide counter and previous and next buttons.
04The residence page opens with a six-photo carousel.
Phone view of the home page: the residence photo, the name Casa Paraiso, a short description and the menu button.
05The home page on a phone.
Bedroom gallery on the residence page: a wide balcony photo above two bedroom photos, one with a carved wood headboard.
06Each space has its own gallery: one wide photo, then pairs.
Phone view of the residence carousel: a bedroom balcony at sunset, slide 2 of 6, and previous and next buttons.
07The photo carousel on a phone.
Home page section “What defines the stay”: a night photo of the terrace and blue-lit pool beside the numbered headings Full Ocean Panorama and Infinity Pool & Jacuzzi.
08Numbered sections pair a large photo with a short text.
059 tools

Stack

  • Next.js
  • React
  • TypeScript
  • Tailwind CSS
  • Sanity
  • Resend
  • Framer Motion
  • GSAP
  • Vercel
06Keep going

What's next

marceloretana.comMarcelo's build storyThe decisions behind the project, in his own words.(opens in a new tab)

Have a project like this in mind?

Start a project
06/07Next caseGoEasy.ChatWhatsApp support software