01
Focused content architecture
Skyline Supper Club organizes the primary message and supporting information into clear, scannable sections.
Food & Hospitality
Skyline Supper Club
Skyline Supper Club is a fictional, premium Miami rooftop pizza and cocktail bar built as a complete hospitality web experience. It helps guests discover the venue and menu, understand the setting, reserve a table, enquire about private events, find the rooftop, and contact the host team.
Food and hospitality websitecocktailpizzarestaurantrooftopsuppertea
Visit live website ↗skyline-supper-club.vercel.app
Project type
Food and hospitality website
Industry
Food & Hospitality
Experience
Responsive web experience
Availability
Live deployment
Project overview
Inside the Skyline Supper Club experience
Skyline Supper Club is a fictional, premium Miami rooftop pizza and cocktail bar built as a complete hospitality web experience. It helps guests discover the venue and menu, understand the setting, reserve a table, enquire about private events, find the rooftop, and contact the host team. Its proposition is simple: wood-fired pizza, precise cocktails, and the city’s changing light.
The website includes dedicated routes for Home, Menu, individual Menu Item Details, Story, Locations, Reservations, Events, Gallery, Contact, and a branded 404 state. It contains 24 menu items across share plates, pizza, cocktails, sweets, and zero-proof drinks, with USD pricing and dietary indicators.
The signature interaction is the Horizon Scene, an afternoon-to-golden-hour-to-blue-hour-to-night sequence. On desktop, GSAP ScrollTrigger pins the scene and choreographs the sky, sun, city lights, and foreground terrace at different depths. On tablet it is a readable non-pinned scene, and on mobile it becomes a compact manual time dial. Reduced-motion visitors receive an immediate, usable static scene.
Experience details
Key features and interaction highlights
02
Responsive presentation
Skyline Supper Club adapts the content hierarchy and interface across phone, tablet, and desktop layouts.
03
Purposeful visual system
Skyline Supper Club uses consistent typography, color, spacing, and imagery to create a recognizable experience.
04
Clear next actions
Skyline Supper Club 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.
ReactTypeScriptViteTailwind CSSGSAPWouterNode.js
Project FAQ
Questions about Skyline Supper Club
What is Skyline Supper Club?
Skyline Supper Club is a fictional, premium Miami rooftop pizza and cocktail bar built as a complete hospitality web experience. It helps guests discover the venue and menu, understand the setting, reserve a table, enquire about private events, find the rooftop, and contact the host team.
Who is the Skyline Supper Club website designed for?
Guests exploring the menu, venue, hospitality experience, and booking options.
What does the Skyline Supper Club 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 Skyline Supper Club online?
Yes. Use the “Visit live website” link on this page to open the current public deployment.
