Webdesign & Entwicklung

Ricardu's Barbershop

Website eines Barbershops (gegr. 2010), die das hochwertige Angebot über eine elegante Preistabelle mit 10 Leistungen, ein erfahrenes Team aus drei Barbieren, eine interaktive Fotogalerie, Kundenstimmen mit Fünf-Sterne-Bewertungen und eine Google-Maps-Anbindung für die einfache Standortsuche präsentiert.

Umgesetzt mit React 19, TypeScript und Framer Motion in einer anspruchsvollen monochromen Palette (Schwarz, Weiß, Zinktöne), mit der markanten Schrift Rumble Brave für ein eigenständiges Branding, scroll-gesteuerten Animationen und vollständig responsivem Mobile-First-Layout.

Abschlussdatum: Mai 2026
Live-Website besuchen
Projektdetails

Überblick

Branche

Körperpflege & Grooming

Leistungsumfang

Vollständige Gestaltung und Entwicklung der Website mit individuellem Branding, interaktiven Komponenten, Google-Maps-Anbindung und Firebase-Hosting

Zeitrahmen

3 Wochen vom Design bis zum Produktiv-Deployment

Die Ausgangslage

Herausforderung

Ricardu's Barbershop, ein etablierter Betrieb mit über 15 Jahren Erfahrung und mehr als 5.000 Kunden in Lissabon, fehlte ein moderner Online-Auftritt, der der hochwertigen Servicequalität entspricht. Gefragt war eine Website, die die Expertise des Teams zeigt, das umfangreiche Leistungsangebot mit transparenten Preisen kommuniziert und es neuen Kunden leicht macht, den Betrieb zu finden. Die Aufgabe bestand darin, ein anspruchsvolles digitales Erlebnis zu schaffen, das die Verbindung aus traditionellem Handwerk und zeitgemäßem Stil widerspiegelt und dabei für alle Geräte und Altersgruppen zugänglich bleibt.

Unser Ansatz

Lösung

Wir haben eine elegante einseitige Website entworfen und entwickelt, die die Stärken des Betriebs über gezielte Inhaltsbereiche in den Vordergrund stellt: einen ansprechenden Hero-Bereich mit sozialem Beweis (4,9 Sterne bei Google, über 5.000 Kunden), eine interaktive Teamvorstellung, die die Erfahrung jedes Barbiers hervorhebt, und eine umfassende Preistabelle mit allen 10 Leistungen im Detail. Framer Motion sorgt für flüssige Scroll-Animationen, die visuelles Interesse schaffen, ohne die Performance zu beeinträchtigen, während die Schrift Rumble Brave und die monochrome Farbpalette eine unverwechselbare, hochwertige Markenidentität etablieren. Die Google-Maps-Anbindung mit Ein-Klick-Routenführung nimmt Erstbesuchern jede Hürde, und das responsive Mobile-First-Design sorgt für ein ebenso ausgereiftes Erlebnis auf dem Smartphone — dort entdecken die meisten potenziellen Kunden den Betrieb.

Was enthalten ist

Wichtigste Funktionen

Vollständig responsives Design
Flüssige Scroll-Animationen
Individuelle Typografie & Branding
Interaktive Fotogalerie
Google-Maps-Integration
Leistungs- und Preistabelle
Vorstellung des Teams
Mobile-First-Design
Ergebnisse

Ergebnisse

95/100
Performance-Wert
Google-Lighthouse-Performance mit optimierten Assets
100/100
Mobile Responsivität
Einwandfreie mobile Kompatibilität auf allen Geräten
< 1.2s
First Contentful Paint
Schneller erster Seitenaufbau dank optimierter Schriften
98/100
SEO-Wert
Hervorragende SEO dank semantischem HTML und sauberen Meta-Tags
Technologie

Technologie-Stack

React 19
TypeScript 5.x
Vite 7.x
Tailwind CSS 3.x
Framer Motion 12.x
Lucide React
Firebase Hosting
Google Maps API
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.

Ricardu's Barbershop | Portfolio | low-key solutions