01
Focused content architecture
Casa Terracotta — Design Hotel organizes the primary message and supporting information into clear, scannable sections.
Food & Hospitality
Casa Terracotta — Design Hotel
Casa Terracotta is a fictional, premium design-hotel concept aimed at a boutique hospitality client. The site establishes a complete discovery and sample booking journey for a small coastal retreat on Portugal’s Alentejo coast.
Food and hospitality websitedininghotelrestaurant
Visit live website ↗design-hotel-psi.vercel.app
Project type
Food and hospitality website
Industry
Food & Hospitality
Experience
Responsive web experience
Availability
Live deployment
Project overview
Inside the Casa Terracotta — Design Hotel experience
Casa Terracotta is a fictional, premium design-hotel concept aimed at a boutique hospitality client. The site establishes a complete discovery and sample booking journey for a small coastal retreat on Portugal’s Alentejo coast. It has been designed for portfolio presentation and client discussion; names, room availability, rates, contact details and property information are illustrative only.
The visual direction is Terracotta Paper. It blends daylight architectural photography, tactile editorial layout, near-square forms and an earthy palette. The core tokens are FFF8F2 for the page field, F3E3D8 for material surfaces, DEB9A4 for strong surfaces, B45E43 for controlled accent ink and 352720 for text. Lora is used for display typography and Manrope for interface and body content.
The project uses React 19, TypeScript, Vite, Wouter and Framer Motion. It is a static frontend build.
Experience details
Key features and interaction highlights
02
Responsive presentation
Casa Terracotta — Design Hotel adapts the content hierarchy and interface across phone, tablet, and desktop layouts.
03
Purposeful visual system
Casa Terracotta — Design Hotel uses consistent typography, color, spacing, and imagery to create a recognizable experience.
04
Clear next actions
Casa Terracotta — Design Hotel keeps relevant calls to action visible without interrupting the visitor's discovery journey.
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.
ReactTypeScriptViteFramer MotionWouter
Project FAQ
Questions about Casa Terracotta — Design Hotel
What is Casa Terracotta — Design Hotel?
Casa Terracotta is a fictional, premium design-hotel concept aimed at a boutique hospitality client. The site establishes a complete discovery and sample booking journey for a small coastal retreat on Portugal’s Alentejo coast.
Who is the Casa Terracotta — Design Hotel website designed for?
Casa Terracotta is a fictional, premium design-hotel concept aimed at a boutique hospitality client. The site establishes a complete discovery and sample booking journey for a small coastal retreat on Portugal’s Alentejo coast.
What does the Casa Terracotta — Design Hotel experience include?
The documented experience includes focused content architecture, responsive presentation, purposeful visual system, clear next actions. The live website shows the complete interface and interaction flow.
Can I view Casa Terracotta — Design Hotel online?
Yes. Use the “Visit live website” link on this page to open the current public deployment.
