Mediashop.tv Relaunch - Low-Code Customer Experience Plattform

Unternehmen:

MediaShop GmbH

Umsatz:

200 Mio. Euro

Gründung:

1999

Mitarbeiter:

400 Mitarbeiter in zehn Ländern

Branche:

B2B, B2C und D2C-Handel mit Consumer-Produkten

Kurz zusammengefasst

Die Herausforderung

Der Aufbau einer zukunftsfähigen und agilen E-Commerce-Struktur stand im Vordergrund des neuen Online-Shop-Projektes von MediaShop. Damit sollten die laufenden Kosten deutlich reduziert werden, während der neue Shop mit modernem Design mehr Conversion generieren und eine deutlich verbesserte User Experience bieten sollte. Eine Kernaufgabe war dabei die Strukturierung und Automatisierung der Produktdatenpflege des umfangreichen Angebotes. Die Produkte der eigenen Vertical Brands, die von MediaShop regelmäßig eingepflegt werden, sollten leicht angelegt und ausgerollt werden können. Ebenso sollten inspirierende Produktwelten geschaffen werden.

Das Ergebnis

  • Die technologische Basis ist nun “state of the art”.
  • Mit dem neuen Setup kann das MediaShop-Team selbstständig innerhalb eines kurzen Zeitraums neue Themen- und Markenshops anlegen und ausrollen.
  • Die Übernahme der “Technology Ownership” durch MediaShop ist gewährleistet.
  • Die Conversion Rate wurde signifikant verbessert.
  • Das Produktdatenmanagement ist nun effizient und einfach in den Workflow integriert.

Unser Beitrag

  • Neu-Konzeption der gesamten E-Commerce-Architektur und der umliegenden System-Landschaft
  • Entwicklung einer Low-Code Plattform, die eine einfache Wiederverwendbarkeit aller Komponenten ermöglicht
  • Nutzerzentrierter Design-Ansatz
  • Überarbeitung des Shop-Designs
  • Einsatz von API-First Technologien
  • Skalierbarer Frontend-Ansatz durch Single-Product-Applications (SPA/React)
  • Skalierbares und weltweites Cloud-Hosting zur Steuerung von Lastspitzen
  • Internationalisierung & Multi-Store Setup für Europa (ca. 40 Länder)
  • Prozess-Definition für das Produktdatenmanagement
  • Content-Commerce durch Zusammenführung der Commerce und CMS Plattformen in einem Frontend
  • Laufende A/B-Testing-Konzepte zur Steigerung der Conversion-Rate

Features

  • Intelligente Produkt-Suche mit KI-gestützter Schnellsuche
  • Persönlicher Kundenbereich mit Paketverfolgung und Einsicht in die eigene Einkaufshistorie inkl. Wiederbestellmöglichkeit 
  • Erweiterte Produktwelten und optimierte Artikelübersichten 
  • Bedienungsanleitungen zum Download 
  • Unkomplizierter Bestellprozess inkl. Möglichkeit zur Gastbestellung 
  • Sicherer Bezahlvorgang mit erweiterten Zahlarten 
  • TV-Player mit Livestream
Jetzt Kontakt aufnehmen!

Rahmenbedingungen

  • Projektlaufzeit 2 Jahre
  • Partner: Commercetools, Bloomreach, Akeneo, Emarsys

Herausforderungen

Zukunftsfähig im Omnichannel

MediaShop gehört zu den größten Anbietern im Teleshopping. Derzeit wird ca. ein Drittel der Umsatzerlöse über den Webshop erzielt. Ein strategisches Ziel von MediaShop ist es, die Online-Umsätze auf 50% zu steigern. Die Wartungs- und laufenden Betriebskosten der Altlösung sowie die technische Aufstellung waren jedoch nicht mehr zeitgemäß. Zudem sollte bei gleichzeitig einfacher Bedienung aus dem Backend ein plattformübergreifendes Kauf- und Markenerlebnis über alle Vertriebswege von MediaShop geschaffen werden. Neben der hohen Entwicklungskompetenz waren auch die umfangreiche Beratung und der Designanspruch von best it ausschlaggebend für die Auftragsvergabe.

Produktinformationen sind der Schlüssel

MediaShop ist eine vertraute Marke im Teleshopping. Aufgrund der hohen Bekanntheit der Werbespots sollte der hohe Anspruch an das Storytelling ebenfalls in den Webshop übertragen werden. Neben den generellen Inhalten kommt dabei den Produktinformationen eine besondere Bedeutung zu. Mit dem Produkt Information Management (PIM) System von Akeneo kann MediaShop künftig schnell reagieren und die Inhalte plattformübergreifend synchronisieren.

Lösung

User Research und Low-Code

Der neue Webshop basiert auf einer Low-Code Plattform: So lassen sich einzelne Komponenten wie in einem Baukasten einfach nutzen und neu arrangieren. Im Zentrum steht dabei stets der Nutzer, der zwischen den TV-Werbespots und dem Webshop geführt werden soll.

Der User Experience kam eine besondere Bedeutung zu – bereits bei der Planung, aber auch bei der Umsetzung des neuen Webshops. Das Design spielte dabei eine wesentliche Rolle, um eine bessere Nutzerführung in den Shops abzubilden. Das Replatforming des Shops wurde daher auf der Basis einer umfangreichen User Research durchgeführt. Im Vordergrund standen dabei die Begeisterung für das Produkt, der Joy of Use der Nutzer und die klare, eingängige Kommunikation der Produktvorteile. Damit sollte der hohe Anspruch des Teleshoppings an das Storytelling aus dem Direct Response TV in den Webshop verlängert werden. Der stattfindende Medienbruch wurde so eliminiert und ein durchgängiges wie nachhaltiges Nutzererlebnis geschaffen. Der Webshop übernimmt die intelligente Verzahnung zwischen TV-Shopping und dem Kaufabschluss im Internet mit einer direkten Überführung zwischen den beiden Plattformen.

UX Case Study Tom Tailor User Research

Microbrand-Shops als Teststrecke

Mit Microbrand-Shops wurden Tests vorgenommen, wie die Klickstrecken, die Produktpräsentation und der Checkout optimal zu den Kundenerwartungen passen. Die Erkenntnisse dieser digitalen Teststrecke wurden in die digitale MediaShop-Plattform überführt. In Zukunft wird der Shop noch in weiteren Ländern ausgerollt – unter anderem in Rumänien, Tschechien, der Slowakei und Ungarn. Das Replatforming auf der Basis des commercetools-Webshops ist damit allerdings nicht abgeschlossen: Laufend wird der Shop im Scrum-Prozess weiterentwickelt, um mit den Erwartungen und Bedürfnissen der Kunden stets Schritt halten zu können. Lastspitzen im Tagesgeschäft werden durch weltweites Cloud-Hosting effizient ausgesteuert – damit ist der Shop auch für Phasen mit enormem Traffic gerüstet.

Responsiveness auf allen Geräten

Der gesamte neue Auftritt von MediaShop ist responsive umgesetzt. So wird gewährleistet, dass auf allen Endgeräten ein schneller Zugang zu den Produkten möglich ist und der Kaufabschluss seine Umsetzung findet. Das Frontend wurde dabei als „SPA“ (Single Page Application) umgesetzt, wodurch es keine Page-Refreshs mehr gibt und dem Kunden dabei das Gefühl wie auf einer nativen App vermittelt wird.

ms-cs-mobilemockup

Wireframing

ms-cs-research

Wireframing

ms-cs-styletile

Designsystem

Das Ergebnis

Die neue Plattform von MediaShop erfüllt alle Bedürfnisse und Nutzeranforderungen an einen modernen Online-Shop und baut eine effiziente Brücke zwischen dem TV-Anteil sowie dem Internet. Die Nutzer werden intuitiv durch den Shop und die Themenbereiche geführt. Zugleich wird das Storytelling aus den TV-Spots erfolgreich in den neuen Shop übertragen.
Das Konzept ermöglicht zudem jederzeit eine weitere Expansion durch Internationalisierung, auch ein Multi-Store-Setup für verschiedene Märkte kann einfach aufgesetzt werden. Die Zusammenführung von Commerce- und CMS-Plattform ermöglicht Content Commerce und setzt das Erlebnis der Fernsehspots nahtlos im Web und auf allen Endgeräten fort. Mit diesen Maßnahmen konnte die Conversion Rate bereits signifikant verbessert werden. Laufende A/B Testing-Konzepte helfen zudem stetig, das Shoppingerlebnis zur Steigerung der Conversion Rate weiter zu verbessern.
Die gesamte Commerce-Architektur und die umliegende System-Landschaft wurden neu konzipiert, eine Low-Code Plattform für die Wiederverwendbarkeit aller Komponenten entwickelt, ein nutzerzentrierter Design-Ansatz erstellt, sowie verschiedene API-First Technologien eingesetzt. Dadurch ist heute ein selbständiger Rollout neuer Shops durch das unternehmenseigene Team von MediaShop möglich.

MORE IT

weitere cases

Marc Aurel
Tom Tailor
Calumet Photographic

ASK IT

Ihre Ansprechpartnerin

Karen Cavallaro
Head of UX/UI

Telefon: +49 30 200 111-0

MORE IT

weitere cases