Customer Experience

Conversion Design Patterns

mressel
 Lesezeit: 3 Minuten    
8
arrow_down
8

Schon lange werden Webseiten und gerade E-Commerce Portale nach Patterns gestaltet. Während früher das Shopsystem das Muster weitestgehend vorgab, richtet man sich heutzutage nach Studien oder wer es sich einfach macht schaut bei der Konkurrenz oder bei erfolgreichen Shops ab.

Die Nutzererwartungen

Die Imagery III Studie von e-Result gibt ziemlich genau wieder, an welcher Stelle welches Shopelement auf der Startseite von Besuchern erwartet wird. Wer an den genauen Prozentzahlen interessiert ist, sollte sich definitiv die Studie zulegen. Für den Anfang reicht es auch sich den Großteil der gutbesuchten Shopseiten anzuschauen um ein gültiges Muster zu erkennen. Dabei sind zwei Varianten herauszukristalisieren.
Die eine Variante mit einer horizontalen Navigation…

Conversion Design Patterns (horizontale Navigation)
Conversion Design Patterns (horizontale Navigation)

…und eine Variante mit einer vertikalen Navigation.

Conversion Design Patterns (vertikale Navigation)
Conversion Design Patterns (vertikale Navigation)

Soweit so gut. Was bleibt ist viel Platz in dem der Inhalt untergebracht werden soll. Doch welcher Inhalt und wie soll dieser angeordnet werden?

Der Content-Bereich

Der Inhalt des Content-Bereichs richtet sich nach der Struktur des Shops. Handelt es sich bei dem Shop um einen Vollversender, so ist es ratsam schon viel vom Sortiment zeigen zu können und so das Interesse von einigen Besuchern zu wecken und andererseits die Größe des Sortiments wiederzuspiegeln und einen Eindruck zu vermitteln. Im Vordergrund steht hierbei die Suche, da durch die Sortimentsgröße kein wirkliches Verlangen aufkommt den Shop zu durchstöbern.
Ist der Shop hingegen ein Nischenshop, dessen Zielgruppe wesentlich deutlicher eingerenzbar ist und dessen Sortiment auf eine bestimmte Warengruppe oder Thematik begrenzt ist, können die Besucher gezielter abgefangen werden. Man kann genauer auf ihre Bedürfnisse eingehen, damit sie das Gefühl erhalten “Hier bin ich richtig” und auch emotional können die Besucher besser abgefangen werden. Hier stehen sowohl emotionale Faktoren wie große Bilderwelten und andererseits auch der beratende Service-Charakter mit Outfitvorschlägen, Themenwelten oder professioneller Beratung im Vordergrund.

Während bei einem Vollversender es schwierig ist die weitgefasste Zielgruppe emotional anzusprechen, sollte man auf große Teaser verzichten. Diese könnten den falschen Eindruck vermitteln und andere möglichen Käufer frühzeitig von der Seite vertreiben. Hingegen sollte die Größe des Sortiments hervorgehoben werden.

Vollversender (horizontale Navigation)
Vollversender (horizontale Navigation)

 

Vollversender (vertikale Navigation)
Vollversender (vertikale Navigation)

Bei einem Nieschenshop sollen die Besucher emotional abgefangen werden. Hier bieten sich große Teaser an und kleinere Teaser, die den Servicecharakter vermitteln. Darunter sollten einige Produkte und Marken folgen um die Begehrlichkeit zu steigern und das Gefühl zu vermitteln richtig aufgehoben zu sein.

Nieschenshop (horizontale Navigation)
Nieschenshop (horizontale Navigation)

 

Nieschenshop (vertikale Navigation)
Nieschenshop (vertikale Navigation)

Kein Platz mehr für Individualisierung?

Nur weil das gleiche Muster verwendet wird, muss nicht jede Seite gleich aussehen. Wie unterschiedlich Seiten mit dem gleichen Patterns aussehen können, möchte ich kurz an diesem Beispiel zeigen.

Bythreads Produktdetailsseite Conversion Design Pattern
http://www.bythreads.com/

 

Rugby Conversion Design Pattern
http://www.rugby.com/

Während beide Seiten ein relativ ähnliches Muster aufzeigen, unterscheidet sich das Design und die Zielgruppe sehr. Während das erste Design sehr clean, kalt, futuristisch und elegant wirkt, geht das zweite Design in eine andere Richtung und wirkt traditionell, warm und sportlich.
Die Zielgruppen der beiden Seiten unterscheiden sich ungemein und beide Seiten schaffen es mit dem gleichen Muster aber unterschiedlichem Design ihre jeweilige Zielgruppe richtig anzusprechen und abzufangen.

Fazit

Conversion Design Patterns können Onlineshops als Richtlinie dienen die Gewichtung und Platzierung von Inhalten richtig zu steuern. Diese Lösungsmuster müssen dabei nicht zwangsläufig die Individualität des Shops und die richtige Ansprache der Zielgruppe beschränken, sondern lassen genügend Spielraum für eine klare Ansprache der Zielgruppe.
Die Conversion Design Patterns für die Startseite ist erst der Anfang. Auch für Unterseiten wie Kategorieseite oder Produktseite lassen sich Design Patterns entwickeln, die einen Lösungsansatz für e-Commerce Portale bieten.

Über den Autor

Manuel Ressel

Principal UX Design

Manuel Ressel ist Principal UX Design bei konversionsKRAFT – Deutschlands führende Agentur für Conversion Optimierung.

Manuel Ressel beschäftigt sich seit seinem Studium der Medieninformatik mit den Themen kognitive Wahrnehmung und Verhaltensökonomie. In zahlreichen E-Commerce Projekten konnte er bei konversionsKRAFT sein Wissen weiter vertiefen. Seine Leidenschaft gilt dem Thema der Emotionalisierung von Kauf-Prozessen in E-Commerce-Portalen.

Zudem ist Manuel Ressel als Autor für Fachmedien wie t3n, Webselling und weitere Magazine gefragt.

Frage zum Artikel? Frag den Autor!

Welche Frage hast du an den Autor?

8 [contact-form-7 id="53320" title="Autorkontakt"]

8 Kommentare

  1. Gravatar

    werner_graz,

    Guter Beitrag!
    Generell unterschreibe ich aus Usability Sicht die Verwendung von Design Patterns. Erwartungshaltungen sind extrem wichtig vor allem wenn die Zielgruppe wahlweise wenig homogen oder wenig affin ist.

  2. Gravatar

    Michael Fritz,

    Schöner Artikel! Es hab letztens irgendwo einen enschlischen Blogbeitrag, der weniger detailiert und präzise ausgeführt hat und zudem noch einen 99$-Report verkaufen wollte.

  3. Gravatar

    Florian,

    Sehr informativer Artikel. Für Laien leider schwer umsetzbar, wenn es daran geht, bestehende Templates zu ändern.

  4. Gravatar

    Marcel,

    Stimme grds zu, vielleicht noch zwei Anmerkungen:

    Es ist m.E. nicht die Frage, OB die Navigation oben oder links stehen muss. Beides ist in einem Shop sinnvoll möglich, wobei die horizontale Navigation eher für hohe Hierarchieebenen gilt (Homepage z.B.) und die linke Navigation eher die Selektion der Artikel auf niedrigeren Ebenen fördert.

    Bzgl. des Contents würde ich mich nur bedingt auf Untersuchungen stützen. Die beste Methode ist immer noch die konkrete Analyse des Klickverhaltens mit beständigem Testen und Ausprobieren. Ziel sollte es sein, die Micro-Cnversion Richtung Artikel zu maximieren

  5. Gravatar

    Christian Rothe,

    Dieser Artikel fasst wichtige Layout-Grundmuster sehr schön zusammen. Auch ich bin ein Verfechter davon, sich an bekannte, dem Kunden vertraute Grundmuster zu halten. Dies macht einen Shop intuitiv und bequem bedienbar, weil der Benutzer einfach weiß, welche Content- und Bedienelemente wo platziert sind. Deshalb kann er “wie gewohnt” damit umgehen.

    Bei der Seitenaufteilung ganz neue, ungewöhnliche, abweichende Wege zu gehen, mag vielleicht manchem Gestalter vorschweben. Bei einem durchschnittlichen Benutzer würde es aber ähnlich lustige Ergebnisse produzieren, wie wenn wir bei seinem Auto die Anordnung von Gas, Bremse und Kupplung verändern.

  6. Gravatar

    Manuel Ressel,

    Hallo,

    danke für die Kommentare.

    @Florian: Für einen Laien mag es schwer sein die Shoptemplates zu ändern, aber auch der Laie muss sich für die Zukunft entscheiden, ob ein paar Bestellungen als Nebenverdienst reichen oder ob er Geld in den Shop investiert um eventuell seinen Lebensunterhalt damit zu verdienen.

    @Marcel: Ja richtig die Frage ist nicht, ob die Navigation oben oder links sitzt. Deshalb habe ich aber beide Varianten aufgezeigt, nicht dass jemand denkt, dass nur die eine Variante möglich wäre. Die Position richtet sich auch nach dem Inhalt des Shops. Gibt es z.B. viele Hauptkategorien finde ich eine vertikale Naviagtion für angebracht.
    Für den Content-Bereich halte ich eine Aufteilung wie beschrieben schon für sinnvoll. Teaser wecken Emotionen und Begehrlichkeiten, vermitteln aber auch Informationen und Sicherheit, während Produkte Preissingale setzen und eindeutig gezeigt wird, dass es sich um einen Onlineshop handelt. Den Inhalt von Teasern und Produktreihen hingegen und die genaue Positionierung muss aber tatsächlich individuell angepasst und ausgerichtet werden und immer analysiert werden.

  7. Gravatar

    Peter Stanberg : Wir leben Shops,

    Sehr schöner Beitrag. Nicht sensationell neu, aber es macht mir deutlich, dass wir durch Beobachtung, Studien und Erfahrung usnere Lösungnen genau richtig bauen. Schön, mal so eine fundierte Darstellung zu lesen.

    Ich kann Manuel nur zustimmen: Auch als Kleinanbieter sollte man sich irgendwann überlegen, ob eine überschaubare Investition nicht der einzig sinnvolle Schritt ist, um nicht nur die Conversion sondern den grundsätzlichen Eindruck des eigenen Shops zu verbessern. Ich denke dabei an die vielen vielen grausigen xtc-Shops, die man im Netz vorfindet. Wenn sich der Betrieb so wenig lohnt und man selber an den Erfolg nicht glaubt, macht es doch vielleicht eher Sinn, den Betrieb ganz einzustellen. Im anderen Fall muss man mutig das wohlkalkulierte Risiko eingehen, das angenommene Potential durch einen professionellen Auftritt auszuschöpfen.

  8. Gravatar

    Svitlana,

    Schade, dass ich diesen schönen Artikel nur jetzt gefunden habe. Trotzdem bleibt diese interessante Zusammenfassung sogar heutzutage ganz aktuell für die Onlineshops. Wie die Erfahrung unserer Webagentur Zinit Solutions zeigt, entsheidet sich die Mehrheit der Shopbetreiber eher für ein gewöhnliches Pattern und minimalistischen Design, die schon von erfolgreichen großen Onlineshops verwendet werden. Außerdem bietet die speziellen Onlineshop Software (Oxid eShop, Gambio, xtcModified)die fertiggestellte optimierte Layouts, die schon von den Kunden richtig wahrgenommen werden. Also, das System hat nur positive Wirkung.

Schreibe einen Kommentar

Teile diesen Artikel

Kostenlos anmelden