Zweirad Petersen bietet Werkstattleistungen für Fahrräder und Roller an und handelt auch damit. Aufgabenstellung für dieses Projekt war eine Website zu erstellen, die sich von den Mitbewerbern deutlich abhebt, die über die Tätigkeitsbereiche informiert und eine erweiterbare Möglichkeit zur Produktpräsentation bietet.

Das Webdesign der Startseite wurde mit einem vollflächigen Bilder-Slider umgesetzt. Abwechselnd werden hier mit Überblendungseffekt ein Bild für die Zielgruppe „Fahrrad“ und ein weiteres für die Zielgruppe „Motorroller“ angezeigt um visuell den Themenbereich der Website zu vermitteln. Ergänzt werden die Bilder durch kurze Beschreibungen der Tätigkeitsbereiche und Auflistungen der Hauptleistungen. Zusätzlich zur Hauptnavigation werden auf der Startseite unter dem Slider die neuesten vier Produkte mit einem Hinweis auf die Produktseite vorgestellt.

Zwei Unterseiten der Website stellen die Werkstatt und das Unternehmen aus Halstenbek vor. Auf beiden Seiten wurde der Bildschirm in der Desktop-Ansicht vertikal geteilt. Auf der einen Hälfte befinden sich die Inhalte mit Bildmaterial in verschiedenen Formaten und Ausrichtungen, auf der anderen Hälfte befindet sich ein groß dimensioniertes Foto. Diese Aufteilung wurde gewählt um die Textinhalte sehr aufgelockert darzustellen und um einen hohen Wiedererkennungswert bei der Unternehmensdarstellung zu erreichen.

Auf der Produktseite werden die Fahrzeuge mit Bild, den wichtigsten Eckdaten und Preisen in einzelnen Boxen angezeigt. Über eine zusätzliche Navigationsleiste sorgt dafür, dass Interessenten sich die Produkte nach Produktgruppe filtern lassen können, was die Übersicht bei größeren Produktmengen erleichtern soll. Zu jedem Produkt finden die Besucher auf einer Unterseite Detail-Informationen, wie beispielsweise die technischen Daten.

Produktvoschau im Onlineshop
Design der Produktansicht mit Detailbildern
Abschlepp-Rechner via jQuery und Google Maps API
Rahmen-Rechner als Service für den Onlineshop

Je nach Produkt können Interessenten über die Produkt-Detailseiten auf einen Leasing-Rechner (Fahrräder und E-Bikes) oder Finanzierungs-Rechner (Motorroller) zugreifen, der je nach Laufzeit die monatlichen Raten ausrechnet.

Eine weitere Berechnung-Routine ist auf der Unterseite für den Abschleppservice zu finden. Hier können Kunden durch Eingabe ihres Standorts (Straße und Ort) die Kosten für die Abschleppung ermitteln lassen. Die Routine ermittelt über eine Google-Maps-API im Hintergrund die Entfernung, gibt darauf hin den Preis an und zeigt dem Kunden seinen Standort zur Kontrolle auf einer kleinen Karte an. Im Anschluss kann der Service dann auch gleich online bestellt werden.

Die Kontaktseite ist angelehnt an das Webdesign der übrigen Unterseiten auch vertikal zweigeteilt. Hier wird die eine Hälfte des Bildschirms für eine Anfahrtskarte auf Basis von Google Maps API genutzt, damit die Kunden möglichst komfortabel zu dem Standort in Halstenbek gelangen. Die übrige Fläche beinhaltet die Kontaktdaten, die Öffnungszeiten, eine Anfahrtsbeschreibung und natürlich ein Kontaktformular.

Die Website des Mechanikers wurde für Suchmaschinen optimiert und mit Mikrodaten-Markup (Firmendaten, Kontaktdaten, Öffnungszeiten, Produkte) versehen, um die Darstellung in den Ergebnissen von Google aufzuwerten. Ergänzt wurde dies mit einem Google Business-Profil und Google Analytics zur Erfolgskontrolle.

Auszeichnung

Die Website von Zweirad Petersen wurde zur bei der Wahl der „Handwerkerseite des Jahres“ von MyHammer zur Handwerkerseite 2016 und Handwerkerseite 2017 in der Kategorie KFZ gewählt.

Handwerkerseite des Jahres - KFZHandwerkerseite des Jahres - KFZ

Die ergänzenden Seiten des Werbeflyers passen auch beim fertigen Druckerzeugnis perfekt zusammen:

Foto des Faltflyer - halb aufgeklappt
Innenseite des 6-tlg Werbeflyers

Autowerbung am Smart. Werbefolien wurden mit Direktdruck und Konturschnitt – die Folienbeschriftung ist an beiden Seiten identisch.

Autofolierung am Smart - rechte Seite
Konturgeschnittene Folien mit Digitaldruck

Das fertige Papier und dazugehörige Briefumschläge, frisch aus der Druckerei:

Druckerzeugnis - Briefpapier mit Firmenlogo
Druckerzeugnis - Briefumschlag mit Firmenlogo