Die 15 besten Beispiele für Headless Commerce im Jahr 2022

Veröffentlicht: 2022-01-03

Inhaltsverzeichnis

Als jemand, der sich für die E-Commerce-Welt interessiert, ist Ihnen der Begriff „Headless Commerce“ vielleicht nur allzu vertraut. Schließlich scheinen heutzutage alle kopflos zu sein; und das ist nicht überraschend, wenn man bedenkt, dass die Ergebnisse der Top-Marken überwältigend positiv sind.

Zu Demonstrationszwecken werden wir heute einige der prominenteren Beispiele für Headless Commerce auflisten und erläutern, wie dieser neue Ansatz ihren Marken geholfen hat.

ReactJS und Headless Commerce

In Verbindung mit ReactJS sind Headless Commerce-Sites in der Lage, ein App-ähnliches, nahtloses und optimiertes Erlebnis zu liefern, das die Benutzerreise in Form von Progressive Web Apps (PWAs) und/oder Single Page Applications (SPAs) nicht unterbricht.

Aus diesen Gründen gehen ReactJS und Headless in der E-Commerce-Welt oft Hand in Hand und bieten Käufern ein reaktionsschnelles und mobiles First- Erlebnis, das für den Erfolg eines E-Commerce-Shops von entscheidender Bedeutung ist.

Beispiele für Headless-Commerce-Sites basierend auf ReactJS

Hinweis : Viele der Websites, die wir unten auflisten werden, sind entweder teilweise oder vollständig Headless, was bedeutet, dass die oben genannten Vorteile von Headless Commerce möglicherweise nur auf bestimmten Geräten (z. B. Mobilgeräten) sichtbar sind. Die Einzelheiten darüber, welches Gerät jede Website unterstützt, finden Sie in der Beschreibung des Bildes.

1. Nike

SPA reagieren | Node.js BFF | Headless nur für Mobilgeräte verfügbar

Jeder hat von Nike gehört – dem weltberühmten Einzelhändler für Schuhe, aber nicht jeder weiß, dass auch Nike kopflos geworden ist. Das Unternehmen wollte einen Mobile-First- Ansatz, der am besten zu seiner Gesamtstrategie passt, mehr Umsatz mit Mobilfunkkunden zu erzielen. React SPA, kombiniert mit Node.js Backend for Frontend (BFF), schien damals der logische nächste Schritt zu sein; und es hat uns sicherlich nicht enttäuscht. Allmählich begann Nike, mehr Marktanteile von seinem Adidas-Rivalen zu gewinnen, was seine Headless-Kampagne zu einem größeren Erfolg machte, als ursprünglich angenommen.

2. Venus

Schaufenster der Venus-Website
PWA reagieren | Node.js BFF | Headless nur für Mobilgeräte verfügbar

Venus Headless, das kommt mir bekannt vor. Ja, Venus Fashion ist nicht nur eine berühmte Statue aus dem antiken Griechenland, sondern auch ein führender Einzelhändler, der für die Bereitstellung von Damenbekleidung bekannt ist.

Anfangs litt die Website unter langsamen Ladezeiten, da 15,25 % der Seiten der Website in weniger als einer Sekunde geladen wurden. Die Dinge änderten sich jedoch, als Venus den Headless Commerce-Ansatz übernahm und ihre Storefront in eine React Progressive Web App und ihre Infrastruktur in ein BFF (Backend for Frontend) umwandelte. Diese radikalen, risikoreichen High-Return-Initiativen von Venus brachten radikal positive Ergebnisse, wie der oben erwähnte Prozentsatz der Seiten, die weniger als eine Sekunde geladen werden, von 15,25 % auf 72,75 % sprang, das ist eine satte Steigerung von über 50 %. Dank dieser Änderungen in der Ladezeit konnte Venus eine Steigerung der Conversion-Rate um 24 % verzeichnen, sodass sich der Headless-Ansatz wirklich gelohnt hat.

3. Fühlen Sie sich einzigartig

Fühlen Sie sich einzigartig Schaufenster
PWA reagieren | Node.js BFF | Headless nur für Mobilgeräte verfügbar

Mit Millionen von Besuchern jeden Monat verstand Feel Unique – Europas führender Einzelhändler für Schönheitsprodukte –, dass sie ihr Kundenerlebnis aufpeppen mussten, um mehr Umsatz zu erzielen – insbesondere für eine Marke ihrer Größe. Mit der React Progressive Web App wurde das Einkaufserlebnis der Benutzer von Feel Unique erheblich verbessert, indem wichtige Phasen der Einkaufsreise (z. B. Produktsuche, Browsen, Einkaufen) schneller und rationalisiert wurden.

4. Redbox

Redbox-Website-Schaufenster
SPA reagieren | Headless ist sowohl auf Desktop- als auch auf Mobilgeräten verfügbar

Von all den Beispielen fiel uns keins ein, dessen Anforderungen besser zum Headless-Commerce-Ansatz passen als rexbox. Wie andere Einzelhändler, die sich auf visuelle Inhalte spezialisiert haben, stand redbox vor der Herausforderung, eine Homepage zu benötigen, die die Benutzer fesselt und anspricht, um Conversions zu fördern, weshalb eine Single-Page-Anwendung die perfekte Wahl für sie zu sein schien. Und das war es tatsächlich. Nach dem Relaunch seiner Storefront in eine Single-Page-Anwendung konnte rebox fesselndere und reaktionsschnellere Inhalte bereitstellen, während die gleiche, wenn nicht sogar höhere Leistung beibehalten wurde.

5. Überbestand

Overstock-Website-Schaufenster
SPA reagieren | Headless nur für Mobilgeräte verfügbar

Overstock wurde 2017 in einem Vortrag „Die neue Bar für Weberlebnisse“ vorgestellt und ist ein beispielhafter Einzelhändler für den Headless-Commerce-Ansatz. Durch den Umbau seiner Produktrecherche- und Produktbrowsing-Seiten zu interaktiven SPA-Seiten verzeichnete Overstock eine Umsatzsteigerung von 36 % und eine weitere Steigerung der Konversion um 8 %. Und dabei blieb es nicht. Die Marke gewann an Stärke und wurde schließlich zu einem führenden Milliarden-Dollar-Online-Händler in der Merchandising-Branche, der kürzlich als eines der 100 vertrauenswürdigsten Unternehmen der Welt eingestuft wurde.

6. Ziel

Ziel-Website-Schaufenster
SPA reagieren | Headless verfügbar auf Desktop- und Mobilgeräten

So beliebt Target auch ist, sie sehen sich immer noch einer harten Konkurrenz von Amazon und Walmart ausgesetzt, deren Kunden genauso einfach von einer Marke zur anderen wechseln können. Durch Analysen hat die Marke erkannt, dass eine große Mehrheit ihrer Kunden (80 %) die Kaufreise auf einem Gerät beginnt und wahrscheinlich auf anderen abschließt. Diese Lücke zwischen den Geräten zu sehen, kann eine Wachstumschance sein. Die Marke suchte nach Lösungen, die dieses Problem am besten angehen können, und natürlich war ein Headless-Commerce-Ansatz zur Vereinheitlichung des Kundenerlebnisses auf verschiedenen Geräten die Antwort.

7. Annie Selke

Schaufenster der Annie Selke Website
PWA reagieren | AMP | Node.js BFF | Headless nur für Mobilgeräte verfügbar

Heimat von über 170.000 monatlichen Besuchern, Ihrem Qualitätsanbieter für Wohnkultur – Annie Selke wandte sich dem Headless Commerce-Ansatz zu, um ein schnelleres und ansprechenderes Erlebnis zu erzielen, von dem sie glauben, dass es der Schlüssel zu jedem E-Commerce-Geschäft ist. Durch eine Kombination aus PWA- und AMP-Technologien und serverseitigem Rendering hatte Annie Selke großen Erfolg bei der Verbesserung der Leistung der Website, da sie auf eine durchschnittliche Ladezeit der ersten Seite von nur 0,74 Sekunden für alle Verkehrsquellen reduziert wurde. Dank der verbesserten Ladezeit verzeichnete die Marke einen plötzlichen Zustrom von Kunden aus dem organischen Verkehr mit einem Anstieg von bis zu 40,41 %.

Mit diesen Ergebnissen stellte sich heraus, dass das, was die Marke ursprünglich für wahr hielt, eine schnellere und ansprechendere Erfahrung, die durch den Headless-Ansatz erreicht wurde, tatsächlich zum Erfolg führte.

8. Unter Rüstung

Storefront der Under Armour UK-Website
PWA reagieren | Keine beste Freundin | Headless nur für Mobilgeräte verfügbar

Als eine der ersten Marken, die eine progressive Web-App von Mobify hatte, hatte Under Armour eine allgemeine Vorstellung davon, worum es bei ihrem Ziel geht, aber es gab wenig zu sagen, da der Headless-Ansatz, insbesondere der Progressive-Web-App-Ansatz für Headless Commerce, relativ neu war damals. Mit Hingabe und dynamischer Denkweise haben sie ihre Website jedoch nach und nach zu einem funktionierenden, profitablen und beispielhaften führenden Sportbekleidungshändler aus Großbritannien gemacht.

Die gesamte Verbraucherreise von dem Moment an, in dem sie eintreten, ist objektiv besser, schneller und sie können die Reise viel schneller und nahtloser durchlaufen. Es ist fast schmerzlos, von Produktseiten zu Kategorien zu navigieren. Wir haben ein zweistelliges Umsatzwachstum, eine dreifache Rücklaufquote und 65 % weniger Pre-Bounce.

Patrick Grissinger, Senior Product Manager, Under Armour (Quelle: Mobify)

9. Kirklands

Website-Schaufenster von Kirkland
PWA reagieren | Node.js BFF | Headless nur für Mobilgeräte verfügbar

Es gibt nicht sehr viele Amerikaner, die Kirkland's nicht kennen, da die Marke in ihrer US-Heimat mit einer beeindruckenden Anzahl von über 431 Geschäften in 37 Bundesstaaten weit verbreitet ist. Und wie bei den meisten großen Marken ging es auch bei Kirkland vor allem um Geschwindigkeit.

Mit dem aufkommenden Headless-Ansatz für E-Commerce bekam die Marke, was sie wollte und noch mehr. Kirkland's ist jetzt eine der schnellsten Einzelhandels-Websites und Heimat anderer einzigartiger, innovativer und experimenteller Funktionen der E-Commerce-Welt, wie z. B. Check-out mit Fingerabdruck, Anmeldung mit einem Klick usw.

10. Reine Formeln

Pure Formulas Website-Schaufenster
PWA reagieren | Keine beste Freundin | Headless nur für Mobilgeräte verfügbar

Pure Formulas – einer der am schnellsten wachsenden E-Commerce-Händler in den USA – war ursprünglich mit hohen Warenkorbabbruchraten und niedrigen Konversionsraten konfrontiert und war motiviert, der erste in seiner Online-Gesundheits- und Nahrungsergänzungsmittelbranche zu werden, der Headless Commerce einsetzt und PWA in sein Geschäft einführt .

11. Lancome

Storefront der Lancome-Website
PWA reagieren | AMP | Keine beste Freundin | Headless nur für Mobilgeräte verfügbar

Als eine der wertvollsten Marken der Welt im Jahr 2019 sah auch Lancome – das französische Luxusparfüm- und Kosmetikhaus – Potenzial in Headless Commerce und schloss sich mit anderen großen Marken zusammen, um die Benutzererfahrung durch progressive Webanwendungen zu verbessern. Seit der Einführung des Headless-Ansatzes verzeichnete Lancome eine Steigerung der Konversion um 17 %, was nicht allzu groß ist, aber bei einer Marke dieser Größe dennoch berücksichtigt werden sollte.

12. Carnival Cruise Line

Schaufenster der Website von Carnival Cruise Line
PWA reagieren | Keine beste Freundin | Headless nur für Mobilgeräte verfügbar

Für ein Unternehmen, das auf Konsistenz und Verfügbarkeit auf verschiedenen Geräten angewiesen ist, war Carnival Cruise Line – eine der weltweit größten Reise- und Freizeitagenturen – der Ansicht, dass ein Headless-Ansatz natürlich die bessere Wahl für das Buchungsmanagement sei. Durch den kopflosen Durchlauf von PWAs konnte das Unternehmen nicht nur seinen Buchungsfluss verbessern, sondern auch die Benutzerbindung mit Push-Benachrichtigungen steigern.

13. Vereinigte Fluggesellschaften

Schaufenster der Website von United Airlines
PWA reagieren | Kein BFF } Headless sowohl auf Desktop- als auch auf Mobilgeräten verfügbar

Für eine Branche, die auf Buchungserfahrung angewiesen ist, entschied sich United Airlines für die React Progressive Web App, um das bestmögliche App-ähnliche Erlebnis zu erzielen. Mit diesem Ansatz konnte United Airlines eine enorme Verbesserung des Benutzerflusses feststellen, was ihn von der Landung bis zur Buchung zu einem sofortigen Erlebnis machte.

14. Debenhams

Schaufenster der Debenhams-Website
PWA reagieren | Keine beste Freundin | Headless nur für Mobilgeräte verfügbar

Ebenfalls aus Großbritannien kommt Debenhams, ein britischer multinationaler Einzelhändler. Debenhams gehört zu einem der ersten Einzelhändler in Großbritannien, die React PWA als erste Lösung gewählt haben. Der Grund für diese plötzliche Änderung ihrer Infrastruktur ist erwartungsgemäß nicht spontan, sondern auf ihren anhaltenden Kampf mit der Absprungrate von Kunden zurückzuführen. Durch eingehende Analysen erkannte Debenhams, dass ihre Kunden, insbesondere ihre Mobilfunkkunden, dazu neigen, an verschiedenen Punkten ihrer Einkaufsreise abzubrechen, was ihrem Geschäft schadete.

Mit der progressiven Web-App verzeichnete Debenhams eine 40-prozentige Steigerung der mobilen Einnahmen und eine weitere 20-prozentige Steigerung der Conversions, was wiederum dazu führte, dass das Online-Wachstum über dem Markt lag.

15. Lilly Pulitzer

Lilly Pulitzer Website-Schaufenster
PWA reagieren | Keine beste Freundin | Headless nur für Mobilgeräte verfügbar

Während Lilly Pulitzer – die Bekleidungseinzelhandelsmarke – nicht für ihre Größe bekannt ist, ist ihr Erfolg mit Headless Commerce nicht zu übersehen. Da der Hauptverkehr der Händler-Website hauptsächlich von mobilen Geräten kommt, entschied sich die Marke, ihre Website durch den Relaunch auf PWA zu optimieren, um die Erfahrung zwischen Desktop- und mobilen Benutzern zu vereinheitlichen. Die Ergebnisse waren, wie bei vielen anderen Beispielen hier, einfach hervorragend. Im Vergleich zum Vorjahr wurde der mobile Traffic der Marke um 80 % und der mobile Umsatz um 33 % gesteigert.

 Empfohlene Lektüre : Mobile Commerce 2022: Ihr Leitfaden für alle Dinge im M-Commerce

Wörter einpacken

Es besteht kein Zweifel, dass das Web immer reaktionsschneller wird, um den Bedürfnissen mobiler Käufer gerecht zu werden. Wie Sie den obigen Beispielen entnehmen können, ist Headless Commerce in Kombination mit ReactJS in der Lage, ein App-ähnliches Erlebnis zu liefern, das sowohl auf Desktop- als auch auf Mobilgeräten einwandfrei funktioniert. Mit dem anhaltenden Erfolg der Adoption des Headless-Ansatzes ist zu erwarten, dass ein solches Kauferlebnis die zukünftige Norm sein wird.
Wenn Sie sich über die aktuell besten und kostengünstigsten Praktiken in der E-Commerce-Welt informieren und diese in Ihren Magento-Shop integrieren möchten, hat SimiCart genau das richtige Expertenteam, das Ihnen dabei hilft.

Hier bei SimiCart sind wir darauf spezialisiert, nahtlose , ReactJS-basierte progressive Web-Apps mit äußerst positiven Kundenzufriedenheitsraten zu erstellen.

Entwickeln Sie Ihre kopflose Magento PWA