Usability im eCommerce

Der Nutzer im Mittelpunkt

Kurz zu mir

Christian Kleemann BBA Marketing / Winfo in Jena Berlin Userlutions / RapidUsertests Usability-Consultant Blogging Beatboxing & Gaming

516.000Anzahl Onlineshops in

Deutschland Quelle: Schätzung Internetworld

Folgen schlechter Usability

Interessante Produkte werden nur schwer/nicht gefunden Nutzungsabbrüche während des Kaufvorgangs

Zuwachs Nutzerzahlen bleibt hinter Potential zurück Weniger wiederkommende Besucher

Weniger Anmeldungen Geringere Umsätze

Frustration beim Kunden Mehr Supportaufwand (Telefon, Cat)

Erhöhte Kosten bei nachträglicher Behebung von Usability-Problemen

„Make it simple, but significant.“Don Draper

!!!!

Motorischen Aufwand verringern

!!!

!!!!

Lernaufwand verringern

!!!

!!!!

Wichtiges hervorheben

!!!

!!!!

Komplexität reduzieren

!!!

!!!!

Motorischen Aufwand verringern

!!!

!!!!

Lernaufwand verringern

!!!

!!!!

Wichtiges hervorheben

!!!

!!!!

Komplexität reduzieren

!!!

„Design is not just what it looks like and feels like. Design is how it works.“

MAV

Steve Jobs

Die Dauer ein Ziel zu treffen, hängt von der Distanz und der Objektgröße ab.

MAV Fitt’s Law

Fitt’s LawMAV

Wenn Elemente oft kurz nacheinander bedient werden, sollten diese dicht nebeneinander platziert werden.

Default-EinstellungenMAV

Default-EinstellungenMAV

!!!!

Motorischen Aufwand verringern

!!!

!!!!

Lernaufwand verringern

!!!

!!!!

Wichtiges hervorheben

!!!

!!!!

Komplexität reduzieren

!!!

„Make it work!“Tim Gunn

LAV

LAV Metaphern schaffen

LAV Metaphern schaffen

LAV Metaphern schaffen

LAV Metaphern schaffen

LAV Metaphern schaffen

Kill the Hamburger Icon?

zumeist ältere User (ü30) sind nicht mit dem Icon

vertraut

Die wichtigste Konsistenz ist Konsistenz mit Nutzererwartungen.

Konsistenz erzeugenLAV

Nutzer erwarten vom Call-To-Action in Slideshows eine

Weiterleitung

Die wichtigste Konsistenz ist Konsistenz mit Nutzererwartungen.

Konsistenz erzeugenLAV

Keine Weiterleitung und Anzeige des Fenstern entspricht nicht den

gängigen Erwartungen

Konventionen berücksichtigen

Quelle: eResult Imagery III Erwartungskonforme Webseitengestaltung

LAV

eResult Studie, wo Nutzer Funktionen

erwarten

Konventionen berücksichtigen

Quelle: eResult Imagery III Erwartungskonforme Webseitengestaltung

LAV

Konventionen berücksichtigenLAV

Konventionen berücksichtigenLAV

!!!!

Motorischen Aufwand verringern

!!!

!!!!

Lernaufwand verringern

!!!

!!!!

Wichtiges hervorheben

!!!

!!!!

Komplexität reduzieren

!!!

WH

„Don't just tell, show them.“Jesse Marlow

Zentrale Informationen hervorheben

WH Visuelle Hierarchie

WH Visuelle Hierarchie

WH Visuelle Hierarchie

WH Visuelle Hierarchie

WH Visuelle Hierarchie

Zentrale Informationen so hervorheben, dass sie automatisch wahrgenommen werden.

WH Salienz

Objekte so gestalten, dass dem Nutzer klar ist, wie er sie zu bedienen hat.

WH Affordance

Objekte so gestalten, dass dem Nutzer klar ist, wie er sie zu bedienen hat.

WH Affordance

!!!!

Motorischen Aufwand verringern

!!!

!!!!

Lernaufwand verringern

!!!

!!!!

Wichtiges hervorheben

!!!

!!!!

Komplexität reduzieren

!!!

KR

KR Layout-Komplexität verringern

70Empfohlene Zeichenzahl

ohne Leerzeichen für Texte pro Zeile

KR Layout-Komplexität verringern

KR Layout-Komplexität verringern

Wahrgenommene Komplexität ist abhängig von den Zeilen und Spalten des Layouts.

KR Layout-Komplexität verringern

Logisch verknüpfte Informationen werden auch visuell miteinander verknüpft.

KR Gruppierungen verwenden

sky detailseiten

KR Gruppierungen verwenden

KR Gruppierungen verwenden

KR Gruppierungen verwenden

KR Gruppierungen verwenden

KR Schrittweises enthüllen

KR Schrittweises enthüllen

KR Schrittweises enthüllen

5Schritte

Gängige Anzahl Schritte im Checkout von der

Neukundenanmeldung aus

KR Schrittweises enthüllenSchrittweises enthüllen

Quelle: Infografik Checkout Report l konversationskraft

KR Schrittweises enthüllen

KR Schrittweises enthüllen

KR Schrittweises enthüllen

KR Feedback geben

15%Quelle: Infografik Checkout Report l konversationskraft

Anzahl Shops, die nach Schritten im

Buchungsprozess Feedback gibt

KR Inneren Dialog beachten

Informationen an relevanten Punkten geben und innere Fragen abfangen.

KR Inneren Dialog beachten

Welche Informationen sind für den Nutzer von Bedeutung, wenn dieser

sich anmeldet?

KR Inneren Dialog beachten

Relevante Informationen nicht suchen lassen, sondern direkt zeigen

Konzentrieren auf wesentliche Use-Cases

KR Minimalismus

Geringe Anzahl an Features stellt Großteil

der Nutzer schon zufrieden. Auf

Kernfeatures und Usa-Cases konzentrieren

!!!!

Motorischen Aufwand verringern

!!!

!!!!

Lernaufwand verringern

!!!

!!!!

Wichtiges hervorheben

!!!

!!!!

Komplexität reduzieren

!!!

Fazit

„Gute Web-Usability speist sich nicht aus fertigen, tausendmal kopierten Konzepten, sondern

aus den richtigen Fragen, Einfühlungsvermögen und explorativem Ausprobieren.“

Christopher Möhle - Votum