Usability im eCommerce

download Usability im eCommerce

of 65

  • date post

    16-Jul-2015
  • Category

    Internet

  • view

    235
  • download

    1

Embed Size (px)

Transcript of Usability im eCommerce

  • Usability im eCommerce

    Der Nutzer im Mittelpunkt

  • Kurz zu mirChristian Kleemann BBA Marketing / Winfo in Jena Berlin Userlutions / RapidUsertests Usability-Consultant Blogging Beatboxing & Gaming

  • 516.000Anzahl Onlineshops in

    Deutschland Quelle: Schtzung Internetworld

  • Folgen schlechter Usability

    Interessante Produkte werden nur schwer/nicht gefunden Nutzungsabbrche whrend des Kaufvorgangs

    Zuwachs Nutzerzahlen bleibt hinter Potential zurck Weniger wiederkommende Besucher

    Weniger Anmeldungen Geringere Umstze

    Frustration beim Kunden Mehr Supportaufwand (Telefon, Cat)

  • Erhhte Kosten bei nachtrglicher Behebung von Usability-Problemen

  • Make it simple, but significant.Don Draper

  • !!!!

    Motorischen Aufwand verringern

    !!!

    !!!!

    Lernaufwand verringern

    !!!

    !!!!

    Wichtiges hervorheben

    !!!

    !!!!

    Komplexitt reduzieren

    !!!

  • !!!!

    Motorischen Aufwand verringern

    !!!

    !!!!

    Lernaufwand verringern

    !!!

    !!!!

    Wichtiges hervorheben

    !!!

    !!!!

    Komplexitt 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, hngt von der Distanz und der Objektgre ab.

    MAV Fitts Law

  • Fitts 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

    !!!

    !!!!

    Komplexitt 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

    gngigen Erwartungen

  • Konventionen bercksichtigen

    Quelle: eResult Imagery III Erwartungskonforme Webseitengestaltung

    LAV

    eResult Studie, wo Nutzer Funktionen

    erwarten

  • Konventionen bercksichtigen

    Quelle: eResult Imagery III Erwartungskonforme Webseitengestaltung

    LAV

  • Konventionen bercksichtigenLAV

  • Konventionen bercksichtigenLAV

  • !!!!

    Motorischen Aufwand verringern

    !!!

    !!!!

    Lernaufwand verringern

    !!!

    !!!!

    Wichtiges hervorheben

    !!!

    !!!!

    Komplexitt 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

    !!!

    !!!!

    Komplexitt reduzieren

    !!!

  • KR

  • KR Layout-Komplexitt verringern

    70Empfohlene Zeichenzahl

    ohne Leerzeichen fr Texte pro Zeile

  • KR Layout-Komplexitt verringern

  • KR Layout-Komplexitt verringern

  • Wahrgenommene Komplexitt ist abhngig von den Zeilen und Spalten des Layouts.

    KR Layout-Komplexitt verringern

  • Logisch verknpfte Informationen werden auch visuell miteinander verknpft.

    KR Gruppierungen verwenden

    sky detailseiten

  • KR Gruppierungen verwenden

  • KR Gruppierungen verwenden

  • KR Gruppierungen verwenden

  • KR Gruppierungen verwenden

  • KR Schrittweises enthllen

  • KR Schrittweises enthllen

  • KR Schrittweises enthllen

    5Schritte

    Gngige Anzahl Schritte im Checkout von der

    Neukundenanmeldung aus

  • KR Schrittweises enthllenSchrittweises enthllen

    Quelle: Infografik Checkout Report l konversationskraft

  • KR Schrittweises enthllen

  • KR Schrittweises enthllen

  • KR Schrittweises enthllen

  • 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 fr 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 Groteil

    der Nutzer schon zufrieden. Auf

    Kernfeatures und Usa-Cases konzentrieren

  • !!!!

    Motorischen Aufwand verringern

    !!!

    !!!!

    Lernaufwand verringern

    !!!

    !!!!

    Wichtiges hervorheben

    !!!

    !!!!

    Komplexitt reduzieren

    !!!

    Fazit

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

    aus den richtigen Fragen, Einfhlungsvermgen und explorativem Ausprobieren.

    Christopher Mhle - Votum