Webdesign & Entwicklung

Rio de Prata – Restaurant-Website

Einseitige Restaurant-Website mit interaktiver Speisekarte, filterbarer Fotogalerie mit über 20 Bildern in den Kategorien Speisen, Räumlichkeiten und Wein, Bereich für Kundenbewertungen sowie eingebundenem Google Maps mit Kontaktdaten.

Umgesetzt mit React 19 und TypeScript, mit ausgefeilten Framer-Motion-Scroll-Animationen, einem eigenen HSL-basierten Farbsystem, zweistufiger Typografie (Caliway Serif, Elms Sans) und responsivem Mobile-First-Design.

Abschlussdatum: Mai 2026
Live-Website besuchen
Projektdetails

Überblick

Branche

Gastronomie

Leistungsumfang

Vollständige Restaurant-Landingpage mit Speisekarte, Galerie, Bewertungen und Reservierungssystem

Zeitrahmen

2 Wochen vom Design bis zum Launch

Die Ausgangslage

Herausforderung

Rio de Prata, ein modernes portugiesisch-mediterranes Restaurant neben den Jardins Braço de Prata in Lissabon, brauchte einen anspruchsvollen Webauftritt, der zur feinen und zugleich einladenden Marke passt. Die Herausforderung bestand darin, eine Website zu schaffen, die Küche, Atmosphäre und Lage präsentiert und zugleich wesentliche Funktionen wie Reservierung und Speisekarte bietet — in einer Gestaltung, die elegant wirkt, ohne prätentiös zu sein.

Unser Ansatz

Lösung

Wir haben eine einseitige React-Anwendung mit flüssiger Scroll-Navigation und durchgängigen Framer-Motion-Animationen entwickelt. Das Designsystem beruht auf einer sorgfältig zusammengestellten Farbpalette aus satten Braun- und warmen Tönen mit HSL-basierten semantischen Tokens für Konsistenz. Eine zweistufige Typografie (Caliway Serif für Überschriften, Elms Sans für Fließtext) verbindet Eleganz mit guter Lesbarkeit. Die interaktive Galerie zeigt über 20 professionelle Fotos in filterbaren Kategorien, und wir haben ein Reservierungssystem eines Drittanbieters für eine reibungslose Buchung eingebunden. Jeder Bereich wurde nach dem Mobile-First-Prinzip gestaltet, um auf allen Endgeräten einwandfrei zu funktionieren.

Was enthalten ist

Wichtigste Funktionen

Responsives Design
Interaktive Galerie
Flüssige Animationen
Online-Reservierungen
Google Maps
Kundenbewertungen
Mobile First
Restaurant-Website
Ergebnisse

Ergebnisse

Custom HSL tokens
Designsystem
Durchgängig stimmig dank semantischem Farbsystem
60fps animations
Performance
Flüssige Framer-Motion-Scroll-Effekte auf allen Endgeräten
20+ images
Galerie
Filterbare Fotogalerie mit den Kategorien Speisen, Räumlichkeiten und Wein
4 breakpoints
Mobile First
Responsives Design, optimiert für alle Bildschirmgrößen
Technologie

Technologie-Stack

React 19
TypeScript
Vite
Tailwind CSS 4.x
Framer Motion
shadcn/ui
React Hook Form
Yup
React Leaflet
Firebase Hosting
Lucide React
Jetzt starten

Bereit, Ihr Projekt zu starten?

Sprechen wir darüber, wie wir eine beeindruckende Website schaffen, die genau zu Ihren geschäftlichen Anforderungen passt.

Rio de Prata – Restaurant-Website | Portfolio | low-key solutions