Wie Sie Onsite Produktempfehlungen mit inspirierendem Design optimieren

Wie jede andere Web-Innovation bleibt auch der Erfinder von Produktempfehlungen im E-Commerce umstritten. Amazon hat jedoch den absoluten Anspruch, mit ihren Titeln wie „Kunden, die das auch gekauft haben“ Pionierarbeit geleistet und sie zu einem integralen Bestandteil ihres eigenen (und praktisch jedes anderen) Webstores gemacht zu haben.

Dennoch hat Amazon im Laufe der Jahre ihre Herangehensweise in Bezug auf das Empfehlungs-Webdesign relativ gleich gestaltet. Horizontale und vertikale Produktblöcke, die mit Details wie Bewertungen und Rabatten gefüllt sind, werden ebenso leicht mit dem E-Commerce-Riesen in Verbindung gebracht wie das Swoosh-Logo mit Nike.

Best Practice Beispiele von reaktionsfähigem Design

Vielleicht wegen des massiven Einflusses von Amazon und der Tatsache, dass es einfach ist, ein ansprechendes Design zu erstellen, das horizontale Blöcke in einzelne Produktelemente auf mobilen Geräten zeigt, haben viele E-Commerce-Webseiten genau die gleichen Designmuster übernommen, wenn es um Empfehlungen geht: Siehe Beispiele unten von Amazon (kein Nosto-Kunde) und Best Buy (ebenfalls kein Nosto-Kunde):

Es gibt zwar noch andere Optionen, die wir anhand einiger Beispiele weiter unten betrachten werden, aber standardisierte horizontale (und vertikale) Elemente sind praktisch, und wenn sie entsprechend eingesetzt werden, können sie sehr hilfreich für Besucher sein, wie auf der Produktseite von Alex & Alexa unten (Desktop-Computer) zu sehen ist. Darunter zeigen Bestseller auf der Startseite von Tucker NYC (mobiles Gerät), was schicke New Yorker Damen derzeit einkaufen und ansehen.

Einsatz der flexiblen Onsite Produktempfehlungen von Nosto

Um die volle Flexibilität des Templating-Systems von Nosto für Onsite Produktempfehlungen zu erkunden (besonders nützlich für visuell überzeugende Modemarken), können wir uns kein intelligenteres Design-Beispiel als Finisterre vorstellen. Zum Scrollen ist es erforderlich, das Sie mit dem Daumen ein großes Produktbild verschieben können, wodurch der Produktname und der Preis als Ebene auf dem Bild sichtbar werden. Der gleiche Effekt wird auf einem Desktop erzielt, wenn man mit der Maus über das Bild fährt.

Links: Mobiles Erleben wenn man mit dem Daumen scrollt. Rechts: Desktop und schwebende Maus

Desktop-Bildschirmgrößen ab 11 Zoll erlauben viel mehr kreative Freiheit, wie das folgende Beispiele von Unif zeigen. Die Empfehlungen sind auf einem gemauerten Raster strukturiert, ein wenig wie auf Pinterest. Bei dieser Struktur macht die Mausbewegung die Empfehlung inspirierender, interaktiver und zu einem integralen Bestandteil der Seite und des Surferlebnisses.

Unten: Unif- und Empfehlungsgitter mit fünf empfohlenen Produkten

Ein Hauptvorteil des gemauerten Rasters (insbesondere für Modehändler) ist die Möglichkeit, Landing Pages durch den Einsatz vollständig personalisierter und dynamischer Empfehlungen anzupassen, die wie inspirierende Werbebanner aussehen, die sich von einem Bildschirmrand zum anderen erstrecken. Dies nutzt die Leistungsfähigkeit der KI und erzeugt automatisch eine praktisch unendliche Anzahl von Landing Pages, die jedem einzelnen Besucher die richtigen Produkte empfehlen. Während konventionelles Design durchaus relevant und angebracht ist, bevorzugen Marken, die sich von Discountern oder Fast Fashion differenzieren möchten, in der Regel einen subtileren Ansatz. Dies gilt insbesondere für wichtige Landing Pages wie die Startseite und die Kategorieseiten.

Um schließlich zu zeigen, wie Nosto-Empfehlungen in einer vertikalen Nische eingesetzt werden können, hilft Prime Loops, ein in Großbritannien ansässiges Musikgeschäft für Künstler, ihrer wichtigsten Kundengruppe von Musikproduzenten dabei, sich Trendproben und Beats direkt auf der Startseite anzuhören, indem sie in der Empfehlung direkt auf „Play“ klicken.