Neugestaltung der Website mit mehr als 1 Million DAU in einem Produktansatz





Kürzlich landete eine technologische Landung von Experten der M.Video-Eldorado-Gruppe am Standort des Product Camp Russia (& EE) 2021 zum 10-jährigen Jubiläum . Es war ein sehr cooles, helles und ungewöhnliches Ereignis für unser gegenwärtiges Ereignis nach der Pandemie.



Dutzende Produktmanager führender Technologieunternehmen versammelten sich auf dem Konferenzgelände, um ihre Erfahrungen mit Kollegen aus verschiedenen Unternehmen und Teilen der Welt zu teilen.

Einer der hellsten Berichte des Treffens war die Rede von Andrey Pchelintsev - Leiter der Kernprodukte "M.Video", der den Teilnehmern des Forums die Besonderheiten der Neugestaltung der Website des Unternehmens im Hinblick auf die Verwendung des Produktansatzes erläuterte.



Als nächstes kommt die Ich-Erzählung. Fragen, Gedanken, Ideen und Vorschläge werden in den Kommentaren zu dieser Veröffentlichung akzeptiert. Willkommen an Bord!



Hallo ich bin...



Hallo allerseits, ich bin ─ Andrey Pchelintsev, Leiter Core Products M.Video. Wir sind Teil der M.Video-Eldorado-Gruppe , einem der zehn größten Elektronikverkäufer der Welt.



CORE-Produkte bei M.Video-Eldorado sind neun Produktteams, die an der Website und der mobilen Anwendung des Unternehmens arbeiten.



Im Kontext der durch die Coronavirus-Pandemie ausgelösten Krise wandelt sich unsere Gruppe sehr dynamisch um und entwickelt aktiv Online-Kanäle. Wir haben bereits einen Online-Anteil von mehr als 50%, was ernsthafte Anforderungen an die Website und die mobile Anwendung stellt.



Was ist ein Produkt und was hat das Redesign damit zu tun?



Auf allen Ebenen unseres Geschäfts bemühen wir uns um einen Produktansatz. Was es theoretisch ist, wird in verschiedenen Quellen geschrieben (tyk, tyk, tyk). Aber wie sie sagen: "Es war glatt auf dem Papier, aber sie haben die Schluchten vergessen und sind auf ihnen gelaufen." Auf der Grundlage dieses Artikels möchte ich Ihnen meine Erfahrungen und die Unebenheiten mitteilen, die bei der Arbeit an aktuellen Projekten aufgetreten sind.



Ich glaube, dass es unmöglich ist, moderne komplexe Online-Systeme zu entwickeln, die auf Kundeninteraktion außerhalb des Produktansatzes ausgerichtet sind. Daher ist das Produkt das zentrale Glied bei allen vorgenommenen Änderungen.



Was ist ein Produkt? Nach unserem Verständnis ist ein Produkt eine ganzheitliche Benutzererfahrung, die in vier Komponenten unterteilt ist:



  • Bestimmte technische Funktionen;
  • Die daraus resultierende Kombination aus Design und Benutzerfreundlichkeit;
  • Inhalte füllen;
  • Langfristige Monetarisierung.


Die Neugestaltung der Website ist ein strategischer Schritt. Sie dient dazu, das Erscheinungsbild und die Funktionalität der Website zu ändern. Und das Redesign selbst entspricht den Eigenschaften des Produkts und sollte meiner Meinung nach im Rahmen des Produktansatzes durchgeführt werden.







Wann ist eine Neugestaltung erforderlich?



Redesign ist natürlich eine sehr ernste Aktivität und es ist wichtig zu verstehen, warum es benötigt wird und was der Grund dafür ist. Meiner Meinung nach kann jeder der in der folgenden Abbildung dargestellten Parameter, auch einzeln, zu einer Neugestaltung führen.







Auch hier kann jeder der oben genannten Parameter zu einer Neugestaltung führen.







Wir hatten das ganze Set. Die Website erfüllte keinen der Parameter und war ein ernstes Hindernis für die Entwicklung des Online-Geschäfts. In der ersten Phase haben wir die Site-Oberfläche aktualisiert.



Operation fehlgeschlagen!



Wissen Sie, wie viele Redesigns Glück haben? Wie viele scheitern? Mehr als 85% der Redesign-Fälle sind fehlgeschlagen!



Es gibt keine einzige Erklärung dafür, warum dies geschieht. Für mich selbst erkläre ich dies durch die enorme Komplexität der Änderungen, die auftreten müssen, und die falsch festgelegte "Diagnose" für die Neugestaltung.



Von außen mag es scheinen, dass es extrem einfach ist, das Design der Site zu ändern, aber dies gilt nur für kleine Sites. Die Neugestaltung einer riesigen Site wie der M.Video-Site ist eine ernsthafte Herausforderung, da es Dutzende verschiedener Seitentypen, unzählige miteinander verbundene Elemente und die schwerwiegendsten Anforderungen an UI / UX gibt.



Von außen scheint es schwierig zu sein, eine Neugestaltung vorzunehmen - das Erscheinungsbild, die Stilelemente, die Schriftarten usw. zu ändern, die Funktionalität irgendwo zu ändern - ganz normale Arbeit an der Änderung des Produkts.



Ordnung ist wichtig



Wie nähern Sie sich einer Neugestaltung? Werfen wir einen Blick auf die Hauptschritte und definieren die Reihenfolge. Meiner Meinung nach sollte alles ähnlich sein wie in der folgenden Abbildung dargestellt.







Schauen wir uns das in einer Größenordnung etwas genauer an. Und vergleichen Sie die Pläne mit der Tatsache.







Auf der linken Seite finden Sie eine detaillierte Reihenfolge der Schritte in der Reihenfolge der Neugestaltung. Alles wird hier schrittweise gezeigt.



Schauen wir uns unseren Fall rechts an. Wir sind nicht einzigartig und im Falle unserer Neugestaltung haben wir natürlich schief gestartet.



Ich habe alle Stufen in drei Bereiche unterteilt - rot, wenn wir alles falsch gemacht haben, gelb, wenn wir versucht haben, alles zu reparieren, und grün, wenn wir es gut gemacht haben. Ich bin gerade am Ende des roten Blocks in die Firma eingetreten.



Erstellen Sie keine Erwartungen und Designkonzepte, ohne eine Vision zu analysieren und zu formen



Lassen Sie uns anhand unseres Beispiels ein wenig über das Setzen von Zielen sprechen. Alles begann damit, dass wir sowohl in Bezug auf Geld als auch in Bezug auf Zeit die falschen Erwartungen geweckt haben. Darüber hinaus hatten wir kein Verständnis für die Komplexität des Wechsels von der aktuellen Site zu einer neuen Site und hatten daher keine Strategie für den Umzug von einer neuen Site. Wir hatten keine eindeutigen Antworten auf wichtige Fragen:



  • Wie wird es sein?
  • Ändern wir sofort das neue in das alte oder tun wir es Seite für Seite?
  • Geben wir die Möglichkeit, auf die alte usw. umzusteigen?


Anfänglich gab es kein Verständnis für die Neugestaltung selbst. Es gab jedoch bereits ernsthafte überschätzte Erwartungen sowohl hinsichtlich des Geldes und des Zeitpunkts des Prozesses als auch hinsichtlich der erforderlichen Ressourcen.



Ich bin gerade in die Firma eingetreten. Ich erinnere mich noch an die zentrale Folie der gesamten Präsentation über den Verkauf einer neuen Website innerhalb des Unternehmens, den roten Hintergrund der Füllung und die weißen Zahlen in Schritten von mehreren Milliarden Rubel aus der Erstellung der neuen Website.



Natürlich waren diese Zahlen schon lange vor aller Augen und es wurden zunächst falsche Erwartungen geweckt. Es wurden ständig einige Designkonzepte erstellt, bearbeitet und diskutiert, obwohl es keine normale Analyse, keine Forschung, kein Verständnis für die Schmerzen der Benutzer, keine Wettbewerbsanalyse und, was sehr wichtig ist, keine Vision gab.



Ich glaube, dass Vision ein Schlüsselelement beim Aufbau eines Online-Produkts ist und dass der Aufbau eines Produkts ohne Vision und Strategie wie Segeln ohne Segel in eine unbekannte Richtung ist.





Es ist nie zu spät, Wiedergutmachung zu leisten



Nach dem Eintauchen in die Situation wurde klar, dass:

A. es korrigiert werden muss;

B. Das Problem des Umzugs auf eine neue Site war viel schwerwiegender und es war einerseits unmöglich, unterschiedliche Kundenerlebnisse zuzulassen, und andererseits bestand kein Wunsch, das Bild der veralteten Site zu wiederholen.



Während wir uns mit Details befassen, analysieren und recherchieren, wurde ein Ansatz gewählt - durch eine Neugestaltung zu einer neuen Site zu gelangen. Das Ziel der Neugestaltung war der nahtloseste CJ für die neu erstellten Seiten der Website, dh die Einheitlichkeit:



  • Gittergewebe;
  • Schriftarten;
  • Stilelemente;
  • gemeinsame Elemente (Kopf- und Fußzeile usw.);
  • Farben und andere Dinge.


Eine grundlegende Bewegungsstrategie wurde gewählt. Ferner wurde die Vision und Produktstrategie des Standorts formuliert, die als "Punkt B" bezeichnet wurde. Es war ein Schlüsselelement, das für alle Teilnehmer des Prozesses ein Bild eines einzelnen Ergebnisses bildete.



Aber eine Vision zu entwickeln, ist natürlich gut, aber sie musste immer noch in das Designkonzept eingepflanzt werden, um Lobbyarbeit zu betreiben und das zu verteidigen, was als „Verkauf“ bezeichnet wird.



Weltweit ist in einem großen Unternehmen die Verkaufsphase eine Schlüsselphase, da einerseits Erwartungen von Stakeholdern auf verschiedenen Ebenen und andererseits eine große Anzahl von Interessenten an der Funktionalität bestehen, die Elemente anzeigen. Und all diese Erwartungen und "Wünsche" miteinander und auch mit der Vision / dem Konzept zu verbinden, ist eine absolut nicht triviale Aufgabe. Darüber hinaus ist es wichtig, es nicht nur einmal zu verkaufen, sondern auch die Erwartungen in der Zukunft aufrechtzuerhalten und die Erwartungen zu synchronisieren.



Wir haben viel Zeit für diese Aktivität aufgewendet und gleichzeitig Forschung, Entwicklung und Anpassung der Arbeiten nach Bedarf durchgeführt, da viele Arbeiten aufgrund eines falschen Starts parallel abliefen.







Selbst wenn die "Eröffnung" verloren geht, besteht die Chance, das "Endspiel" zu gewinnen.





Dank der orangefarbenen Zone, in der wir die richtigen Phasen „gesteuert“, eine Vision, Strategie und Konzepte erstellt, Argumente darüber erhalten haben, wie wir vorgegangen sind, und mit der Entwicklung begonnen haben, konnten wir die Aktivitäten schrittweise aufeinander abstimmen und uns der letzten Phase ziemlich korrekt nähern Organisation des Prozesses.



Wir waren systematisch bereit für die Pilotierungsphase, führten eine schrittweise Pilotierung durch, sammelten Metriken, validierten die Implementierung und nahmen gegebenenfalls Anpassungen vor. Wir näherten uns schrittweise, um alles für Lebensmittel korrekt auszurollen.



Während der Arbeit gab es viele Kuriositäten und Einsichten, zum Beispiel haben wir ein Objekt vergessen, aber die systematische Verfolgung von Metriken half uns, mit allem fertig zu werden.



Wie kann man verstehen, dass "alles geklappt hat"? Metriken anzeigen!







Das Hauptaugenmerk der Neugestaltung lag auf der Verbesserung des Auswahlprozesses. Wir haben den Korb und den Check-out nicht angefasst. Unsere Basismetrik, die wir anfangs verbessert haben, war der Online-Verkauf.



Eine andere Metrik, die wir uns anfangs angesehen haben, war natürlich sowohl die vollständige Konvertierung vom Auswahlprozess in den Warenkorb als auch die Mikrokonvertierung nach CJ-Stufen. Und natürlich haben wir uns den durchschnittlichen Scheck angesehen. Dies sind sehr grundlegende Metriken erster Ordnung. Im Allgemeinen hat die Anzahl der überwachten Metriken mehrere Dutzend überschritten.



Benutzer-Bewertung



Neben Geschäftsmetriken waren für uns auch Loyalitätsmetriken wichtig - NPS, CSI, die wir mithilfe des UX-Feedback-Widgets messen. Das Widget liefert uns sowohl quantitative als auch qualitative Daten, die es uns ermöglichen, Informationen in Dynamik zu erhalten.



Da wir Hunderttausende von Antworten erhalten, werden alle statistischen "Ausreißer" geglättet, was die Daten ziemlich repräsentativ macht. Jetzt messen wir den CSI in jeder Phase der Customer Journey. Dies gibt auch dem Geist eine großartige Nahrung.







Wenn Sie sich diese Metriken anhand der Ergebnisse des Redesigns ansehen, sind wir je nach Abschnitt der Website um 15 bis 25% gewachsen. Dies ist wiederum eine Menge, wenn man bedenkt, dass wir Hunderttausende von Kommentaren und Bewertungen von Benutzern erhalten. Es ist sehr schwierig, diesen Indikator sogar um 5% zu erhöhen.



Technische Kennzahlen nicht vergessen







Wir haben uns die Ladegeschwindigkeit der Site genau angesehen. Es zu erhöhen war eines der Ziele der Neugestaltung. Wir haben die "Knochen" des alten Standorts neu gestaltet und nach und nach einen neuen in die Infrastruktur eingebunden. Im Rahmen des Design-Updates wurde auch die Ladegeschwindigkeit verbessert.



Im E-Commerce wirkt sich die Ladegeschwindigkeit direkt auf die wichtigsten Messdaten aus. Laut Amazon-Forschung reduzieren alle zusätzlichen 100 ms Downloads den Umsatz um 1%. Google hat ähnliche Daten - alle 500 ms wird der Datenverkehr um 20% reduziert. Wir haben auch interne Studien, in denen diese Abhängigkeit zum Ausdruck kommt.



Durov, gib die Wand zurück!



Sie können wahrscheinlich erraten, was die beliebteste Reaktion auf Updates ist? "Leg alles zurück, wie es war, dein neues, schrecklich unangenehmes." Dies wird normalerweise von 99,9% der orthodoxen Benutzer gesagt. Was auch immer Sie tun, es wird immer noch Leute geben, die das "alte Design" wollen, das ist okay. Es ist wichtig, das Feedback korrekt zu verfolgen und darauf zu reagieren.







Normalerweise erhalten Benutzer bei der Neugestaltung die Möglichkeit, zur alten Version der Site zurückzukehren. Wir haben es nicht absichtlich gemacht. Erstens waren wir zuversichtlich, dass die vorgeschlagenen Lösungen für die Kunden viel besser sind als bisher. Es ist klar, dass dies in vollem Umfang "Halluzinationen" sind, und es ist sehr schwierig, dies zu beweisen. Aber die Forschung, die Metriken, die wir gesammelt haben, haben Schritt für Schritt bestätigt, dass wir Recht hatten.



Zweitens haben wir eine Reihe technischer Änderungen vorgenommen, die dem Kunden eine bessere Benutzererfahrung bieten. Drittens haben wir uns bei der Einführung des Pilotprojekts das Feedback der Benutzer angesehen. Jede Neugestaltung ist ein Schmerz für den Kunden. Normalerweise ärgern sich viele Benutzer erneut und bitten darum, alles so zurückzugeben, wie es war. Wir haben gesehen, dass es nur sehr wenige solcher Nachrichten gab. Je weiter wir ausgerollt sind, desto mutiger wurden unsere Absichten.



Unsere Erwartungen an Metriken, die auf den Ergebnissen des Piloten basieren, waren flach, das heißt, wir wollten unter bestimmten Bedingungen in Bezug auf Metriken auf Null gehen. Die Produktmetriken am Ende des Pilotprojekts waren jedoch deutlich höher als am alten Standort, was Vertrauen in den richtigen Weg gab.



Es bestand auch das Verständnis, dass das Format, das existierende Design, unangemessen war. Und wir werden es definitiv ändern. Aus diesem Grund haben wir beschlossen, keine Rückkehr zum alten Standort anzubieten. In diesem Fall würden wir die alte Site verlassen und die Schnittstelle fertigstellen. Es war ein riskanter Schritt. Gott sei Dank mussten wir keinen Reservefallschirm benutzen.



Leichtes Müsli



Nachdem ich den dornigen Weg auf dem Weg vom alten zum neuen Standort zurückgelegt habe, möchte ich kurz kurze Thesen mit Ihnen teilen, die ich in vollem Wachstum erlebt habe.

1. Geschwindigkeit und Design der Website sind miteinander verflochten.

2. Benutzertests und Tools zum Verfolgen des sofortigen Betriebssystems von Benutzern sind der Schlüssel zum Erfolg.

3. Was auch immer Sie tun, es wird immer noch Leute geben, die das "alte Design" wollen. Dies ist normal. Sie müssen in der Lage sein, Feedback zu erhalten und zu antworten.

4. Sie müssen nicht auf einen "idealen" Zustand warten, sondern ihn ausrollen! Zumindest für einen Piloten, Experimente durchführen, dort Metriken sammeln, ist der ideale Zustand in Testumgebungen keine Garantie für das Ergebnis.

5. Nach dem "Abschluss des Redesigns" hört die Arbeit am Redesign nicht auf.

6. Metriken sind die besten Freunde des Produkts und des Teams.



Vielen Dank für Ihre Aufmerksamkeit!



ZY Wir brauchen noch coole Programmierer! Zu einem Meeting gehen!






All Articles