$30 off During Our Annual Pro Sale. View Details »

Interface Design – Best Practices (German)

Interface Design – Best Practices (German)

Stefan Nitzsche

April 29, 2009
Tweet

Other Decks in Design

Transcript

  1. None
  2. WARUM? Menschen lieben gute Interfaces

  3. STUDIE Gute Interfaces erobern Märkte 1% 4% 6% 6% 11%

    22% 50% iPhone OS RIM OS Windows Mobile OS Palm OS Android Hiptop OS Symbian OS Quelle: admob
  4. INTERFACE Ding 1 Ding 2 Schnittstelle Mensch Grafik Computer Bedürfnis

    Schnittstelle Befriedigung
  5. WARUM GIBT ES SO VIELE MITTELMÄSSIGE SCHNITTSTELLEN?

  6. „Natürlich können Sie dem Luftfahrt- ministerium ein Flugzeug mit allen

    gewünschten Eigenschaften bauen – solange Sie nicht zwingend voraus- setzen, dass es dann auch fliegt.“ Willy Messerschmitt Flugzeugkonstrukteur (1898-1978) 1958, Deutsches Bundesarchiv Bild 146-1969-169-19
  7. MENTALE MODELLE

  8. Kann man sich vorstellen, dass ein Designer einem Benutzer erklärt,

    wie der Programmierer die Idee des Kunden umgesetzt hat, die ihm vom Konzepter beschrieben wurde?
  9. DING 1: MENSCH Die grobe Konfiguration ist in den meisten

    Fällen identisch, aber nicht immer gleich leistungsfähig (Motorik, Sensorik) Gewohnheiten Erfahrungen Kulturelle Prägungen Vorkenntnisse
  10. DING 2: COMPUTER Bildschirm, Maus, Tastatur Ausgabe: Auflösung, Farbtiefe, Schärfe,

    Kontrast Eingabe: Sprache, Tastenanzahl, Genauigkeit Architektur, Datenformate, Vernetzung, Abhängigkeiten
  11. None
  12. DER INTERFACE DESIGNER

  13. Wer glaubt, die Gestaltung einer Schnittstelle erfordere die alleinige Kenntnis

    von Ding 1 oder Ding 2?
  14. Um eine Schnittstelle zu gestalten, muss man alle relevanten Informationen

    über beide Seiten besitzen!
  15. KENNTNISSE EINES INTERFACE DESIGNERS Gestaltung Heuristik Psychologie Archivierung Medientheorie Informatik

    Soziologie
  16. Das Interface ist das Produkt, soweit der Nutzer das beurteilen

    kann.
  17. TOLERANZ UND MOTIVATION Je komplexer das Interface, desto weniger Toleranz.

    Je stärker die Motivation, desto unwichtiger die Komplexität.
  18. BEISPIEL 1 Starkes Bedürfnis Eindeutige, sichere Befriedigung Qualität des Interface

    ist absolut nachrangig
  19. None
  20. BEISPIEL II Starkes Bedürfnis Eindeutige, sichere Befriedigung Erforschung des Interface

    ist das Ziel
  21. None
  22. MÖGLICHKEIT 1 Man ist in der Lage, perfekte, bahnbrechende Schnittstellen

    zu gestalten.
  23. MÖGLICHKEIT 2 Man ist nicht in der Lage, perfekte, bahnbrechende

    Schnittstellen zu gestalten.
  24. BEST PRACTICES

  25. ANTIZIPATION Zielgruppe kennen Relevante Werkzeuge geben Relevante Informationen geben

  26. None
  27. VERTRAUTHEIT Kognitiven Aufwand reduzieren Eine vertraute Umgebung schaffen

  28. None
  29. EINFACHHEIT Nicht zu viele Entscheidungen Nicht zu viele Angebote Jedes

    Element der Anwendung, das nicht hilfreich ist, unbarmherzig eliminieren!
  30. WAS ANBIETER WOLLEN:

  31. WAS NUTZER WOLLEN:

  32. None
  33. WAS DESIGNER WOLLEN:

  34. WAS KUNDEN WOLLEN:

  35. None
  36. VERFÜGBARKEIT Das Interface muss ständig verfügbar sein Die Ladezeit muss

    im Verhältnis zum Ergebnis stehen Sagt man dem Nutzer, was ihn erwartet, ist er bereit zu warten
  37. None
  38. MODUS Der Nutzer muss jederzeit wissen, in welchem Modus das

    System sich befindet Der Verzicht auf Modi ist der Erlernbarkeit eines Interface stark zuträglich
  39. http://www.flickr.com/photos/lincolnose2/2317699857/

  40. FEHLERTOLERANZ Machen Sie Aktionen umkehrbar Erlauben Sie immer „Rückgängig“ Bieten

    Sie immer einen Ausweg Stellen Sie sicher, dass Benutzer niemals ihre Arbeit verlieren Menschen in fehlerintoleranter Umgebung machen nicht mehr Fehler als in einer fehlertoleranten Umgebung, sie arbeiten nur wesentlich langsamer (sorgfältiger), um Fehler zu vermeiden
  41. None
  42. None
  43. KONSISTENZ Einen stabilen Rahmen bieten (Styleguide) Geregelte Konsistenz wenn Dinge

    gleich sind Geregelte Inkonsistenz wenn Dinge unterschiedlich sind
  44. None
  45. None
  46. None
  47. STATUS Der Status eines Systems muss auf den ersten Blick

    ersichtlich sein Browserbasierte Produkte existieren zunächst in einer zustandslosen Umgebung Benutzern sollte es ermöglicht werden, sich im Büro auszuloggen, nach Hause gehen und genau dort fortfahren zu können, wo sie aufgehört haben
  48. None
  49. None
  50. AUTONOMIE Der Benutzer sollte das Interface kontrollieren, nicht das Interface

    den Benutzer Zu wenig Freiheit schränkt ebenso ein wie zuviel Freiheit Im gleichen Interface immer mehrere Wege zu einem Ziel anbieten (Navigation, Button, Tastenkombination)
  51. METAPHERN Metaphern aktivieren Sinne: Sehen, Hören, Berührung Metaphern müssen angemessen

    sein und zur Aufgabe des Nutzers passen Implizite/Explizite Handlungsaufforderung (Button) Erforschbarkeit (entsteht aus Gewohnheiten)
  52. None
  53. None
  54. None
  55. None
  56. None
  57. None
  58. None
  59. None
  60. None
  61. None
  62. ICONS Icons sind nicht immer die beste Lösung Icons sollten

    nicht alleine stehen, ohne Beschriftung Tooltips ersetzen nicht die Beschriftung Icons brauchen zeitgemäße Metaphern Icons müssen abstrahieren
  63. None
  64. None
  65. None
  66. None
  67. None
  68. EFFIZIENTE NUTZUNG Informationen dort anzeigen, wo sie benötigt werden Alle

    relevanten Informationen müssen dargestellt werden Nutzer sollen erkennen statt erinnern
  69. None
  70. None
  71. BESCHÄFTIGUNG Wartezeiten lösen stressähnliche Reaktionen aus Vortäuschung von Aktivität macht

    Wartezeiten nachweisbar erträglicher Alle Klicks auf Schaltflächen binnen 50 Millisekunden durch sicht- oder hörbares Feedback bestätigen Alles, was länger als 2–3 Sekunden dauert, sollte mit einer Ladeanzeige (Spinner, Balken) ausgestattet werden Restzeit oder Fortschritt angeben, wenn möglich!
  72. ÄSTHETIK Content is King Dezente Farben bevorzugen Zurückhaltende Animationen Klare

    Struktur
  73. DIALOGE/SPRACHE Dialoge müssen verständlich sein Orthografie und Grammatik sind wichtig

    Prozesse müssen verständlich sein Gute, knappe Hilfetexte Konsistente Benennung Verzicht auf Fachbegriffe oder technische Termini
  74. None
  75. None
  76. None
  77. None
  78. None
  79. None
  80. None
  81. None
  82. FITTS‘ GESETZ Die Dauer, ein Ziel zu treffen, ist abhängig

    von der Distanz zum Ziel und der Zielgröße Ergebnis: die Menü-Umsetzung unter Mac OS X ist fünfmal schneller bedienbar als die Menü-Umsetzung unter Windows Große Schaltflächen für wichtige Funktionen verwenden
  83. None
  84. None
  85. INTERFACE RE-DESIGN Behutsam sein! Vorsicht walten lassen! Vorteil nutzen: man

    weiss, womit der Nutzer vertraut ist! Nicht alles, was neu ist, ist besser
  86. None
  87. None
  88. None
  89. None
  90. None
  91. None
  92. VIELEN DANK! Webseite: http://nitzsche.info/ E-Mail: stefan@nitzsche.info Twitter: stn1978