Booking widget & flow
Dates and guests from the hero, then a price calendar, room and rate selection, extras and confirmation.
Hospitality
MYFRIX ConceptMarivento — Boutique Cliff Hotel
A direct-booking website for a 24-room boutique hotel on the Amalfi Coast.
- Category
- Hospitality
- Project type
- MYFRIX Concept
- Technology
- React, Vercel
- Live site
- marivento.vercel.app ↗
The brief
What the project needed to solve.
Concept brief: small luxury hotels lose margin to booking platforms. Marivento needed a website that sells the place as beautifully as a magazine, answers guests' questions instantly and makes booking direct easier than going anywhere else.
Our approach
How we approached it.
- Strategy
- Put booking everywhere it's useful — in the hero, on every room page, in a sticky mobile bar — and give guests clear reasons to book direct.
- UX
- A five-step booking flow (Dates, Room, Extras, Details, Confirm) with prices visible on the calendar and a running stay summary.
- Design
- Warm Mediterranean palette, an editorial serif and full-bleed photography that lets the cliff, the sea and the rooms do the selling.
- Development
- Multi-page build with room, dining, spa, experiences, offers and story pages, a booking engine front-end and a concierge chat assistant.
What we built
The pieces that make it work.
Rooms & suites
Six room types with a carousel, comparison page and detail pages showing size, beds, amenities and rates.
Concierge chat
An always-available assistant answering questions about rooms, dining, the spa and getting there.
Hotel content
Dining, spa, experiences, offers, story, FAQ and policies — everything a guest checks before booking.
Inside the build
What we designed — and why it works.
A walk through the key sections of Marivento — Boutique Cliff Hotel, and the decisions behind each one.
01Hero
Booking starts on the first screen
The homepage opens on the villa's terraces above the sea, with a booking widget built straight into the hero — arrival, departure, adults, children, Check availability. On mobile a sticky bar keeps “Rooms from €420 · Check availability” in reach on every scroll.
- Booking widget in the hero
- Sticky price-and-book bar on mobile
- Full-bleed destination photography
02Rooms
Six rooms, easy to compare
A swipeable carousel shows every room with its starting price, size, bed type and capacity. Each card leads to a detail page, and a comparison page lines all six up side by side.
- Price badge on every room
- Carousel with arrow controls
- Size, bed and capacity at a glance
03Room page
Room pages that answer every question
Each room page pairs an evocative description with clear highlights and amenities, while a pinned rate card shows the direct price, high-season price, flexible and non-refundable options, and a Check availability button.
- Pinned rate card with two rate types
- Highlights and in-room amenities
- Cancellation terms stated up front
04Booking flow
A price calendar that sells the dates
Step one of a five-step booking flow shows two months side by side with the lowest nightly price under every date, closed and sold-out days clearly marked, and a stay summary that updates as guests choose.
- Five clear steps: Dates, Room, Extras, Details, Confirm
- Nightly price on every date
- Live stay summary panel
05Rates
Flexible or non-refundable, side by side
Once dates are set, every available room shows both rates with the total for the stay and the average per night, all fees included — so guests compare real prices instead of guessing.
- Two rates per room with totals
- All fees included in the price
- Change dates without starting over
06Dining & spa
Selling the stay, not just the room
Dining, spa, experiences and offers each get a cinematic page hero and editorial sections with opening hours and prices — the details that turn a browser into a guest — and each page ends with the booking widget again.
- Dedicated dining, spa and experiences pages
- Practical details: hours and prices
- Booking widget at the end of every page
07Concierge
A concierge that's always on duty
An “Ask the concierge” button floats on every page and opens a chat assistant with suggested questions about getting there, breakfast, family rooms and cancellations — answering guests at any hour.
- Floating concierge button site-wide
- Suggested questions to start the chat
- Works the same on mobile
Technology
Built with
- React
- Vercel
Outcome
What was delivered
A complete boutique-hotel website with a direct-booking flow, rooms, dining, spa, experiences, offers and a concierge chat — designed and built by MYFRIX as a concept project and live today.
Next project
Solvane — Niche Perfume Store
View project
Have a digital project in mind?
Tell us what you're building. We'll help you turn the idea into a launch-ready digital product.