Typo3 Barcamp Usability Gesetze

  • Published on
    07-Aug-2015

  • View
    352

  • Download
    4

Embed Size (px)

Transcript

<ol><li> 1. Warum Usability? Einfache Nutzerfhrung an Praxisbeispielen </li><li> 2. Kurz zu mir - Hi ich bin Chris! Christian Kleemann BBA Marketing / Winfo in Jena Berlin Userlutions / RapidUsertests Usability-Consultant Blogging Beatboxing &amp; Gaming </li><li> 3. Folgen schlechter Usability </li><li> 4. 250 Mitarbeiter 27 Masken 220 Tage 18 Stunde </li><li> 5. Was passiert bei 10 Sekunden Zeitersparnis pro Maske? </li><li> 6. 74.000 </li><li> 7. Erhhte Kosten bei nachtrglicher Behebung von Usability-Problemen </li><li> 8. 516.000 </li><li> 9. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexitt reduzieren ! ! ! </li><li> 10. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexitt reduzieren ! ! ! </li><li> 11. Make it simple, but signicant. Don Draper MAV </li><li> 12. Die Dauer ein Ziel zu treffen, hngt von der Distanz und der Objektgre ab. MAV Fitts Law </li><li> 13. Fitts LawMAV Wenn Elemente oft kurz nacheinander bedient werden, sollten diese dicht nebeneinander platziert werden. </li><li> 14. Hohe Nutzungsqualitt zeigt sich wenig an der Oberche einer Software? </li><li> 15. Hohe Nutzungsqualitt zeigt sich wenig an der Oberche einer Software! </li><li> 16. Default-EinstellungenMAV </li><li> 17. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexitt reduzieren ! ! ! </li><li> 18. Make it work! Tim Gunn LAV </li><li> 19. LAV Metaphern schaffen </li><li> 20. LAV Metaphern schaffen </li><li> 21. LAV Metaphern schaffen Kill the Hamburger Icon? </li><li> 22. Die wichtigste Konsistenz ist Konsistenz mit Nutzererwartungen. Konsistenz erzeugenLAV </li><li> 23. Was erwartet Ihr? Konsistenz erzeugenLAV </li><li> 24. Die wichtigste Konsistenz ist Konsistenz mit Nutzererwartungen! Konsistenz erzeugenLAV </li><li> 25. Die wichtigste Konsistenz ist Konsistenz mit Nutzererwartungen. Konsistenz erzeugenLAV </li><li> 26. Existierende Methodensets/ Konventionen nutzen. Konsistenz erzeugenLAV </li><li> 27. Konventionen bercksichtigen Quelle: eResult Imagery III Erwartungskonforme Webseitengestaltung LAV </li><li> 28. Konventionen leben Quelle: eResult Imagery VI Erwartungskonforme Webseitengestaltung LAV </li><li> 29. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexitt reduzieren ! ! ! </li><li> 30. WH Don't just tell, show them.Jesse Marlow </li><li> 31. WH Visuelle Hierarchie Zentrale Informationen hervorheben </li><li> 32. Zentrale Informationen so hervorheben, dass sie automatisch wahrgenommen werden. WH Salienz </li><li> 33. Aufmerksamkeitsverteilung am Bildschirm WH 40% 25% 20% 15% Salienz </li><li> 34. Zentrale Informationen so hervorheben, dass sie automatisch wahrgenommen werden. WH Salienz </li><li> 35. Objekte so gestalten, dass dem Nutzer klar ist, wie er sie zu bedienen hat. WH Affordance </li><li> 36. Objekte so gestalten, dass dem Nutzer klar ist, wie er sie zu bedienen hat. WH Affordance </li><li> 37. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexitt reduzieren ! ! ! </li><li> 38. KR </li><li> 39. KR Layout-Komplexitt verringern 70 </li><li> 40. KR Layout-Komplexitt verringern </li><li> 41. KR Layout-Komplexitt verringern </li><li> 42. Wahrgenommene Komplexitt ist abhngig von den Zeilen und Spalten des Layouts. KR Layout-Komplexitt verringern </li><li> 43. KR Layout-Komplexitt verringern </li><li> 44. KR Gruppierungen verwenden </li><li> 45. KR Gruppierungen verwenden </li><li> 46. KR Gruppierungen verwenden </li><li> 47. KR Gruppierungen verwenden </li><li> 48. KR Schrittweises enthllen </li><li> 49. KR Schrittweises enthllen 5Schritte </li><li> 50. KR Schrittweises enthllenSchrittweises enthllen Quelle: Infograk Checkout Report l konversationskraft </li><li> 51. KR Schrittweises enthllen </li><li> 52. KR Schrittweises enthllen </li><li> 53. KR Feedback geben 15% Quelle: Infograk Checkout Report l konversationskraft </li><li> 54. KR Feedback geben - Passworteingabe </li><li> 55. KR Feedback geben - Passworteingabe </li><li> 56. KR Usabilityguy ! Feedback geben - Passworteingabe </li><li> 57. KR Usabilityguy Fehlermeldung: Das Passwort muss mindestens 1 Zahl enthalten Feedback geben - Passworteingabe </li><li> 58. KR Usabilityguy1 ! Feedback geben - Passworteingabe </li><li> 59. KR Usabilityguy1 Fehlermeldung: Das Passwort muss mindestens 1 Sonderzeichen enthalten. Feedback geben - Passworteingabe </li><li> 60. KR Usabilityguy1%! ! Feedback geben - Passworteingabe </li><li> 61. KR Usabilityguy1%! Fehlermeldung: Keine Leerzeichen oder % oder ~ &lt; &gt;; Feedback geben - Passworteingabe </li><li> 62. KR Usabilityguy123!!! ! Feedback geben - Passworteingabe </li><li> 63. KR ! Usabilityguy123!!! Fehlermeldung: Das Passwort darf keine aufsteigende oder absteigende Buchstaben- bzw. Zahlenfolge enthalten. Feedback geben - Passworteingabe Quelle: Usability in Germany l www.mint.com </li><li> 64. KR Feedback geben - Passworteingabe Regeln anzeigen Eingaben anzeigen Strkemesser anzeigen </li><li> 65. Konzentrieren auf wesentliche Use-Cases KR Minimalismus </li><li> 66. ! ! ! ! Motorischen Aufwand verringern ! ! ! ! ! ! ! Lernaufwand verringern ! ! ! ! ! ! ! Wichtiges hervorheben ! ! ! ! ! ! ! Komplexitt reduzieren ! ! ! Fazit </li><li> 67. Gute Usability entsteht durch die richtigen Fragen, Einfhlungsvermgen und explorativem Ausprobieren. Christopher Mhle - Votum </li></ol>