Mobile First HABA B2C-Online-Shop-Design

HABA verbindet man vor allem mit zwei Stichworten: Spielspaß und Qualität. Das Traditionsunternehmen HABA aus Bad Rodach entwickelt seit 80 Jahren hochwertige Produkte für Kinder. Von Holz- und Textilspielwaren, Büchern bis hin zu Kinderzimmer-Möbeln, im Fokus stehen immer generationsübergreifende Freude und spielerisches Lernen.

Mintcreative wurde als E-Commerce-Agentur aus München beauftragt, das Mobile First Design des HABA B2C-Online-Shops zu gestalten.


Services

Workshop
Projektleitung Design
User Experience Design
Mobile First Online-Shop-Design
Styleguide
Animationskonzept 

Haba Kugelbahn
Haba Mobile

Mobile First Online Shop

Gemeinsam im Team gestalteten wir Mobile-First Online Shop Layouts für alle gängigen Seitentypen.

E-Commerce-Workshop

Zum Projektstart führten wir als E-Commerce-Agentur einen Workshop vor Ort in Bad Rodach mit dem Projekt-Team von HABA durch. Dafür machten wir uns mit den Markenwerten vertraut und analysierten den bestehenden Shop. Wir entwickelten Keyfindings als richtungsgebende Basis für das neue Online-Shop-Design.

Detaillierte User Journeys anhand vorgegebener Personas und eine Mitbewerber-Analyse rundeten die Vorarbeit für den E-Commerce-Workshop ab.

Haba Desktop Detailseite

UX-Konzept

Unser Online-Shop-Design hat zum einen das Ziel, Eltern an die Hand zu nehmen und durch klare Strukturen, praktische Filterfunktionen und zielgerichtete Themenseiten genau zu dem Produkt zu führen, welches das passende für ihr Kind im aktuellen Entwicklungsstadium ist. Wir stellten uns der Aufgabe die Nutzerführung zu optimieren und analysierten Sitemap und Inhalte, so dass wir wissen welche Inhalte redundant sind oder an einer anderen Stelle einen Mehrwert bieten würden. Es wurden verschiedene Konzepte für die Seiten entwickelt und vom Team geprüft.

Haba Desktop Detailseite Games & Books
Haba Obstgarten Kinderspiel
Haba Desktop Detailseite Building Blocks
Haba Desktop Detailseite Wooden Toys
Haba Vater und Kind
Haba mobile screens
Haba Desktop Startseite
Haba Desktop Detailseite World of Haba
Haba Designsystem

HABA B2C-Online-Shop-Design

Für das Lead Design des zukünftigen Online-Shops gestalteten wir Startseite sowie die Produkt-Detailseite neu. Ausgewählte Produkte erhalten eine vorgeschaltete Explore-Seite, bei der das Kennenlernen des Produkts mit allen Facetten im Vordergrund steht.

Weiterhin entstanden diverse Templates für alle Kernbereiche des Online Shops: angefangen bei den Kategorieseiten bis hin zu unterschiedlichen Inhaltsmodulen für variable Landingpages. Auch der Kundenkonto-Bereich, Warenkorb und Checkout-Prozess wurden von uns optimiert.

Für einen konsistenten, neuen Look wählten wir eine neue Webfont sowie eine Icons-Sammlung, welche die Werte des Unternehmens perfekt widerspiegeln.

Als Übergabe an die Umsetzungsagentur erstellten wir ein Design System mit allen wichtigen Komponenten: Farben, Headlines, Menü- und Linkzustände usw. Ergänzend definierten wir ein Animationskonzept für Buttons, Module und bestimmte Bewegungen im Online-Shop.

Haba mobile Doll Matze