Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

UX Fails - Einige Tipps zur Gestaltung von Benutzungsschnittstellen

183 views

Published on

Bei der Gestaltung graphischer Benutzungsschnittellen kann jeder mitreden. Wirklich? Zumindest haben die meisten Software-Entwickler irgendwann mal eine gemacht oder machen müssen. Da Entwickler selber aber viel zu gut im Bedienen von Software sind, fehlt meist der Blick aus der Perspektive des normalen Benutzers.

Im Vortrag stelle ich einige schlimme und/oder humorvolle Fehlschläge bei der Gestaltung von Benutzungsschnittstellen vor – nicht nur Software, sondern auch Hardware betreffend. Dadurch wird klar, dass die Gestaltung von Benutzungsschnittstellen keine triviale Aufgabe ist. Ich stelle die sieben Grundsätze der Dialoggestaltung vor und wie diese umzusetzen sind. Den Abschluss bilden handfeste Regeln sowie Tipps zur Gestaltung von Dialogboxen, die der Zuhörer gleich am nächsten Tag in seiner eigenen Software verbessern kann.

Published in: Design
  • Be the first to comment

  • Be the first to like this

UX Fails - Einige Tipps zur Gestaltung von Benutzungsschnittstellen

  1. 1. 1 UX Fails Einige Tipps zur Gestaltung von Benutzungsschnittstellen Prof. Dr. Herwig Henseler henseler@phwt.de http://www.herwig-henseler.de/phwt Twitter: @herwighenseler SEROM 4.0 – 25.10.2019 – Vechta
  2. 2. 2
  3. 3. 3
  4. 4. 4
  5. 5. 5
  6. 6. 6
  7. 7. 7👍
  8. 8. 8👍👍
  9. 9. 9
  10. 10. 10 DIN EN ISO 9241-110 Sieben Grundsätze der Dialoggestaltung  Aufgabenangemessenheit  Lernförderlichkeit  Steuerbarkeit  Selbstbeschreibungsfähigkeit  Individualisierbarkeitsfähigkeit  Fehlertoleranz  Erwartungskonformität
  11. 11. 11 Aufgabenangemessenheit Ein Dialog ist aufgabenangemessen, wenn er den Benutzer unterstützt, seine Arbeitsaufgabe effektiv und effizient zu erledigen. ⇒ „Weniger ist mehr“
  12. 12. 12
  13. 13. 13
  14. 14. 14
  15. 15. 15
  16. 16. 16
  17. 17. 17 Selbstbeschreibungsfähigkeit Dem Benutzer wird deutlich gemacht, wie er sein Ziel erreicht und was er im jeweiligen Schritt tun kann ⇒ Wo bin ich? ⇒ Was kann ich hier tun? ⇒ Was ist manipulierbar und was nicht? ⇒ Wie komme ich hier wieder weg?
  18. 18. 18
  19. 19. 19
  20. 20. 20👍
  21. 21. 21
  22. 22. 22
  23. 23. 23
  24. 24. 24
  25. 25. 25 Erwartungskonformität Vergleichbare Aufgaben sollen immer auf dieselbe Weise vom Benutzer durchgeführt werden können. ⇒ RY – Repeat Yourself
  26. 26. 26
  27. 27. 27
  28. 28. 28
  29. 29. 29 Original Apple HIG (1987)
  30. 30. 30
  31. 31. 31 Literatur Human Interface Guidelines Windows: https://docs.microsoft.com/de-de/windows/uwp/design macOS: https://developer.apple.com/macos/human-interface-guidelines Android: https://material.io iOS: https://developer.apple.com/ios/human-interface-guidelines Gnome: https://developer.gnome.org/hig KDE: https://hig.kde.org ...
  32. 32. 32 Irgendwas ist passiert und Sie müssen OK klicken, damit es weitergeht! Langweilige Beschreibung, die das obige wiederholt und keine neue Information liefert, sondern stattdessen eher Verwirrung stiftet und bis zum Ende liest doch sowieso keiner, denn Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore. Zeige Technikgefasel ... Verstehe ich nicht Das auch nicht keine Ahnung ... OKFALSCH Irgendein Programmname
  33. 33. 33
  34. 34. 34
  35. 35. 35
  36. 36. 36
  37. 37. 37
  38. 38. 38
  39. 39. 39 Merke #1 Kein Benutzer möchte einen Dialog lesen müssen. Niemand. ⇒ Niemals Buttons mit Ja/Nein beschriften
  40. 40. 40
  41. 41. 41
  42. 42. 42
  43. 43. 43
  44. 44. 44
  45. 45. 45
  46. 46. 46 Merke #2 Dialogfenster und Buttons haben eine Mindest- und Maximalbreite ⇒ OK gleichbreit wie Abbrechen.
  47. 47. 47
  48. 48. 48 Merke #3 Groß- und Kleinschreibung ⇒ OK heißt OK und nicht Ok ⇒ Abbrechen heißt Abbrechen und nicht abbrechen
  49. 49. 49👍
  50. 50. 50👍
  51. 51. 51
  52. 52. 52
  53. 53. 53
  54. 54. 54 Die korrekte Reihenfolge von Buttons Windows: OK | Cancel | Secondary macOS, iOS, iPadOS, Android, Linux: Secondary –– Cancel | OK
  55. 55. 55 Windows: ... aber seit Windows 8 auch häufiger Cancel | OK
  56. 56. 56 Merke #4 An die vorgeschriebene Reihenfolge der Buttons halten
  57. 57. 57
  58. 58. 58
  59. 59. 59👍
  60. 60. 60 Merke #5 Beschrifte Buttons mit der Aktion, die sie auslösen ⇒ Vermeide OK und Abbrechen ⇒ Sorgfältige Wortwahl
  61. 61. 61👍
  62. 62. 62 Merke #6 Default-Button = DWIM („Do what I mean“) ⇒ Nur, wenn es nicht destruktiv ist! ⇒ ESC bricht einen Dialog ab. ⇒ Buttons werden beim loslassen ausgelöst
  63. 63. 63
  64. 64. 64
  65. 65. 65 Merke #7 Buttons sind Buttons ⇒ Buttons sind keine Checkboxen ⇒ Buttons sind keine Fortschrittsbalken
  66. 66. 66
  67. 67. 67
  68. 68. 68 Merke #8 Dialoge sind keine Denksportaufgaben ⇒ Niemand interessiert sich für technische Fehlerbeschreibungen ⇒ Inhalte müssen selektierbar sein
  69. 69. 69 Illegal An illegal choice has been detected
  70. 70. 70
  71. 71. 71 Merke #9 Negative Formulierungen vermeiden
  72. 72. 72
  73. 73. 73 Merke #10 Konsistente Begriffe verwenden
  74. 74. 74 Die unsinnigste Dialogbox der Welt
  75. 75. 75👎
  76. 76. 76 (BONUS)
  77. 77. 77
  78. 78. 78 Merke (BONUS) Verzichten sie möglichst auf „Speichern“ Beenden jederzeit ohne Nachfragen möglich Automatisch zuletzt geöffnete Dokumente an gleicher Stelle Unbegrenztes undo/redo ist kein Hexenwerk
  79. 79. 79 MS Office  Öffnet nicht das letzte Dokument  Inkonsistenz beim öffnen in Word/PowerPoint
  80. 80. 80 Literatur Heinecke, A. M. (2011): Mensch-Computer-Interaktion: Basiswissen für Entwickler und Gestalter, X.media.press ...
  81. 81. 81 Literatur Jacobsen, J. et al. (2017): Praxisbuch Usability und UX: Was jeder wissen sollte, der Websites und Apps entwickelt - bewährte Usability- und UX- Methoden praxisnah erklärt, Rheinwerk Computing ...
  82. 82. 82 https://cantunsee.space
  83. 83. 83 „Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzuzufügen gibt, sondern wenn man nichts mehr weglassen kann.“ – Antoine de Saint-Exupéry
  84. 84. 84

×