Relaunch und Migration eines Shopware 5 Shops zu Shopware 6Tuning für Auto und Shop

Tuning für Auto und Shop

Reduziert, prägnant & auffallende Dynamik

Im Design bildet ein schlichter übersichtlicher Aufbau die Basis für eine den User leitende Website. Gepaart mit dynamischen Elementen wirkt die Webseite spannend und lädt den User dazu ein, spielerisch auf der Seite zu verweilen, da es viel durch Klicken zu erkunden gibt.

dbilas-shopware6-shop-002

Zielführende informative und verspielte Infoboxen

Da einige Produkte kombiniert werden können, kann es die Darstellung des Hauptproduktes im Rahmen geben, um dieses in den Vordergrund zu stellen und daneben sieht man die dazugehörigen anderen Produkte. Hier sieht man z. B. im Rahmen die Hauptkategorie Ansaugtrakte, welche aber immer in Kombination mit Doppelvergasern beziehungsweise Einzeldrosselklappenteilen zu gebrauchen sind. So sieht der Kunde optisch verdeutlicht – was schneller vom Gehirn aufzunehmen ist als Texte – welche Kategorien und Produkte miteinander kombinierbar sind. Bei Mouse Over auf die Punkte der Nebenkategorien gelangt der Kunde zur Produktübersicht dieser Artikel. Bei Mouseover auf den Tool-Tipp bzw. Punkt im Rahmen öffnet sich ein Overlay über den Freisteller und der Kunde erhält einige Infos über Besonderheiten des Produktes.

dbilas-shopware6-shop-informative-boxen

Kategorienseiten – neu gedacht

Die Kategorieseite beginnt untypischerweise mit Contentelementen, die die Produkte der Kategorie vorstellen und erklären, da es sich um erklärungsbedürftige Produkte handelt. Dennoch wird es innerhalb der Kategorieseite eine Darstellung einer Produktübersicht geben, inkl. Filterleiste zum Sortieren von Eigenschaften sowie einer Seitennavigation aller Kategorien für einen besseren Überblick. Diese Darstellung kann je nach Produkttyp variieren und entweder als Kachelansicht mit Produktboxen oder als Listenansicht ausgegeben werden.

So muss eine Produktdetailseite das Produkt präsentieren

Da Produktbilder meist als Fotografie anstelle von Freistellern dargestellt werden, werden diese mit den rechts daneben stehenden Infos in einem Farbbalken zu einem Element zusammengefasst. So hat der Kunde nicht den Eindruck einer optischen Trennung. Ähnlich wie bei dem Konfigurator hat der User hier die Möglichkeit, seine Marke und Modell einzugeben, um das passende Produkt zu erhalten und weitere Einstellungen vorzunehmen. Außerdem gibt es einen Verweis direkt über dem Warenkorb-Button auf passendes Zubehör, um dieses gleich mit in den Warenkorb zu legen und sich somit lästiges Hin- und Herklicken und Zusammensuchen zu ersparen.

174_07
174_04
174_05
174_3

Startseite eines Markenshops nach Maß

Die Startseite beginnt mit einem Video, welches sich in Zwei-Dritteln der Startseite abspielt. Ein konstruiertes Auto, was eine Assoziation mit dem Leistungsspektrum – nämlich das Aufbereiten von Fahrzeugen – von dbilas dynamics hervorruft, fährt ins Bild, stoppt einen Moment und fährt sehr schnell aus dem Bild heraus. Hier wird verdeutlicht, dass Kunden, nachdem sie die Leistungen von dbilas in Anspruch genommen haben, eine wesentliche Leistungssteigerung erfahren. Dies wird verdeutlicht, indem das Auto zuerst langsam ins Bild hinein und deutlich schneller heraus fährt. Daher wird das Video mit dem Konfigurator verknüpft, durch welchen der Kunde zu passenden Produkten für sein Fahrzeug gelangt.

Folgend hat der Besucher auch die Möglichkeit Produkte nach Baugruppe bzw. Kategorie zu wählen. Eine eigens entwickelte CMS-Erweiterung sorgt hier für automatische Darstellung der gewünschten Unterkategorien. Diese Erweiterung ist auf allen Folgeseiten einsetzbar und erzielt ohne große aufwendige Konfigurationsmöglichkeiten den gewünschten Effekt.

tooltips

Tooltips für mehr Detailtiefe

Mithilfe von Tooltips können Bilder oder Elemente mit Infos versehen werden. Angewandt kann dies so aussehen, dass z. B. sich im Fahrzeug an bestimmten Stellen befindende Elemente, die es im Shop zu kaufen gibt oder zu denen dbilas Leistungen anbietet, mit Punkten getaggt werden, die bei Mouse-Over eine Infobox öffnen. In dieser lassen sich Infos oder auch das passende Produkt integrieren. So bietet die Website zum einen den Lerneffekt für Kunden und gibt dem User gleichzeitig die benötigten Infos an die Hand.

Neben der Angabe von Detailinformationen können hier auch Produkte, Videos, Contentelemente oder einfache Links hinterlegt werden. Die Positionierung erfolgt in Prozent auf der X- und Y-Achse auf Basis der Bildbreite. So steht einer responsiven Darstellung nichts im Weg.

infoboxen-1-1536x989

Prägnante Infoboxen

Das in den Unternehmensfarben gehaltene Fahrzeug deutet dem Besucher an, dass hier die wichtigsten Keyfacts zum Produkt oder der vorhergehenden Information optisch aufbereitet dargestellt werden. Die Rahmen der Keyfacts finden sich in nahezu jeder Seite wieder. Seien es Auswahlcontainer, Buttons, Headlines oder eben einfach immer wiederkehrende Keyfacts.

Du suchst einen absolut individuellen Markenshop auf Basis von Shopware 6?

View