01
Home
Asymmetric arrival hero, availability utility, proof snapshot, experience planner, drawing-to-stay reveal, room selector, offer composer, gallery, host timeline, process explanation, FAQ and final conversion.
Food & Hospitality
Northlight House — Boutique City Hotel
Northlight House is a premium, front-end boutique city hotel concept for a fictional 24-room London property.
Food and hospitality websitedininghotelrestaurant
Visit live website ↗northlight-hotel.vercel.app
Project type
Food and hospitality website
Industry
Food & Hospitality
Experience
Responsive web experience
Availability
Live deployment
Project overview
Inside the Northlight House — Boutique City Hotel experience
Northlight House is a premium, front-end boutique city hotel concept for a fictional 24-room London property. The experience is designed around the Botanical Transit Atlas direction: a calm Ice Mint world, warm documentary hospitality imagery, crisp wayfinding rules, and an availability flow that behaves like a considerate planning desk rather than a generic checkout form.
The primary conversion is check availability / book a stay. The booking flow is intentionally a realistic demo: it preserves selected room, dates, guest count, optional house moments and guest details through review, validation, recoverable failure and success states. It does not create a reservation, collect payment or send email.
Home | Asymmetric arrival hero, availability utility, proof snapshot, experience planner, drawing-to-stay reveal, room selector, offer composer, gallery, host timeline, process explanation, FAQ and final conversion.
Experience details
Key features and interaction highlights
02
Stay
Room comparison with real demo sorting, room selection and contextual booking handoff.
03
Room detail
Contextual room hero, annotated room plan, specifications, FAQs, related rooms and booking handoff.
04
Dining
Service-period tabs with changing demo menu content and a restaurant request handoff.
05
Experiences
Selectable experience planner that persists selections into the booking request.
06
Offers
Offer selection that carries a specific request into booking notes.
Visual gallery
Desktop details and mobile experience
Three genuine captures from the live deployment show the opening view, an interior content section, and the responsive mobile composition.
Build characteristics
Technology and delivery signals
Labels come from project documentation where available; conservative delivery characteristics are used when a repository does not specify its stack.
ReactTypeScriptViteTailwind CSSFramer MotionWoutershadcn/uiRadix UI
Project FAQ
Questions about Northlight House — Boutique City Hotel
What is Northlight House — Boutique City Hotel?
Northlight House is a premium, front-end boutique city hotel concept for a fictional 24-room London property.
Who is the Northlight House — Boutique City Hotel website designed for?
Guests exploring the menu, venue, hospitality experience, and booking options.
What does the Northlight House — Boutique City Hotel experience include?
The documented experience includes home, stay, room detail, dining. The live website shows the complete interface and interaction flow.
Can I view Northlight House — Boutique City Hotel online?
Yes. Use the “Visit live website” link on this page to open the current public deployment.
