Die Präsentation wird geladen. Bitte warten

Die Präsentation wird geladen. Bitte warten

Alexander Nolte Informations- und Technikmanagement Institut für Arbeitswissenschaft, Ruhr-Universität Bochum www.imtm-iaw.rub.de Vorlesung Hard- und Software-Ergonomie,

Ähnliche Präsentationen


Präsentation zum Thema: "Alexander Nolte Informations- und Technikmanagement Institut für Arbeitswissenschaft, Ruhr-Universität Bochum www.imtm-iaw.rub.de Vorlesung Hard- und Software-Ergonomie,"—  Präsentation transkript:

1 Alexander Nolte Informations- und Technikmanagement Institut für Arbeitswissenschaft, Ruhr-Universität Bochum Vorlesung Hard- und Software-Ergonomie, WS 2011/ Hard- und Software-Ergonomie 4.2 Windows, Icons, Menus, Pointers, Controls (Teil 2) 4

2 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Windows, Icons, Menus, Pointers and Controls 4.1Beschriftung 4.2Fenster 4.3Menü 4.4 Gestaltung von Ikonen 4.5Externe Control-Devices 4.5

3 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Icons: Erfolgsfaktoren Vertrautheit Klarheit und Einfachheit Konsistenz und Erwartungen des Nutzers Kontext und Aufgabenbezug Unterscheidbarkeit: es sieht anders aus als alle anderen Icons Es ist offensichtlich, was es bewirkt (Selbsterklärung vs. Wiedererkennung) 16 Pixel im Quadrat reichen aus, um es erkennbar darzustellen. Ist sowohl in schwarz-weiß als auch Farbe erkennbar 4.4

4 Vorlesung Hard- und Software-Ergonomie, WS 2011/ A Successful Icon 4.4

5 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Auswahl geeigneter Bilder Verwende vorhandene Icons Bilder für Substantive, nicht für Verben, verwenden Möglichst traditionelle Bilder verwenden 4.4

6 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Bilder neu entwerfen Möglichst vertraute und konkrete Formen verwenden Visuell und konzeptionell klar zu unterscheidende Formen –Einzigartige Eigenschaften eines dargestellten Objektes wiedergeben –Nicht innerhalb einer Umrahmung darstellen Wenn Objekte dargestellt werden, dann einfach und klar Die verwendeten Formen sollten Teil einer Menge sein und sich aufeinander beziehen Die Formen sollten ansprechend ein. 4.4

7 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Art der Ausführung von Icons Bei sich ändernden Größen muss die Form konsistent sein. Falls auch Eigenschaften dargestellt werden, dann diese möglichst sinnfällig und gut nachvollziehbar darstellen Stimmige Größe und Orientierung sowie perspektivische Darstellung verwenden. Icons sollten beschriftet sein 4.4

8 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Zeichen-Definition De Saussure: Ein Zeichen ist durch die Relation von Bezeichnetem und Bezeichnendem gegeben. Bezeichnendes Bezeichnetes Baum 4.4 Ikonizität := Hohe Übereinstimmung zwischen Bezeichnendem und Bezeichnetem.

9 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Literatur zu Kapitel 4 Galitz, Wilbert O. (1998): The Essential guide to user- interface screen design. New York et al.: John Wiley. Helander, Martin (ed). (1988): Handbook of Human- Computer Interaction. Amsterdam, New York: North Holland. Preim (1999): Entwicklung interaktiver Systeme. Springer Shneiderman, Ben (2002): User Interface Design – Deutsche Ausgabe! 4

10 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Windows, Icons, Menus, Pointers and Controls 4.1Beschriftung 4.2Fenster 4.3Menü 4.4 Gestaltung von Ikonen 4.5Externe Control-Devices 4.5

11 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Ein/ Ausgabe Instrumente (Device-based controls) Trackball Joystick Graphic tablet Touch screen Anoto pen Mouse Steuerknopf Touchpad - Finger Keyboard 4.5

12 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Mouse als hauptsächliches Eingabe-Instrument Vor- und Nachteile + Direkte Beziehung zwischen Hand- und Pointerbewegung im Sinne von Richtung, Entfernung und Geschwindigkeit + Auswahlmechanismen sind integriert + Die Sicht auf den Bildschirm wird nicht verhindert (im Unterschied zum Touch Screen) - Indirekte Bewegung hinsichtlich der Bewegungsebene - Hand muss von der Tastatur genommen werden - Zusätzliche Oberfläche wird benötigt - u.U. lange Bewegungsabstände - Ein gewisses Maß an Augen-Hand-Koordination ist erforderlich 4.5

13 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Mouse Guidelines Bei zu kleinen Auswahlzielen sollte eine hot zone rund um das Objekt angeboten werden. Doppel-Clicks sollten nie als einzige Form der Aktivierung eines Items angeboten werden. Maus-Aktionen nicht mit Tastenanschlägen kombinieren. Nicht das Pointen bewegter Objekte verlangen. 4.5

14 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Semantic pointing – smart clicking Problem: Objekte sind zum Teil schwer zu manipulieren oder schwer zu treffen (insbesondere, wenn der Finger die Maus ersetzt) Semantic-Pointing: wenn man sich bestimmten Objekten nähert, verändert sich das Verhältnis zwischen Maus- und Pointer-Bewegung Smart-Clicking: mit jedem Click wird eine anderes Objekt, das innerhalb eines bestimmten Radius des Pointers liegt, selektiert Herausforderung: Wechsel nach Click darf nur erfolgen, wenn er nicht für Manipulationen benötigt wird. (z.B. Doppelclick)

15 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Vergleichskriterien zwischen Eingabe-Instrumenten Vertrautheit Exaktheit Platzbedarf Geschwindigkeit Zusammenhang zwischen Bewegung-Effekt Koordinationsanforderung Sichtbarkeit der Ausgabe Wechsel des Instrumentes Belastung 4.5

16 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Auswahl Richtlinien (1) Tastatur, wenn die Aufgabe vorsieht –Viel Texteingabe und -veränderung –Navigation zwischen einigen wenigen, diskreten Objekten Angebote eines zusätzlichen Instruments für Aufgaben des Zeichnens und Auswählens: –Mouse: pointing, selecting, drawing, and dragging. –Joystick: selecting and tracking. –Trackball: pointing, selecting and tracking. –Touch screen: pointing and selecting. –Graphic tablet: pointing, selecting, drawing, and dragging. 4.5

17 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Auswahl Richtlinien (2) touch screen wenn: –keine Gelegenheiten zum Üben. –große, diskrete und verteilte Ziele –geringe Nutzungshäufigkeit –kaum Texteingabe erforderlich Augen und Handbewegung zwischen verschiedenen Stationen sind zu minimieren 4.5

18 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Weitere Instrumente Data-Glove Data-Suite Eye-tracking Kraft-Sensoren

19 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Klassifizierung von Zeigeinstrumenten (1) 2-D1-D3-D frei beweglich geleitete Bewegung bew. Achsen beweglich bew. Achsen fixiert RotationTranslation unbegrenztbegrenzt 4.5

20 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Klassifizierung von Zeigeinstrumenten (2) unbegrenztbegrenzt homogene Bewegung vorgegebene Positionen Position beibehaltend Position verlierend Bewegungsträgekeine Trägheit keine Rück- stellkraft Rückstellung kaum beweglich Position registrierend Bewegung registrierend Kraft registrierend 4.5

21 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Screen-Based Control Buttons Text entry/ read-only Selection: –Radio Buttons –Check Boxes –Palettes –List Boxes (fixed / Drop down / Pop up) Combination Entry/ Selection: –Combination box Attached Pop up Drop down –Spin Boxes Welche Controls gibt es? Wofür sind sie sinnvoll? Wie sind sie zu gestalten? In welcher Situation ist welches Control zu verwenden? 4.5

22 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Weitere Controls –Slider –Notebooks –Scrollbars –Toggle Switch 4.5

23 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Buttons: Zweck Aktionen starten Attributwerte ändern Dialogboxen öffnen Alles, was sofort passieren soll. 4.5

24 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Button Größe OKCancelHelp Color Palette >> OKCancelHelp Color Palette >> OKCancelHelp Color Palette >> zu groß zu unruhig Alignment points; Aber empfohlen Schriftwechsel ist zu vermeiden 4.5

25 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Buttons: Anordnung und Layout Die Anordnung und Platzierung der Buttons muss bei verschiedenen Fenstern konsistent sein. Buttons nicht dazwischenquetschen. Buttons, die einen speziellen Zweck haben sollen besondere Plätze haben, z.B. Verlassen (unten) oder Erweiterung des Dialogs (rechts). Sie sollten nicht mit Buttons für andere Zwecke verwechselbar sein. Gleicher und angemessener Abstand zwischen zusammen gehörenden Buttons Gruppierung durch Nähe. 4.5

26 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Defaults (1) Default anbieten und hervorheben Im Falle einer destruktiven Aktion sollte der Default Cancel sein. 4.5

27 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Defaults (2) Reaktionen Der Default kann im Laufe der Interaktion wechseln Adaption. Die Hervorhebung wechselt ggf. auf den Button, auf den der Pointer zeigt Die Enter-Taste aktiviert den hervorgehobenen Button, wenn nicht eine andere Control die Enter-Taste braucht 4.5

28 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Buttons - Sonstiges Tastatur-Beschleuniger anbieten Buttons dürfen beim Scrollen nicht verschwinden nicht-verfügbare Buttons zurücktreten lassen Aktivierte Buttons kennzeichnen Buttons mit Wiederholmöglichkeit besonders darstellen 4.5

29 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Entry/Modification: Display/Read Only Information Text Boxes Anzuwenden, wenn die Möglichkeiten unbegrenzt sind, eine große Zahl schwer kategorisierbarer Items zu wählen ist oder die Länge stark schwankt. Wenn eine Selection list nicht möglich ist. 4.5

30 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Text Boxes - Anforderungen Klare Instruktionen, z.B. Erkennbarkeit optionaler Felder Logische Gruppierung Konsistente Begrifflichkeit der Caption Plausibilitätstest der Eingabe Anwendbarkeit der Fehlerkorrekturmöglichkeiten Erkennbarkeit bei Vollständigkeit der Eingabe Untergliederung der Eingabe, z. B. TTMMJJJJ auch Shneiderman

31 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Selection Controls: Radio Buttons Bei 2-8 sich ausschließenden Optionen Vor-/Nachteile + leicht erreichbar und vergleichbar, von Nutzern bevorzugt - verbraucht Platz - begrenzte Zahl von Optionen Left Center Right Decimal Bar Alignment Defaults, Accelerators und Captions nutzen - also vertikal anordnen und nicht verfügbare Optionen kennzeichnen 4.5

32 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Radio Buttons: Proper Usage Weitere Anwendungsindikatoren: –Diskrete Optionen im Unterschied zu analogen –Schwer zu erinnern –Wenn die Alternativen eine textliche Beschreibung brauchen (statt Ikone) –Leichter zu verstehen, wenn man alle Alternativen nebeneinander sieht Warum nicht Menüs oder Listboxen? –Die Auswahl bleibt Kontext übergreifend stabil (im Unterschied zu Menüs, Listboxen) 4.5

33 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Check Boxes - Gestaltungshinweise Anwenden, wenn mehrere Alternativen gleichzeitig möglich sind Weitgehend analog zu Radio-Buttons auch nur eine Check Box kann sinnvoll sein Beschreibung der Auswahlmöglichkeiten, Anordnung und Organisation sind bei Check Boxes und Radio Buttons gleich Bei beiden Selektionsmechanismen: –Defaults, nicht verfügbare Optionen und Accelerators beachten 4.5

34 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Radio-Buttons und Check Boxes - Beschreibung der Auswahlmöglichkeiten Nicht verfügbare Optionen grau oder blass darstellen Ggf. bei Radio-Buttons ein NONE-Auswahl anbieten wg. Klarheit z.B.: bei Internet Umfragen 4.5

35 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Selection Method and Indication (1) Pointing Die Auswahlzielfläche soll so groß wie möglich sein und sowohl Checkbox/ Radiobutton als auch die Beschreibung umfassen. Der selektierte Bereich ist hervorzuheben (highlighten), wenn der Cursor das sensitive Feld berührt und die Auswahl verfügbar ist. Bold Italic Underline 4.5

36 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Check Boxes: gemischte Werte 1 Bold Italic Underline Wenn die Checkbox ein Attribut repräsentiert, für das ein selektiertes Objekt mehrere Werte aufweist, dann muss die Checkbox besonders gekennzeichnet 4.5

37 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Check Boxes: gemischte Werte Schalten der Check-Boxes: 1. Selektion: Alles auf den Wert der Box setzen 2. Selektion: den Wert für alle Teile des Objektes zurücksetzen 3. Selektion: den gemischten Zustand wieder herstellen 4.5

38 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Palettes Einsatz bei sich ausschließenden Optionen, für die es unmittelbar eine grafische Darstellung gibt. 4.5

39 Vorlesung Hard- und Software-Ergonomie, WS 2011/ List Boxes Liste – u.U. mit Scrollbar –, aus der selektiert werden kann Auswahl mit Pointer und Click, ggf. mit Anfangsbuchstaben Kein Text Entry Field Aber ggf. ein Feld zwecks Anzeige der Auswahl oder zwecks Eingabe neuer Listenelemente Einsatz für große Zahl von Optionen (Mehrfachauswahl möglich) 4.5

40 Vorlesung Hard- und Software-Ergonomie, WS 2011/ List Boxes - Vor- und Nachteile + Optionenzahl nicht begrenzt (aber: nicht mehr als 40 Scrolldowns) + an alle Optionen wird erinnert + die Auswahl ist dauerhaft sichtbar - braucht viel Platz - scrolling wird benötigt - der Inhalt kann sich ändern - die Reihenfolge kann sich ändern Unterschied zu Menüs beachten 4.5

41 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Single-Selection List Box vs. Multiple-Selection List Box Australia Canada England France Germany New Zealand Netherlands Destination: Single-Selection List BoxMultiple-Selection List Box Bread Cereal Dairy Foods Desserts Drinks Fruit Meat, Fish and Poultry Vegetables Groceries: 4.5

42 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Mögliche Ergänzungen einer Multiple-Selection List Box Ausgabefeld, das die Zahl der Auswahl darstellt Text-Ausgabebox, die die getroffene Auswahl auflistet Button für Select All / Deselect Bread Cereal Dairy Foods Desserts Drinks Fruit Meat, Fish and Poultry Vegetables Groceries: 3 selected Groceries Selected: Bread Dairy Foods Meat, Fish and Poultry 4.5

43 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Weitere Ergänzungen einer List Box Darstellung, die die häufigste Wahl wiedergibt 4.5

44 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Drop-Down List Boxes Verwendung, wenn der Platz für eine dauerhaft gezeigte Liste nicht ausreicht, insbesondere, wenn mehrere Listen verfügbar sein sollen Es bedarf eines Feldes, das auf die Liste hinweist und die aktuelle Auswahl zeigt Icon-buttons müssen die Liste aufklappbar machen In das Feld kann nicht eingegeben werden (sonst Combination box) Horizontal: Left Horizontal: Set Right Centered Left Full Sport: Tennis 4.5

45 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Combination Boxes Über die List-Box kommt ein Text Entry Feld, in das man Selektionen eingeben kann oder frei gewählte Optionen. Die Selektion via Anfangsbuchstaben sollte erhalten bleiben, wird z.T. aber vernachlässigt. Die List box kann in gewohnter Größe fest verbunden sein oder über Drop Down/ Pop up geöffnet werden. 4.5

46 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Spin Boxes als besondere Combination Box Selektion oder Eingabe wird vollzogen, indem –mit dem Pointer auf die Richtungs-Buttons geklickt wird eine Wert Änderung pro Klick. –der gewünschte Wert eingegeben wird. Nachteil: Auswahlmöglichkeiten stehen nicht vergleichbar nebeneinander. 4.5

47 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Sliders ShaftArm Detent Temparature: 65 Fahrenheit Text Box Buttons Scale 4.5

48 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Gestaltung der Slider Scales Die komplette sinnvolle Bandbreite anzeigen Den niedrigsten, mittleren und höchsten Wert angeben Intervalle markieren, sofern sinnvoll Konsistente Inkremente Maßeinheiten austauschbar Falls relevant, den genauen Wert in einer zusätzlichen Box angeben Verstellbare Einrastpunkte anbieten 4.5

49 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Notebook Für Information, die man logisch in mehrere Seiten unterteilen kann Tabs gestalten konstante Breite anbieten textliche oder grafische Labels auf eine Reihe beschränken 4.5

50 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Kriterien zur Auswahl der Control-Form 1.Art der Daten 2.Diskret vs. Kontinuum 3.Verbal vs. bildlich vs. numerisch 4.Sich ausschließende oder ergänzende Optionen 5.Begrenzter vs. unbegrenzter Wertebereich –Sehr kleine, mittlere oder sehr große Zahl an Optionen 6.Texteingabe ist sinnvoll –Feste oder variable Eingabelänge –Anfälligkeit für Tippfehler / Präzisionsanforderung –Aufwand des Tippens 7.Vorhersagbarkeit –Der Ordnung –Der Intervalle zwischen numerischen Werten 8.Inhalt der Optionen ändert sich nie, selten, öfter 4.5

51 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Weitere Kriterien zur Auswahl Ausreichend Platz vorhanden oder nicht Räumliche oder grafische Darstellung sinnvoll oder nicht Eigenschaften der Benutzer: –Vertraut mit den Daten –Übung mit Tastaturnutzung Erlernbarkeit der Daten und Eigenschaft der Aufgabe –Häufige Nutzung –Änderungshäufigkeit der Optionen 4.5

52 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Wann soll man Text Entry anbieten Wenn der Umfang der Daten, aus denen auszuwählen ist, unbegrenzt ist ODER Die Daten dem Benutzer vertraut sind UND Nicht Tippfehler anfällig UND Weniger Anschläge als die Selektion und Tippen geübt Dann immer Text-Entry anbieten und ggf. mit Selektionsmöglichkeit kombinieren SONST unbedingt mit Selektionsmöglichkeit Combina- tion ver- wenden 4.5

53 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Welche Form der Selection-Control WENN kleine Zahl von Optionen UND Platz vorhanden DANN Radio-Buttons oder Check-Boxes SONST Pop-Up / drop down list WENN große Zahl von Optionen UND Platz vorhanden DANN präsente Liste SONST Pop-Up / drop down list 4.5

54 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Weitere Regeln WENN Kein Platz ist UND Ordnung vorhersagbar UND Intervalle vorhersagbar DANN: Spin Buttons Diskrete Daten, sich ausschließend, grafisch darstellbar Palette Kontinuierliche Daten, räumlich Anordnung hilfreich, begrenzter Wertebereich, Werteveränderung vorhersagbar Slider 4.5

55 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Menü oder Buttons für Kommandos? 7 oder mehr und hierarchische Gruppenstruktur möglich Menü 6 oder weniger, häufige Nutzung und die ganze Anwendung eines Fensters betreffend Buttons in a Window 7 oder mehr häufige Nutzung und die ganze Anwendung eines Fensters betreffend Buttons in a Toolbar 4.5

56 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Vergleich von Steuerungsmöglichkeiten FilenameNumberSizeDate Filename Number Size Date Radio button F N S D One Entry Area F, N, S, D 4 Entry Areas 1. Position: 2. Position: 3. Position: 4. Position: 4.5

57 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Vergleich - Ergebnisse PreferenceSpeed Direct Manipulation. O O Selection. –Icons. –Radio Buttons –Menus (Drop-down list boxes). ++ Entry –One entry area –Four entry areas. 4.5

58 Vorlesung Hard- und Software-Ergonomie, WS 2011/ Weitere Ergebnisse Bis zu 30 Items können für Radio Buttons oder Check- Boxes (8 Ankreuzungen) sinnvoll sein. Eingabe von Werten: –Spin Buttons am genauesten –Text Entry Field bevorzugt, am schnellsten Entry Field + Radio-Buttons ist eine erwünschte Kombination, wenn nicht vordefinierte Eingaben möglich sind Others: 4.5


Herunterladen ppt "Alexander Nolte Informations- und Technikmanagement Institut für Arbeitswissenschaft, Ruhr-Universität Bochum www.imtm-iaw.rub.de Vorlesung Hard- und Software-Ergonomie,"

Ähnliche Präsentationen


Google-Anzeigen