Usability im eCommerce

957 Aufrufe

Veröffentlicht am

Usability Basics im eCommerce

Praxisbeispiele und Grundregeln für eine nutzerfreundliche Website-Gestaltung. Vorgetragen auf dem eCommerce Camp Jena 03/2015

Viele der Beispiele sind Untersuchungen aus meinen Nutzeranalysen bei userlutions.com unter Verwendung unseres Crowd-Testing-Tools rapidusertests.com

Ich habe die Folien mit ein paar Comments für mehr Input versehen. Bei Fragen könnt ihr mir auch gerne schreiben :)

Veröffentlicht in: Internet
0 Kommentare
2 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

Keine Downloads
Aufrufe
Aufrufe insgesamt
957
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
34
Aktionen
Geteilt
0
Downloads
9
Kommentare
0
Gefällt mir
2
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

Usability im eCommerce

  1. 1. Usability im eCommerce Der Nutzer im Mittelpunkt
  2. 2. Kurz zu mir Christian Kleemann BBA Marketing / Winfo in Jena Berlin Userlutions / RapidUsertests Usability-Consultant Blogging Beatboxing & Gaming
  3. 3. 516.000 Anzahl Onlineshops in Deutschland Quelle: Schätzung Internetworld
  4. 4. 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)
  5. 5. Erhöhte Kosten bei nachträglicher Behebung von Usability-Problemen
  6. 6. „Make it simple, but significant.“ Don Draper
  7. 7. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexität reduzieren ! ! !
  8. 8. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexität reduzieren ! ! !
  9. 9. „Design is not just what it looks like and feels like. Design is how it works.“ MAV Steve Jobs
  10. 10. Die Dauer ein Ziel zu treffen, hängt von der Distanz und der Objektgröße ab. MAV Fitt’s Law
  11. 11. Fitt’s LawMAV Wenn Elemente oft kurz nacheinander bedient werden, sollten diese dicht nebeneinander platziert werden.
  12. 12. Default-EinstellungenMAV
  13. 13. Default-EinstellungenMAV
  14. 14. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexität reduzieren ! ! !
  15. 15. „Make it work!“ Tim Gunn LAV
  16. 16. LAV Metaphern schaffen
  17. 17. LAV Metaphern schaffen
  18. 18. LAV Metaphern schaffen
  19. 19. LAV Metaphern schaffen
  20. 20. LAV Metaphern schaffen Kill the Hamburger Icon? zumeist ältere User (ü30) sind nicht mit dem Icon vertraut
  21. 21. Die wichtigste Konsistenz ist Konsistenz mit Nutzererwartungen. Konsistenz erzeugenLAV Nutzer erwarten vom Call-To-Action in Slideshows eine Weiterleitung
  22. 22. Die wichtigste Konsistenz ist Konsistenz mit Nutzererwartungen. Konsistenz erzeugenLAV Keine Weiterleitung und Anzeige des Fenstern entspricht nicht den gängigen Erwartungen
  23. 23. Konventionen berücksichtigen Quelle: eResult Imagery III Erwartungskonforme Webseitengestaltung LAV eResult Studie, wo Nutzer Funktionen erwarten
  24. 24. Konventionen berücksichtigen Quelle: eResult Imagery III Erwartungskonforme Webseitengestaltung LAV
  25. 25. Konventionen berücksichtigenLAV
  26. 26. Konventionen berücksichtigenLAV
  27. 27. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexität reduzieren ! ! !
  28. 28. WH „Don't just tell, show them.“Jesse Marlow
  29. 29. Zentrale Informationen hervorheben WH Visuelle Hierarchie
  30. 30. WH Visuelle Hierarchie
  31. 31. WH Visuelle Hierarchie
  32. 32. WH Visuelle Hierarchie
  33. 33. WH Visuelle Hierarchie
  34. 34. Zentrale Informationen so hervorheben, dass sie automatisch wahrgenommen werden. WH Salienz
  35. 35. Objekte so gestalten, dass dem Nutzer klar ist, wie er sie zu bedienen hat. WH Affordance
  36. 36. Objekte so gestalten, dass dem Nutzer klar ist, wie er sie zu bedienen hat. WH Affordance
  37. 37. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexität reduzieren ! ! !
  38. 38. KR
  39. 39. KR Layout-Komplexität verringern 70Empfohlene Zeichenzahl ohne Leerzeichen für Texte pro Zeile
  40. 40. KR Layout-Komplexität verringern
  41. 41. KR Layout-Komplexität verringern
  42. 42. Wahrgenommene Komplexität ist abhängig von den Zeilen und Spalten des Layouts. KR Layout-Komplexität verringern
  43. 43. Logisch verknüpfte Informationen werden auch visuell miteinander verknüpft. KR Gruppierungen verwenden sky detailseiten
  44. 44. KR Gruppierungen verwenden
  45. 45. KR Gruppierungen verwenden
  46. 46. KR Gruppierungen verwenden
  47. 47. KR Gruppierungen verwenden
  48. 48. KR Schrittweises enthüllen
  49. 49. KR Schrittweises enthüllen
  50. 50. KR Schrittweises enthüllen 5Schritte Gängige Anzahl Schritte im Checkout von der Neukundenanmeldung aus
  51. 51. KR Schrittweises enthüllenSchrittweises enthüllen Quelle: Infografik Checkout Report l konversationskraft
  52. 52. KR Schrittweises enthüllen
  53. 53. KR Schrittweises enthüllen
  54. 54. KR Schrittweises enthüllen
  55. 55. KR Feedback geben 15% Quelle: Infografik Checkout Report l konversationskraft Anzahl Shops, die nach Schritten im Buchungsprozess Feedback gibt
  56. 56. KR Inneren Dialog beachten Informationen an relevanten Punkten geben und innere Fragen abfangen.
  57. 57. KR Inneren Dialog beachten Welche Informationen sind für den Nutzer von Bedeutung, wenn dieser sich anmeldet?
  58. 58. KR Inneren Dialog beachten Relevante Informationen nicht suchen lassen, sondern direkt zeigen
  59. 59. Konzentrieren auf wesentliche Use-Cases KR Minimalismus Geringe Anzahl an Features stellt Großteil der Nutzer schon zufrieden. Auf Kernfeatures und Usa- Cases konzentrieren
  60. 60. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexität reduzieren ! ! ! Fazit
  61. 61. „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

×