BayWa r.e.

Neues UX Design: wie ein nutzer­freundliches Navigations­konzept ensteht

Die Aufgabe:

Verständlicher, schneller, plakativer. Das wünschte sich BayWa r.e. aus München von einem neuen UX-Design für die neue Navigation ihres Photovoltaik-Großhandels­shops.

Unsere Umsetzung:

Wir konzipierten die Navigation aus Sicht der Nutzer. Wir legten Wert auf eine inhaltlich logische Navigationsstruktur, eine erwartungs­konforme Anordnung und eine visuell sinnvolle Gewichtung der Navigationsebenen.

Das Vorgehen:

PHASE #1

Analyse

Das Unternehmen und Geschäftsmodel verstehen. Anforderungen des Auftrag­gebers kennenlernen. Interviews mit Auftraggeber führen. Analysieren aktueller Navigation. Durchführung Konkurrenzbetrachtung. Richtung für weiteres Vorgehen festlegen.

PHASE #2

UX- und Designprozess

Verschiedene Ideen und Ansätze in iterativem Prozess entwickeln und eng mit Auftraggeber abstimmen. Ausarbeitung des favorisierten Ansatzes. Erstellung aller Designvorgaben für die Entwicklungsagentur. UX-Animation einplanen und definieren.

PHASE #3

Produktion & Begleitung

Erstellung Produktions­dokumentation mit Beschreibung des detailierten Verhaltens bei Klick, Hove, etc. Animation mit Hilfe von interaktiven Prototypen visualisieren. Abstimmung mit externer Entwicklungsagentur, Produktionsbegleitung und Qualitätssicherung.

Vorher: Als zentralen Knackpunkt im bisherigen Navigationskonzept fiel uns das Burgermenü in der Desktop-Ansicht auf. So muß der Nutzer das Menü aktiv aufklicken, um die Hauptnavigations­punkte zu sehen und einen Überblick über das Angebot zu bekommen.

Nachher: Im Header sind die Hauptmenüpunkte nun gut sichtbar platziert. Für einen schnellen Einstieg in das Shopangebot, ist das Produkt-Menü auf der Startseite direkt ausgeklappt.

Markenkonform: Bei der Design­umsetzung berücksichtigten wir die Corporate Design-Vorgaben des Konzerns, um so eine Wiedererkennung zu gewährleisten und die Markenwerte auch in der Navigation zu vermitteln.

Warum eine klare Navigation auch in Zeiten von Google wichtig ist:

Eine verständliche und übersichtliche Navigation bildet immer noch das Rückgrat jeder nutzerfreundlichen Webseite. Dies gilt auch in Zeiten, in denen SEO immer wichtiger wird und mehr und mehr Nutzer direkt per Google auf eine bestimmte Unterseite gelangen.

Hier ist die Aufgabe der Navigation, dem Nutzer zu zeigen, wo er sich gerade befindet, was es sonst noch gibt und wie er zu den anderen Inhalten hingelangt, die ihn interessieren könnten.

„Stell dir vor, du wachst mitten in deiner Website auf – woher weißt du, wo du dich gerade befindest?“

Jeff Gothelf

Dies gilt nicht nur für Corporate Sites, sondern um so mehr für kommerzielle Onlineshops. Eine schlecht designte und ineffiziente Navigation kann Kunden schnell frustrieren und dazu führen, dass der er auf die Seite eines Konkurrenten geht und einem so ein gutes Geschäft durch die Lappen geht.

Mobile First: Ein mobil-optimiertes Navigationskonzept sorgt für eine reibungslose Bedienbarkeit auch auf Smartphones.

Animierend: Fließende Übergänge, die das Öffnen und Schliessen von Layern verdeutlichen oder Mouseover-Animationen bei Interaktionselementen führen den Nutzer sicher durch den Navigationsflow.

Projektteam:

BayWa r.e.
Dominic Rheinwald · Head of Global Digital Marketing
Nalin Sudan · Head of E-Commerce

H2D2
Johannes Reinhart · UX/UI Designer
Markus Remscheid · Productowner

Technische Umsetzung
Projekt eins

Kunde

BayWa r.e.

Unsere Leistungen

UX & UI DesignE-Commerce DesignDesignsystemeResponsive Design

Launch

Januar 2022

Ergebnis

https://solar-distribution.baywa-re.de