Conception et développement web

Site web du restaurant Rio de Prata

Site web de restaurant monopage proposant une présentation interactive de la carte, une galerie photo filtrable de plus de 20 images réparties entre les catégories cuisine, lieu et vins, une section d'avis clients et une intégration Google Maps assortie des coordonnées.

Développé avec React 19 et TypeScript, il s'appuie sur des animations de défilement soignées signées Framer Motion, un système de couleurs sur mesure en HSL, une double typographie (Caliway en serif, Elms Sans) et un design responsive mobile-first.

Date de réalisation : mai 2026
Voir le site en ligne
Détails du projet

Vue d'ensemble

Secteur

Restauration

Périmètre

Landing page complète de restaurant, avec carte, galerie, avis clients et système de réservation

Durée

2 semaines, du design à la mise en ligne

La problématique

Le défi

Rio de Prata, restaurant portugais et méditerranéen moderne situé à côté des Jardins Braço de Prata à Lisbonne, avait besoin d'une présence web à la hauteur de son image raffinée et accueillante. L'enjeu était de créer un site qui mette en valeur sa cuisine, son atmosphère et son emplacement, tout en offrant des fonctionnalités essentielles comme la réservation et la consultation de la carte, dans un design élégant sans être prétentieux.

Notre approche

La solution

Nous avons développé une application React monopage à défilement fluide, rythmée par des animations Framer Motion sur mesure. Le design system repose sur une palette soigneusement composée de bruns profonds et de tons chaleureux, avec des jetons sémantiques en HSL pour garantir la cohérence. Nous avons mis en place une double typographie (Caliway en serif pour les titres, Elms Sans pour le corps de texte) afin d'allier élégance et lisibilité. La galerie interactive rassemble plus de 20 photos professionnelles réparties en catégories filtrables, et nous avons intégré un système de réservation tiers pour une prise de table sans friction. Chaque section a été conçue selon une approche mobile-first, pour un rendu impeccable sur tous les appareils.

Ce qui est inclus

Fonctionnalités clés

Design responsive
Galerie interactive
Animations fluides
Réservations en ligne
Google Maps
Avis clients
Mobile-first
Site de restaurant
Performance

Résultats

Custom HSL tokens
Design system
Une cohérence totale grâce à un système de couleurs sémantique
60fps animations
Performance
Des effets de défilement Framer Motion fluides sur tous les appareils
20+ images
Galerie
Galerie photo filtrable par catégories cuisine, lieu et vins
4 breakpoints
Mobile-first
Design responsive optimisé pour toutes les tailles d'écran
Technologie

Technologies utilisées

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

Prêt à lancer votre projet ?

Voyons ensemble comment créer un site remarquable, adapté aux besoins de votre entreprise.

Site web du restaurant Rio de Prata | Portfolio | low-key solutions