Wie die erweiterte benutzerdefinierte Shopify-Entwicklung eine bessere Benutzererfahrung schafft

Für Paravel, einen Anbieter hochwertiger, innovativer und verantwortungsvoll produzierter Reisegepäckstücke, Taschen und anderer Reiseaccessoires, ist kundenspezifische Funktionalität ein Muss. Die Produkte, die sie produzieren und verkaufen, sind einzigartig, daher war es für sie notwendig, ihren Kunden ein einzigartiges Einkaufserlebnis zu bieten.

Paravel benötigte viele grundlegende E-Commerce-Funktionen, um praktische Abläufe über seinen Online-Shop durchführen zu können. Ursprünglich wurden sie auf einer Open-Source-Plattform namens Spree erstellt, die viele Anhänger und Unterstützer hat, weil es sich um eine Open-Source-Plattform handelt.

Spree ist, wie andere Open-Source-Plattformen wie Magento, extrem anpassbar. Es kann auch mit einer sehr großen Anzahl von Plugins und Apps von Drittanbietern integriert werden, ist hochgradig skalierbar und weist ein Maß an UI-Intuition auf, das die Entwicklung einer mobilfreundlichen Oberfläche erleichtert.

Dies ist zwar nur eine kurze Momentaufnahme der verschiedenen Funktionsmerkmale von Spree, einige davon sind jedoch mit den gleichen hohen Kosten verbunden wie andere Open-Source-Plattformen. Ihre Funktionalität mag nahezu grenzenlos sein, aber sie erfordern viel Entwicklungszeit und noch mehr Erfahrung, um sie zu realisieren. Ohne umfangreiche Programmiererfahrung oder einen Hintergrund in der Entwicklung können Plattformen wie Spree die Ressourcen schnell erschöpfen.

Paravel brauchte dieses einzigartige Einkaufserlebnis, aber sie brauchten auch eine sofort einsatzbereite Lösung, die ihren E-Commerce-Händlern viel bietet. Das Problem für sie war, wie sie ihren bereits akribisch entworfenen und entwickelten E-Commerce-Shop von der Spree auf eine leistungsfähigere Plattform bringen konnten?

Ein gründlicher Migrationsprozess

Nach Rücksprache mit unserem Vertriebsteam entschied Paravel, dass ein Wechsel zu Shopify Plus die Antwort sei – mit ein paar Auflagen. Paravel wollte unter anderem keine negativen Auswirkungen der Migration erfahren und wollte, dass sein neuer Laden alle Funktionen seines Spree-Ladens bietet und noch einiges mehr. Dazu brauchte Paravel mehr als einen Shopify Plus-Partner – sie brauchten einen Shopify Plus-Experten.

Während Spree nahezu unbegrenzte Anpassungsmöglichkeiten bot, könnte Shopify Plus als gehostete E-Commerce-SaaS-Plattform ihnen so viel mehr bieten. Mit Hilfe eines Entwicklungsteams wie 1Digital ^Ⓡ könnte Shopify Plus ihnen alle Anpassungen anbieten, die Spree anbietet, und mehr. Shopify Plus bot außerdem erhöhte Sicherheitsfunktionen, garantierte Betriebszeit, schnelle Website-Geschwindigkeit, ähnliche Kompatibilität mit Apps und Plugins von Drittanbietern, Akzeptanz einer Reihe von Zahlungsoptionen, immense Skalierbarkeit und vieles mehr. Paravel wurde zu diesem Zeitpunkt damit beauftragt, seinen bestehenden Spree-Shop und sein Design und seine Funktionalität auf Shopify Plus umzustellen.

Für einige ist der Prozess einer Website-Migration erschütternd, aber wir wussten es anders. Mit Hunderten von erfolgreichen Migrationen im Rückblick und einem Team von Entwicklern, die unsere Bemühungen unterstützen, wussten wir, dass dies ohne jegliche Probleme möglich war. Es würde nur einen gründlichen Prozess erfordern.

Der Prozess war intensiv, aber nichts, was 1Digital ^Ⓡ Agency nicht mit Bravour umsetzen konnte. Das Projekt erforderte die Migration von 32 Produktfeldern (einschließlich Namen, Beschreibungen, Bildern, Preisen und mehr) sowie jeweils mehr als 4.000 Kundenkonten und Bestellungen. Dazu haben wir einen temporären Linux-Server eingerichtet und ein benutzerdefiniertes Skript geschrieben, um diese Informationen aus dem Spree-Inventar ihrer ursprünglichen Website zu ziehen und zu kategorisieren.

Um es zu verschieben, haben wir ein weiteres benutzerdefiniertes Skript erstellt, um eine Verbindung zur Shopify-API herzustellen, bevor alle relevanten Felder ordnungsgemäß importiert werden. Während des Prozesses und danach wurden die Daten überprüft, um sicherzustellen, dass sie richtig im neuen Geschäft landen, damit nicht nur nichts verloren geht, sondern alles dort aufgefüllt wird, wo es hingehört.

Unser gründlicher Prozess verhinderte den Verlust von Daten, aber was ist mit dem Verlust von Datenverkehr? Wenn es eine Sache gibt, die E-Commerce-Kunden von der Aussicht auf ein Replatforming abschreckt (auch wenn es mit enormen Vorteilen verbunden ist), dann ist es die Angst, Traffic oder Domain-Autorität zu verlieren.

Glücklicherweise verhindert unser Migrationsprozess Schäden an SEO ebenso akribisch wie Datenverlust. Bei Paravel haben wir, wie bei jedem Migrationsprojekt, alle URLs gesammelt, die mit ihrer Website verknüpft sind, und dann 301-Weiterleitungen zu den verknüpften URLs auf der neuen Shopify-Website eingerichtet. Es überrascht nicht, dass Paravel nach Abschluss der Migration keine Traffic-Verluste oder Ranking-Schwankungen hinnehmen musste.

Support – nur für den Fall

Die Migration zu Shopify verlief reibungslos, und Paravel war auf dem besten Weg zu einem neuen Shopify Plus-Shop mit verbesserter Funktionalität und einer besseren Benutzererfahrung, aber um sicherzugehen, haben wir in das Migrationsprojekt einen kostenlosen 30-tägigen Support-Zeitraum aufgenommen . Jede Shopify-Migrationsagentur mit einem bewährten Prozess sollte dies tun; es ist einfach ein fester Bestandteil einer erfolgreichen Migrationsstrategie.

Die Länge der kostenlosen Supportzeiträume variiert je nach Umfang des Projekts, aber im Fall der Paravel-Migration haben wir 30 Tage vorgesehen. Dadurch hatten sie einen ganzen Monat Zeit, ihre neue Website zu untersuchen und eventuell auftretende Migrationsfehler zu beheben – die wir kostenlos beheben würden.

Selbst danach erlaubten wir ihnen, auf Vorschuss zu bleiben, und verlangten keine Anzahlung von ihnen; einfach alle Änderungen in Rechnung stellen, die sie nach Ablauf des kostenlosen Website-Supportzeitraums protokollieren würden. Kleine Dinge wie diese tragen wesentlich dazu bei, einen guten Kundenservice zu gewährleisten, und wir möchten sicherstellen, dass Migrationen reibungslos verlaufen, auch wenn alles überprüft, doppelt überprüft und erneut überprüft wird.

Eine neu entwickelte Website

Aber es war noch nicht vorbei mit einer Migration. Paravel hatte Kriterien für den Umzug im Zusammenhang mit dem Kundenerlebnis, das die neue Website bieten würde, und um dies sicherzustellen, mussten wir eine brandneue Shopify Plus-Website für sie entwickeln.

Als Teil ihres Projekts erstellten die Entwickler der 1Digital ^Ⓡ Agency eine brandneue Homepage für sie, die besser in die Marke integriert war und dazu beitrug, ihre Produkte in einem wünschenswerteren Licht zu positionieren. Es enthielt aktualisierte Produkt- und Hintergrundbilder, die besser auf die Interessen und Wahrnehmungen ihres Zielmarktes abgestimmt waren. Betrachten Sie den eleganten, anspruchsvollen Eindruck der neuen Homepage unten, mit einem Standbild der alten Homepage darunter.

Für Besucher ihrer Homepage fällt das neue Layout sofort auf, nicht nur wegen der überlegenen Ästhetik seiner Bilder, sondern auch wegen der konzertierten Bemühungen, die es unternimmt, den Wert der Produkte von Paravel in den Mittelpunkt zu stellen. Sie werden auch feststellen, dass es oben im neuen Homepage-Layout ein Menü gibt, das im vorherigen Design fehlte; Der Weg, auf ihre Produkte zuzugreifen, bestand früher darin, die Seite nach unten zu scrollen, wo es eine Schaltfläche mit der Bezeichnung „Shop the Collection“ gab. Die neue Seite bietet viel bessere Seitennavigationsfunktionen, wie Sie oben sehen können.

Wenn Besucher auf der Homepage nach unten scrollen, können sie Bewertungen über ein verschiebbares Banner sehen, mehr über beliebte Produktkategorien erfahren und sogar sehen, wie Kunden die Produkte über soziale Medien verwenden, wie Sie in einigen der Screenshots unten sehen können.

Zusätzlich zur Homepage hat 1Digital ^Ⓡ eine neue Kategorieseitenvorlage zusammen mit einer „Our Story“-Seite für Paravel erstellt, zusätzlich zu mehreren anderen Systemseiten. Unter den Seiten, die entwickelt wurden, befanden sich die Warenkorb- und Kassenseiten, Anmeldeseiten, Geschenkgutscheinseiten und „Dankeschön“-Seiten. Schließlich haben wir eine Reihe von Inhaltsseiten angepasst, einschließlich der Seiten „FAQ“ und „Bedingungen“.

Die Bedeutung eines hochwertigen responsiven Website-Designs ist heutzutage für den E-Commerce von entscheidender Bedeutung, und die Entwickler von 1Digital ^{Ⓡ haben} im Rahmen des Projekts darauf geachtet, eine aktualisierte responsive Website für Paravel vorzubereiten. Im Interesse der Benutzererfahrung von Paravel passt sich das neue responsive Design von 1Digital ^Ⓡ automatisch an kleinere Bildschirme an, passt die Größe an und formatiert den Text entsprechend neu.

Fortgeschrittene Entwicklung – Funktionalität der Kategorieseite

Als die Entwickler von 1Digital ^Ⓡ alle mit den Produktkategorien von Paravel verbundenen Informationen übertragen haben, haben wir auch einige neue Funktionen hinzugefügt, die sie an ihre Kunden weitergeben können, um so das Kundenerlebnis zu verbessern.

Wir haben einen Metafield Editor in ihre Kategorieseitenvorlage eingebaut, damit Paravel schnell Änderungen an einigen der Abzeichen vornehmen konnte, die auf ihrer Kategorieseitenanzeige erschienen. Dadurch konnten sie benutzerdefinierte Felder bearbeiten, sodass Werbeaktionen im Zusammenhang mit „neuen“, „Bestseller“- oder „empfohlenen“ Produkten deutlicher angezeigt werden konnten.

Diese scheinbar einfache Funktion gibt den Administratoren von Paravel viel Kraft zurück, um schnell und einfach Änderungen an der Anzeige ihrer Website vorzunehmen, ohne mit einem Entwickler zu arbeiten. Man kann einem Mann einen Fisch geben oder die Kunst beibringen, und wir haben Paravel detaillierte Anweisungen zur Verwendung und Verwaltung der App gegeben, damit sie auch nach Abschluss des Projekts problemlos Änderungen vornehmen können.

In ähnlicher Weise haben die Entwickler von 1Digital ^Ⓡ Produktmuster und Schnellansichtsfunktionen auf den Sammlungsseiten von Paravel erstellt. Wir haben ein benutzerdefiniertes Skript für die Shopify Plus-Sammlungsseite erstellt, mit dem die gewünschten Informationen abgerufen und angezeigt werden konnten.

Das Skript für diese Muster stellte außerdem sicher, dass das Produktbild in dieser Farbe angezeigt wurde, wenn ein Kunde auf das Muster mit der gewünschten Farbe klickte. Darüber hinaus würde es die mit der Änderung verbundenen geltenden Preise sowie alle Optionen zur „Personalisierung“ oder, falls erforderlich, eine „nicht vorrätig“-Meldung anzeigen.

Fortgeschrittene Entwicklung – Funktionalität der Produktseite

Paravel legt großen Wert auf das Kundenerlebnis und benötigte daher viele zusätzliche Funktionen von seiner Produktseitenvorlage, einschließlich zusätzlicher Funktionen zur Personalisierung des Einkaufserlebnisses.

Daher half 1Digital ^Ⓡ als Teil des fortgeschrittenen Entwicklungsaspekts des Projekts bei der Erstellung neuer und besserer Funktionen zur Personalisierung des Einkaufserlebnisses auf ihrer Website, insbesondere auf ihrer Produktseite.

Wir haben ihre Produktseitenvorlage so konfiguriert, dass sie ähnlich wie in ihrem alten Spree-Shop angezeigt wird. Wir haben dann eine Stick-Leiste „In den Warenkorb“ erstellt, die am unteren Rand der Produktseitenanzeige verbleiben würde. Das war der einfache Teil.

Wir haben auch ein Tool für ihre Produktseitenvorlage entwickelt, mit dem Käufer ihr Einkaufserlebnis personalisieren und realistischer gestalten können. Paravel bietet seinen Kunden nicht nur die Möglichkeit, anhand der oben beschriebenen Swatch-Funktion zu sehen, wie eine bestimmte Tasche (oder ein anderes Produkt) aussehen würde, sondern gibt seinen Kunden auch die Möglichkeit, ihre Produkte zu personalisieren.

Paravel war an den konversionssteigernden Funktionen eines realistischen Tools interessiert, das es seinen Kunden ermöglichen würde, tatsächlich zu sehen, wie ihre Produkte nach der Personalisierung aussehen würden, also haben wir ein Tool entwickelt, mit dem sie dies tun können.

Das Tool, das wir für Paravel erstellt haben, zeigte ein Popup mit den Worten „Personalisieren“ an, wenn ein Kunde die Produktseite besuchte. Wir haben dann ein Tool erstellt, mit dem der Kunde das Produkt entsprechend dem Stil und der Farbe des Schriftzugs personalisieren kann, der als erscheinen würde Monogramm mit ihren Initialen.

Dieses Tool wird als Widget auf der Produktseite angezeigt, nachdem der Kunde auf „Personalisieren“ geklickt hat, und ist sehr einfach zu manipulieren und an seine Vorlieben anzupassen. Um sicherzustellen, dass das Produkt die Personalisierung richtig anzeigt, mussten wir ein benutzerdefiniertes Skript erstellen, das die vom Kunden eingegebenen Buchstaben genau in dem von ihm ausgewählten Stil über dem richtigen Bereich des Produkts anzeigt, wie zu sehen ist im Bild unten. Als letzte Stufe der Funktionalität haben wir eine „Nylon-Vorlage“ erstellt, die es den Kunden von Paravel ermöglichen würde, ihre Produkte mit gestickten Buchstaben anstelle von handgemalten Buchstaben oder Applikationen anzupassen.

Es gab ein paar weitere Anpassungen, die wir für die Produktseiten von Paravel erstellt haben, einschließlich der Implementierung von vier Registerkarten von den Produktseiten in ihrem alten Spree-Shop über HTML-Codierung. Wir haben auch die „Choose Your Own Adventure“-Funktion aus Paravels Spree Store nachgebildet, die es Kunden ermöglicht, Paravels Produkte mit Applikationen und handgemalten Designs weiter zu personalisieren, zusätzlich zu einigen anderen Anpassungen, um die Integrität der ursprünglichen Funktionalität, die auf erschien, zu bewahren ihren Spreeladen.

Integration mit kritischen Apps

Um die Funktionalität ihres neuen Shopify Plus-Shops sicherzustellen und ein reibungsloses, angenehmes Benutzererlebnis zu gewährleisten, musste 1Digital ^Ⓡ Agency den neuen Shop von Paravel in seine geschäftskritischen Apps integrieren.

Die Kunden von Paravel verließen sich unter anderem auf Bewertungen und Erfahrungsberichte, die Paravel über YotPo zeichnen und anzeigen konnte, und wir stellten sicher, dass es für sie nahtlos integriert wurde. Paravel verließ sich auch stark auf die Verwendung von Zaius für Kundenbindung und CRM, also haben wir diese Integration sowie die oben genannten durchgeführt.

Darüber hinaus nutzt Paravel nicht nur die Funktionalität von RJ Metrics, sondern auch von Talkable. Diese Apps liefern den Administratoren von Paravel wertvolle Daten und ermöglichen sichere Empfehlungsmarketingprogramme.

1Digital ^Ⓡ Agency integrierte alle diese Apps in den neuen Store von Paravel, zusätzlich zur Programmierung und Entwicklung ihrer neuen Shopify Plus-Website. Wir haben dieses Projekt mit umfassendem Umfang, das eine Migration und fortgeschrittene kundenspezifische Entwicklung beinhaltete, ohne Probleme abgeschlossen. Das heißt, der Kunde erlebte keine unangemessenen Unterbrechungen im Geschäft, keinen Verkehrsverlust und wechselte ohne Schluckauf in ein neu entwickeltes Geschäft mit erweiterten benutzerdefinierten Funktionen. Dazu braucht es Erfahrung und gründliche Prozesse, die 1Digital ^Ⓡ in unseren Workflow integriert.

Die Komplettlösung

Einige Anbieter stimmen ihre Dienste auf ein oder zwei hochspezialisierte Dienste ab, aber wir wissen, dass die Probleme, mit denen E-Commerce-Händler konfrontiert sind, vielfältig sind. Wenn wir nur Entwicklungsdienstleistungen anbieten könnten, hätten wir Paravel nicht von Spree zu Shopify Plus migrieren können, einer der führenden E-Commerce-Plattformen für Online-Händler. Wenn wir uns auf die Durchführung von Migrationen beschränkt hätten, wären wir in ähnlicher Weise nicht in der Lage gewesen, ihren neuen Shop so anzupassen, wie sie es wollten.

Die Design- und Entwicklungsdienste von Shopify Plus sind, selbst wenn sie mit unseren Migrationsdiensten kombiniert werden, nur eine kleine Momentaufnahme dessen, was 1Digital ^Ⓡ Agency bietet. Zusätzlich zu unseren Shopify-Services für benutzerdefiniertes Design bieten wir auch umfassende digitale Marketingkampagnen an, darunter äußerst wettbewerbsfähige, gründlich recherchierte und gezielte SEO- und PPC-Kampagnen.

Diese Erfolgsgeschichte hängt von der Tatsache ab, dass wir Paravel von Spree auf einen neu entwickelten Shopify Plus-Shop mit erweiterten Funktionen migrieren konnten. Viele unserer anderen E-Commerce-Fallstudien konzentrieren sich auf andere E-Commerce-Plattformen wie BigCommerce-Design und -Entwicklung, ähnliche Magento-Dienste und digitale Marketingkampagnen. Sehen Sie sich unser Repertoire an, und wenn Sie sehen möchten, wie wir die Probleme Ihres Online-Geschäfts lösen können, rufen Sie uns unter 888-982-8269 an.

PDF Herunterladen