Transcript MCK-08-Gestaltungsgrundsaetze

TFH Berlin
MCK - 8- Gestaltungsgrundsätze für
Dialoge
 Die DIN EN ISO 9241-110
Sheidermans "Goldene Regeln"
TFH Berlin
© Ilse Schmiedecke 2008
Richtlinien und Normen im Interaktionsentwurf
TFH Berlin
 Normen sind Industriestandards mit den Hauptzielen
– effektive Produktion durch Standardmaße
gesicherte Verfügbarkeit von Teilen und Werkzeugen,
Passgenauigkeit von Halbzeugen
– Sicherheit und Qualität der Produkte durch Güteklassen
Wärmefestigkeit von Werkstoffen, Festigkeit von Schrauben, Belastbarkeit
von Schaltkreisen, ...
– Gesichertes Wissen über Stoffe und Gegenstände
abrufbare Fakten
 Ergonomienormen sollen den arbeitenden Menschen schützen
– vor Gesundheitsschäden
– aufgrund von Fehlhaltung, einseitige Belastung,
Überlastung
– aufgrund von Lärm, Hitze, Kälte und Strahlung
© schmiedecke 10
MCK
2
DIN-EN-ISO 9241:
Ergonomie der Mensch-System-Interaktion

TFH Berlin
Titel bis 2006:
Ergonomische Anforderungen für
Bürotätigkeiten mit Bildschirmgeräten
(kurz: Bildschirmarbeitsplatz-Verordnung, BSchAVo)

heute 28 Teile,
Interaktionsergonomie für Hard- und Software
•
•
•
•
•
•
•
•
•
Teil
Teil
Teil
Teil
Teil
Teil
Teil
Teil
Teil
© schmiedecke 10
1:
2:
3:
4:
5:
6:
7:
8:
9:
Allgemeine Einführung
Anforderungen an die Arbeitsaufgaben - Leitsätze
Anforderungen an visuelle Anzeigen
Anforderungen an Tastaturen
Anforderungen an die Arbeitsplatzgestaltung und Körperhaltung
Anforderungen an die Arbeitsumgebung
Anforderungen an visuelle Anzeigen bezüglich Reflexionen
Anforderungen an Farbdarstellungen
Anforderungen an Eingabegeräte - außer Tastaturen
MCK
3
DIN-EN-ISO 9241:
Ergonomie der Mensch-System-Interaktion
TFH Berlin
•
•
•
•
•
•
•
•
•
Teil 110: Grundsätze der Dialoggestaltung
Teil 11: Anforderungen an die Gebrauchstauglichkeit - Leitsätze
Teil 12: Informationsdarstellung
Teil 13: Benutzerführung
Teil 14: Dialogführung mittels Menüs
Teil 15: Dialogführung mittels Kommandosprachen
Teil 16: Dialogführung mittels direkter Manipulation
Teil 17: Dialogführung mittels Bildschirmformularen
Teil 151: Leitlinien zur Gestaltung von Benutzungsschnittstellen für das
World Wide Web (zurzeit im Entwurfsstadium)
• Teil 171: Leitlinien für die Zugänglichkeit von Software (zurzeit im
Entwurfsstadium)
© schmiedecke 10
MCK
4
DIN-EN-ISO 9241:
Ergonomie der Mensch-System-Interaktion
TFH Berlin
• Teil 300: Einführung in Anforderungen und Messtechniken für elektronische
optische Anzeigen
• Teil 302: Terminologie für elektronische optische Anzeigen (zurzeit im
Entwurfsstadium)
• Teil 303: Anforderungen an elektronische optische Anzeigen (zurzeit im
Entwurfsstadium)
• Teil 304: Prüfverfahren zur Benutzerleistung
• Teil 305: Optische Laborprüfverfahren für elektronische optische Anzeigen
(zurzeit im Entwurfsstadium)
• Teil 306: Vor-Ort-Bewertungsverfahren für elektronische optische Anzeigen
(zurzeit im Entwurfsstadium)
• Teil 307: Analyse und Konformitätsverfahren für elektronische optische
Anzeigen (zurzeit im Entwurfsstadium)
• Teil 400: Grundsätze und Anforderungen für physikalische Eingabegeräte
• Teil 410: Gestaltungskriterien für physikalische Eingabegeräte (zurzeit im
Entwurfsstadium)
© schmiedecke 10
MCK
5
Die normative Kraft der Norm
TFH Berlin
 Ist das eine Norm?
– Normwerte vor allem im Dialogbereich (110-17)
nicht präzise messbar
– damit nicht erzwingbar und garantierbar
 Der Softwareteil nennt sich Gestaltungsempfehlung
–
–
–
–
–
–
Kompetenzsammlung
internationaler Konsens
didaktischer Aufbau
enthält ein durchgehendes Beispiel!
normierendes Lehrwerk
(muss leider käuflich erworben werden!)
 Framework
– setzt die Teile in Beziehung zueinander
– strukturiert die Fortentwicklung
© schmiedecke 10
MCK
6
Das Framework zur EN 9241
© schmiedecke 10
MCK
TFH Berlin
7
EN 9241-11
Gebrauchstauglichkeit

TFH Berlin
engl. Usability
 Parameter:
– Effektivität
– Effizienz
– Zufriedenheit

Bezug:
– Nutzungskontext

Aspekte:
–
–
–
–
Visuelle Gestaltung
Orientierung
Inhalt
Technische Ausführung
© schmiedecke 10
MCK
8
EN 9241 – 110
Grundsätze der Dialoggestaltung


TFH Berlin
Neuer Anwendungsbereich "Interaktive Systeme"
Neue Definition Benutzungsschnittstelle:
"Alle Bestandteile eines interaktiven Systems (Software oder Hardware), die
Informationen und Steuerelemente zur Verfügung stellen, die für den Benutzer
notwendig sind, um eine bestimmte Arbeitsaufgabe
mit dem interaktiven System zu erledigen."

"Alte" Dialogkriterienliste
– aber weiter präzisiert
1.
2.
3.
4.
5.
6.
7.
© schmiedecke 10
Aufgabenangemessenheit
Selbstbeschreibungsfähigkeit
Steuerbarkeit
Erwartungskonformität
Fehlertoleranz
Individualisierbarkeit
Lernförderlichkeit
MCK
9
9241-110
Aufgabenangemessenheit
TFH Berlin
"Ein Dialog ist aufgabenangemessen, wenn er den Benutzer darin
unterstützt, seine Arbeitsaufgbe effektiv und effizient zu
erledigen."
–
–
–
–
–
–
–
–
–
–
keine unnötigen Pflichtangaben im Formular
geeignet vorausgewählte Knöpfe und Auswahlen
Auto-Vervollständigen
Minimale Ladezeit für Grafiken
Bei Eingabefehlern Cursor an der zu korrigierenden Stelle
Erhalt der Einträge bei Such- oder Auswahldialogen
Erhalt der Zwischenergebnisse während Online-Transaktion
Shortcuts zu den wichtigsten Aktionen
Fachgerechte Eingabeformate und Feedbacks
keine nicht fachlich begründeten Aktionen (interne Aufgaben,
Bedienungsaufgaben)
© schmiedecke 10
MCK
10
Aufgabenangemessenheit
Negativbeispiel
TFH Berlin
 die Reihenfolge der
Formularfelder
widerspricht der
Erfassung und Benutzung
als Postadresse
 Führt zu vermeidbaren
Fehlern
Quelle: fit-for-usability.de
© schmiedecke 10
MCK
11
9241-110
Selbstbeschreibungsfähigkeit
TFH Berlin
 "Ein Dialog ist selbstbeschreibungsfähig, wenn jeder einzelne
Dialogschritt durch Rückmeldung des Dialogsystems unmittelbar
verständlich ist oder dem Benutzer auf Anfrage erklärt wird."
– Hilfesystem mit Suchfunktion
– Einführungen / Tutorials
– Icons, Menüpunkte und Kommandos im Fachkontext unmittelbar
(intuitiv) verstehbar, oder Hilfe direkt angeboten (Tool-Tip-Text.
kontextsensitive Hilfe)
– Ziele von Links vorhersagbar formuliert
– Erläuternde Links zu komplizierten Fehlermeldungen
– Feedback bei länger dauernden Operationen
– Status verborgener Information erkennbar oder abrufbar
(z.B.Umfang einer Treffer-Liste am Tabellenanfang ablesbar)
© schmiedecke 10
MCK
12
Selbstbeschreibungsfähigkeit
Beispiele
TFH Berlin
 Meldung statt Sanduhr
 Direkthilfe
 Tooltip-Text
(Kurzhilfe)
© schmiedecke 10
MCK
13
Selbstbeschreibungsfähigkeit
Negativbeispiele
TFH Berlin
 Formular:
– Angabe zum
Datumsformat
fehlt

DHL-Website:
- Links nicht erkennbar
© schmiedecke 10
MCK
14
9241-110
Steuerbarkeit
TFH Berlin
 "Ein Dialog ist steuerbar, wenn der Benutzer in der
Lage ist, den Dialogablauf zu starten sowie seine
Richtung und Geschwindigkeit zu beeinflussen, bis das
Ziel erreicht ist."
–
–
–
–
–
–
–
–
Dialogteile in unabhägigen, frei ansteuerbaren Fenstern
Freie Wahl zwischen verschiedenen Ein- und Ausgabegeräten
Konfigurierung der Anzeige von Ein- und Ausgabedaten
Tastensteuerung als Alternative zur Maus
Unterbrechen und Wiederaufnehmen des Dialogs
Freie Wahl zwischen alternativen Arbeitswegen
Beliebig lange Reaktionszeit auf modale Dialoge
Rücksetzmöglichkeit für alle Interaktionen
© schmiedecke 10
MCK
15
Steuerbarkeit
Beispiele
TFH Berlin
 unabhängige Fenster
 freie Navigation
© schmiedecke 10
MCK
16
9241-110
Erwartungskonformität
TFH Berlin
 "Ein Dialog ist erwartungskonform, wenn er konsistent ist und den
Merkmalen des Benutzers entspricht, z.B. seinen Kenntnissen aus
dem Arbeitsgebiet, seiner Ausbildung und seiner Erfahrung sowie
den allgemein anerkannten Konventionen."
– Der Link zur Startseite ist unter dem Firmenlogo oben links platziert.
– Unterstrichene Wörter sind immer Hypertext-Links.
– Beim Drücken der Tabulator-Taste springt der Cursor auf das nächste
Eingabefeld
– F1 ruft die Hilfefunktion auf
– Der Tabulator in einem Textprogramm ist am Linealsymbol
verschiebbar
– Beim Speichern ohne Zielangabe entsteht eine Datei am als Standard
voreingestellten Ort
– Ctrl-S bedeutet speichern
© schmiedecke 10
MCK
17
Erwartungskonformität
Äußere und innere Konsistenz


TFH Berlin
bekannte Symbole in üblicher Weise
einsetzen
eigene Symbole mit gleichbleibender
Bedeutung einsetzen
© schmiedecke 10
MCK
18
Erwartungskonformität:
Metaphorische Konsistenz
TFH Berlin
 Bei Verwendung von Metaphern im konzeptuellen
Modell:
– Aktionsmöglichkeiten auf Methaphern-Ebene sollen mit der
Realwelt konsistent sein.
 Beispiele:
– Papierkorb - ausleeren
– Mail (Briefsymbol) - versenden, öffnen, Anhang hinzufügen
– archivieren , in Archiv suchen - Datei liegt nicht mehr im
aktuellen Verzeichnis.
 Bewusste Inkonsistenz
– Undo-Funktion ist oft in der Realwelt nicht möglich.
© schmiedecke 10
MCK
19
Erwartungskonformität:
Negativbeispiel
TFH Berlin
 Winzip:
Der Befehl zum
komprimieren
heißt "Neu"
 Winzip:
Der Folgedialog
dient nicht der
Auswahl der zu
komprimierenden
Datei.
 Hinweis:
© schmiedecke 10
MCK
"kulturabhängig"
20
9241-110
Fehlertoleranz
TFH Berlin
 "Ein Dialog ist fehlertolerant, wenn das beabsichtigte
Arbeitsergebnis trotz erkennbar fehlerhafter Eingaben entweder
mit keinem oder mit minimalem Korrekturaufwand seitens des
Benutzers erreicht werden kann."
– Bei Fehlerhaften Eingaben erscheint eine verstehbare Fehlermeldung,
ggf. mit Reparaturhinweis oder -angebot
– Beim Rückwärtsbrowsen in einer Web-Applikation mit der Back-Taste
wird die Information immer aktualisiert
– Fehlermeldungen werden nicht technisch verklausuliert oder als
Nummer angezeigt, sondern in der Sprache der Benutzer formuliert.
– Warnhinweise werden deutlich von Fehlermeldungen unterschieden
– Es wird klar kommuniziert, ob und welche Systemänderung die
fehlerhafte Eingabe bewirkt hat.
© schmiedecke 10
MCK
21
Fehlertoleranz
Beispiele
TFH Berlin
Fehlermeldung
• mit Hilfehinweis
• mit Hilfeangebot
© schmiedecke 10
MCK
22
9241-110
Individualisierbarkeit
TFH Berlin
 "Ein Dialog ist individualisierbar, wenn das
Dialogsystem Anpassungen an die Erfordernisse der
Arbeitsaufgabe sowie an die individuellen Fähigkeiten
und Vorlieben des Benutzers zuläßt."
–
–
–
–
Die Sprache der Benutzeroberfläche ist wählbar
Auswahl zwischen Assistenten- und Expertenmodus
Vorausgefüllte Webformulare aufgrund des Benutzerprofils
Auf der Startseite einer Website besteht die Möglichkeit, eine
HTML- oder Flash-Version anzuwählen und zu bookmarken.
– Erstellung von Makros, ggf. per Aufzeichnung
– Freie Umgruppierung der Menüs und Werkzeugleisten
© schmiedecke 10
MCK
23
9241-110
Lernförderlichkeit
TFH Berlin
 "Ein Dialog ist lernförderlich, wenn er den Benutzer
beim Erlernen des Dialogsystems unterstützt und
anleitet."
– Es gibt eine Anleitung für die ersten Schritte und eine
Beispielanwendung.
– In einer "Guided Tour" werden die Benutzer mit besonderen Tricks in
der Bedienung einer Applikation vertraut gemacht.
– Beim Starten der Anwendung werden Tipps eingeblendet.
– Im Buchungs-System eines Reiseanbieters besteht die Möglichkeit
eine Probebuchung vorzunehmen.
– In einer Sitemap kann man sich ansehen, nach welcher Logik eine
Website strukturiert ist.
– Es gibt Feedback zur Vereinfachung häufig angewendeter Befehle.
© schmiedecke 10
MCK
24
Lernförderlichkeit
Beispiele
TFH Berlin
 Angebot alternativer
Eingabemöglichkeiten bei der Auswahl
 Tipps und Tricks beim Programmstart
 Erste Schritte und Tutorials
© schmiedecke 10
MCK
25
Ergänzungen
nach Sarodnick und Brau
TFH Berlin
 Prozessangemessenheit
Abgestimmtheit auf die realen Arbeitsbedingungen.
 System- und Datensicherheit
auch bei Eingabefehlern stabil und ohne Datenverluste
 Wahrnehmungssteuerung
„minimalistisches Layout“
Aufmerksamkeit nicht durch Irrelevantes abgelenkt.
 Interkulturelle Aspekte
 Joy of Use
zeitgemäße und ansprechende Gestaltung und
Arbeitsabläufe.
© schmiedecke 10
MCK
26
Shneidermanns
Goldene Regeln des Dialogentwurfs
1.
2.
3.
4.
5.
6.
7.
8.
© schmiedecke 10
TFH Berlin
Versuche Konsistenz zu erreichen.
Biete erfahrenen Benutzern Abkürzungen an.
Biete informatives Feedback.
Dialoge sollten abgeschlossen sein.
Biete einfache Fehlerbehandlung.
Biete einfache Rücksetzmöglichkeiten.
Unterstütze benutzergesteuerten Dialog.
Reduziere die Belastung des
Kurzzeitgedächtnisses.
MCK
27
TFH Berlin
Nächstes Mal geht’s um weitere Normen…
© schmiedecke 10
MCK
28