Das Barrique ist ein besonderes Hotel, denn die Gäste übernachten in echten Weinfässern. Passend zu dem originellen Schlafplatz haben Gäste die Möglichkeit, eine Weinverkostung im Hotelrestaurant zu genießen, sich beim Wellness zu entspannen oder ihre Zeit mit gemeinsamen Erlebnissen im nahe gelegenen Naturpark zu verbringen. Das folgende Projekt zeigt die Website für das Wohlfühlhotel und ist ganz in diesem Sinne als Webdesign zum Wohlfühlen gestaltet.
Der Webauftritt ist responsive gestaltet, passt sich also an das Endgerät des Users an. Hier ein Beispiel für die Nutzung via Smartphone:
Das Wohlfühldesign
Das Logodesign des Barrique Hotels kombiniert die reduzierte Form der Frontansicht eines Weinfasses mit einem modernen Font und einem handschriftlich anmutenden Font mit individuellem Charakter. Die ruhige Farbgebung rundet das Gesamtbild ab.
Eine Palette von Natur- und Pastelltönen begleitet die Firmenfarbe ‚Weinrot‘ im romantischen Design des Fasshotels. Auch die Bilder wirken hell und natürlich. Hinzu kommen geschwungene Illustrationen im Look der Logoschrift Amalfi Coast. Für eine optimale Lesbarkeit der Website wurden für die Fließtexte und Buttons serifenlose Schriften gewählt. Um dennoch den romantischen Charakter des Designs zu erhalten, sind die Überschriften in einer edlen Caslon gesetzt.
Der Webauftritt
Der Webauftritt ist für das Fasshotel von zentraler Bedeutung, da die Gewinnmarge bei Buchungen über die eigene Seite am höchsten ist. Dazu müssen die Inhalte und Gestaltung die Zielgruppe ansprechen, außerdem müssen alle wichtigen Informationen schnell auffindbar und übersichtlich dargestellt werden und das über alle Endgeräte hinweg.
Daher startete die Umsetzung des Webauftritts mit einer Sitemap, auf der alle Seiten übersichtlich zusammengefasst wurden. Im nächsten Schritt entwickelten wir auf dieser Grundlage Wireframes, testen diese und gestalteten die Website schließlich aus. Mit Micro-Interactions wie eine Logo-Animation auf der Startseite, Hover-Effekte bei den Buttons und mehr gaben wir der Website den letzten Schliff und verbesserten die Nutzerfreundlichkeit.
Der Usecase
Die folgende Übersicht zeigt den Usecase der fiktive Nutzerin Johanna, die auf der Website des Barrique einen Kurzurlaub als Überraschung für ihren Mann Christian bucht. Das Wochenende im Fasshotel soll etwas Besonderes werden und die Möglichkeit bieten, sich zu entspannen und abzuschalten. Eine Freundin von ihr hat vor kurzem Urlaub in einem Fasshotel gemacht und Johanna begeistert davon berichtet.
Auf der Startseite wird Johanna mit der Vorschau verschiedener Angebote abgeholt. Das romantische Design der Seite spricht sie direkt an. Sie scrollt weiter und klickt auf „Unsere Fässer“, hier schaut sie sich die verschiedenen Fässer an. Das Weinhotel mit Erlebnischarakter sagt ihr zu, sie möchte sich näher über die Angebote des Fasshotels informieren. Beim Angebot „Fass-Romantik für Zwei“ und wird sie neugierig und klickt es an.
Sie scrollt weiter nach unten und erhält eine Übersicht der inkludierten Leistungen. Johanna entscheidet sich für das Angebot. Als sie von dort aus zur Buchungsseite geht ist das Angebot „Fass-Romantik für Zwei“ bereits vorausgewählt. Am linken Rand der Buchungsseite sieht Johanna jederzeit in welchem Schritt des Buchungsprozesses sie sich gerade befindet. Mit jedem Klick auf den Button „Weiter“ wird automatisch zum nächsten Schritt gescrollt. Hier können die Anzahl der Gäste und Fässer sowie die Art des Fasses gewählt werden. Sie wählt das preiswerte Basic-Fass aus.
Im nächsten Schritt gelangt sie zum Buchungskalender und wählt das gewünschte Reisedatum aus. Farbig markierte Kalendertage heben ihre Auswahl hervor. Danach wird die „Verfügbarkeit geprüft“ – das Angebot ist im gewünschten Zeitraum verfügbar. Im nächsten Schritt kann sie noch zusätzliche Aktivitäten und Wellnessangebote hinzufügen. Sie entscheidet sich für die Extras „Radtour“ und „Weinprobe“ und klickt auf „Weiter“.
Die Leiste am linken Rand gibt ihr die Information, dass sie nun beim letzten Schritt angelangt ist. Sie erhält eine Übersicht ihrer Auswahl und überprüft ihre Angabe und schließt den Buchungsvorgang zufrieden ab.
Dies ist ein gemeinsames Projekt mit Lea Hirsch und Verena Lutz im Rahmen eines Hochschulprojekts an der DHBW Ravensburg dabei lag mein Schwerpunkt auf der strategischen Entwicklung der Sitemap und Wireframes.
