Der Wechsel zu einer neuen Plattform kann für ein Unternehmen sehr aufregend sein. HelloTV war mit seinem Webshop auf der CMS-Plattform osCommerce aufgewachsen, doch die Grenzen des Systems kamen zum Vorschein — oft waren sie bereits an die Grenzen gerückt. Um in die Zukunft vorzudringen, war der Umstieg auf Magento der logischste Schritt. Aber wie macht man das sorgfältig, wahrt dabei die Identität und nutzt die Möglichkeiten, die eine solche Migration bietet, maximal aus? Darum geht es in diesem Fall.
HelloTV ist seit 50 Jahren auf dem Gebiet der audiovisuellen Elektronik spezialisiert, darunter die letzten 13 Jahre mit einem Webshop. Das Unternehmen verfügt außerdem über 11 Ladengeschäfte und wunderschöne Ausstellungsräume, in denen Erfahrung, Fachwissen und persönlicher Kontakt die Stimmung bestimmen. Die Organisation glaubt fest an die Kombination von Online und Offline. Viele Kunden orientieren sich im Webshop, wo in vielen Fällen bereits eine persönliche Grenze gezogen wird. Die endgültige Entscheidung wird oft in Geschäften getroffen: Sie möchten zuerst Fernseher sehen, Sie müssen diese dicke Soundbar-Pumpe live gehört haben. HelloTV kennt die Vor- und Nachteile seines Marktes wie kaum ein anderer und gehört zu den Top 3 in den Niederlanden.
Vor dreizehn Jahren startete HelloTV seinen Webshop. Der Shop wurde in osCommerce gebaut und HelloTV ist die Art von Einzelhändler, die sich nicht zurücklehnen. Mit anhaltendem Ehrgeiz und einem großartigen Sinn für Marketing haben wir kontinuierlich Optimierungen und Ergänzungen vorgenommen. Selten wurden die Möglichkeiten von osCommerce besser genutzt als bei HelloTV, aber auch osCommerce hat seine Grenzen und die Erkenntnis, dass die Situation nicht zukunftssicher war, begann sich immer mehr abzuzeichnen.
Um den neuen Shop zu bauen, kommt HelloTV zum renommierten Magento-Builder Emico. Mit der primären Design- und CX-Herausforderung landet das Management bei Yellowgrape. In diesem Prozess entschied sich HelloTV bewusst für zwei spezialisierte Agenturen. Die jahrelange Zusammenarbeit zwischen Yellowgrape und Emico war in dieser Hinsicht sehr wichtig.
Ein Umstieg auf Magento liegt auf der Hand, aber die Frage ist auch spannend. HelloTV hat ein Online-Imperium mit einer einzigartigen Identität und viel Traffic aufgebaut. Nicht einfach etwas zum Herumspielen - auch als Kind wurde der Laden mit Liebe erzogen. Die Vorsicht ist berechtigt: Innovation muss immer innerhalb der Grenzen von Geschichte und Identität stattfinden.
Die Migration zu Magento wird nicht kopiert. Es ist eine hervorragende Gelegenheit, sich sowohl das funktionale Layout als auch das Design des Shops anzusehen. Magento ist auch eine Plattform mit weitaus mehr Optionen als osCommerce.
Tatsächlich werden Sie mit endlosen Auswahlmöglichkeiten und Schaltflächen arbeiten. Sie sollten das nicht mit einer guten Note angehen wollen, was manchmal passiert. Yellowgrape befindet sich genau am anderen Ende des Spektrums: Wir greifen grundsätzlich auf einen systematischen Ansatz zurück, bei dem Daten und Testprotokolle so weit wie möglich die Hauptrolle spielen. Dinge bekommen nur dann ihren Platz, wenn wir sicherstellen können, dass sie so viel wie möglich zur Leistung des Ladens beitragen.
Zusammen mit HelloTV entscheiden wir uns für eine sehr kontrollierte und geplante Phase:
1. Das Drahtmodell manipulieren
2. Entwurf
3. Mit Split-Tests live gehen
Im Folgenden beschreiben wir die drei Phasen und heben eine Reihe wichtiger neuer Funktionen hervor. Für einen effizienten Prozess und neue Funktionen ist es wichtig, dass Design und Technologie nahtlos ineinander greifen. Während des Prozesses haben die Entwickler von Emico und die Yellowgrape-Designer daher kontinuierlich die Zusammenarbeit gesucht.
„Design Thinking ist der Treibstoff, den Ihr Redesign braucht, um von gut zu großartig zu werden. Es ist die geheime Zutat, die Ihre Designs verändern kann.“
Phase 1: Wireframe
In dieser Phase gestalten wir den neuen Shop auf rein funktionaler Ebene. Tatsächlich ist es die Blaupause für die ultimative Kundenreise. Ein Kunde kommt auf eine Website und was dann? Wie laufen die Schritte ab? Wie kauft jemand etwas? Dabei arbeiten wir sehr eng mit dem Kunden zusammen. Schließlich weiß niemand besser, wie Menschen Fernseher kaufen als die Experten von HelloTV. HelloTV hat auch beim Verkauf seiner Produkte einen einzigartigen Stil und Ansatz. Dies sollte sich auch in der Struktur des neuen Shops widerspiegeln.
In der Wireframe-Phase werden daher die Kernfunktionalitäten des Shops erstellt. Dies ist sofort eine hervorragende Gelegenheit, sie zu testen. Zusammen mit unserem Partner UseSense reichen wir Prototypen bei Benutzerpanels ein. Wir lassen Emico auch beim Testen am Laufen. Gemeinsam überprüfen wir, welche funktionalen Optionen am besten funktionieren und welche nicht. Das sollten Sie wissen, bevor Sie den Rahmen mit einer Designebene einrichten.
FVolle Fahrt voraus mit einer schnellen PWA: glaube dem Hype!
Auf Empfehlung von Emico entschied sich HelloTV für eine Progressive Web App, die auf Magento 2 basiert. Sie können eine PWA als eine Website sehen, die sich wie eine App verhält. Ein wichtiger Vorteil ist die Performance, da beim ersten Besuch sofort alles im Hintergrund geladen wird. Das klickt sich sehr schnell durch — gut für die Conversion — und bei Google, mit einer PWA, hat man sofort einen großen Vorteil. Darüber hinaus bieten PWAs eine Vielzahl einzigartiger kreativer und interaktiver Optionen. Bei Yellowgrape kennen wir uns jetzt gut mit PWAs aus und wir können sagen: Glaubt dem Hype!
Phase 2: Entwurf
Das Wireframe ist wie ein Geschäft ohne Farben, Stile und andere Auslöser. Füllen Sie nur diese Ebene mit dem Design aus. Auch hier war Vorsicht geboten. Der bestehende Shop von HelloTV war für viele treue Kunden ein skurriles und vertrautes Gebiet. Wir haben detailliert analysiert, was die Besonderheiten und Stärken waren. Dies war der Ausgangspunkt für neue Designentscheidungen. Natürlich werden wir nichts in Bezug auf das Design implementieren, ohne es mit Benutzerpanels zu testen. Im Idealfall ist das CRO schon vor dem Start verdammt scharf.
Bessere Verbindung zu den Ausstellungsräumen
Ein wichtiger Aspekt sowohl des Wireframes als auch des Designs war die Verbindung zu den 11 Showrooms von HelloTV. Das besondere Ambiente der Showrooms kam im alten Webshop nicht besonders zur Geltung. Wir haben den neuen Shop viel mehr an den Stil der Ausstellungsräume angepasst. Es gibt jetzt auch eine viel bessere Verbindung zu den Geschäften. Aktuelle Lagerbestände, die Möglichkeit, einen Termin zu vereinbaren, ein Blick in den Laden selbst — der Webshop lädt an vielen Stellen dazu ein, in den Showroom zu gehen.
Phase 3: Split-Tests
Wireframe und Design wurden leider mit größter Sorgfalt getestet und erstellt: Die Live-Übertragung bleibt spannend, insbesondere bei einer vollständigen Migration. Yellowgrape schwört auf Split-Tests. Das bedeutet, dass Sie nach dem Start zunächst nur 10 Prozent des Traffics auf die neue Plattform senden und diesen schrittweise erhöhen. Dabei prüft ihr, ob alles gut läuft und misst alles.
Ein zusätzlicher Vorteil ist, dass Sie sofort sehen können, wie die neue Plattform im Vergleich zur alten abschneidet. Letztlich ist dies die ultimative Sicherheit für den Kunden: Wenn Sie feststellen, dass die Konversionsrate beim Start viel höher ist, sind die Sorgen in der Regel schnell verflogen. Im Fall von HelloTV war der Gewinn sofort erheblich und greifbar. Wir hätten es nicht anders sehen wollen.
Mit dem Wechsel von osCommerce zu Magento gab es viel Platz für neue Funktionen. Wir möchten einige davon hervorheben.
Feature: digitales Vergleichsmodul
Eine der wichtigsten Funktionen des Shops ist die Orientierung. Um diesen Prozess bestmöglich zu erleichtern, bieten wir die Möglichkeit, ausgewählte Produkte zu jedem Zeitpunkt der Reise miteinander zu vergleichen. Sie erhalten dann eine übersichtliche Matrix mit allen Eigenschaften. Als Sahnehäubchen haben wir die Option eingebaut, dass Sie die Unterschiede nur mit einem Klick sehen können.
Feature: Sticky-Cart auf dem PDP
Im Rahmen der Orientierung ist auch ein schneller Einblick in die Spezifikationen sehr wichtig. Beim Testen des Wireframes haben wir die beste Leistung mit einem zweispaltigen Layout auf der Produktseite festgestellt. Für jedes Produkt befinden sich die wichtigsten Eigenschaften und der Kaufen-Button in einer praktischen Übersicht, die Sie gemeinsam mit Ihnen durchblättern können. So behältst du immer den Überblick und die Kaufentscheidung hast du sofort in deiner Hand.
Feature: Konversionsmaximierung im Checkout
Oft sind es kleine Dinge, die einen großen Unterschied bei der Konversion ausmachen, und nirgends finden Sie in diesem Bereich mehr Chancen — und Bedrohungen — als beim Checkout. Natürlich nehmen wir unsere Erfahrung mit, aber kein Shop gleicht dem anderen und wir überlassen nichts dem Zufall. Der Checkout in diesem neuen HelloTV-Shop wurde getestet und bis ins Detail optimiert. Darüber hinaus haben wir den Checkout mit allen möglichen Elementen ausgestattet, die zu einer maximalen Konversionsrate beitragen, wie z. B. automatisches Ausfüllen von Daten, intelligenten Lieferoptionen, Bestätigungen und einem sehr logischen Ablauf. Dabei haben wir festgestellt, dass die Konversionsrate jedes Mal leicht angestiegen ist. Addieren Sie alles und der Gewinn ist beeindruckend.
Sicherlich eine ziemliche Fallstudie, und dann können wir Ihnen viel mehr darüber erzählen. Die wichtigste Erkenntnis: Es ist aufregend, einen bestehenden, gut laufenden Shop zu migrieren und ihm ein zukunftssicheres neues Aussehen zu verleihen. Das erfordert Sorgfalt. Dies erfordert einen Ansatz, der sich durch kontrollierte Schritte und rücksichtsloses Testen auszeichnet. Dies erfordert auch gute Gespräche über Geschichte und Identität — Wurzeln mit neuen Wurzeln verbinden.
Das ist uns mit diesem Fall wunderbar gelungen. Und natürlich ist dieser erhebliche Konversionsschub auch etwas wert. Schließlich müssen Sie uns zurückgewinnen, und zwar am besten ein bisschen schnell. Toll, dass du dir die Mühe gemacht hast, bis zum Ende zu lesen, du bist ein echter Profi! Fragen, Kommentare? Wir würden uns freuen, von Ihnen zu hören.