Die Präsentation wird geladen. Bitte warten

Die Präsentation wird geladen. Bitte warten

Thomas Herrmann Software - Ergonomie bei interaktiven Medien 06.04.1999 1 Prinzipien gelungenen Screen Designs - Überblick - (1) Nutzererwartungen und.

Ähnliche Präsentationen


Präsentation zum Thema: "Thomas Herrmann Software - Ergonomie bei interaktiven Medien 06.04.1999 1 Prinzipien gelungenen Screen Designs - Überblick - (1) Nutzererwartungen und."—  Präsentation transkript:

1 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Prinzipien gelungenen Screen Designs - Überblick - (1) Nutzererwartungen und Basistest Organizing Screen Elements Clearly and Meaningfully –Consistency, Upper-left, Navigation –Visually Pleasing Composition (Balance,..., Gruppieren) Amount of information Unterscheidbarkeit und Hervorhebung Tiefeneindruck erzeugen Information einfach und sinnvoll darstellen –Schriftarten –Captions und Anordnung Headings Keying Procedures

2 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Spezialfälle (Daten-Eingabe & Modifikation; Dateneingabe von Vorlage; Read- Only) statistische Graphik Diskussions-Beispiele Prinzipien gelungenen Screen Designs - Überblick - (2)

3 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Was Screen users wollen Ordentliches, sauberes Screen ohne Durcheinander Man sieht klar, um was es geht und was zu tun ist Die Information ist dort plaziert, wo man sie erwartet Man sieht klar, was zusammengehört Einfache Sprache Es ist einfach zu erkennen, was man mit dem System machen kann Man erkennt deutlich, welche Aktionen die Daten dauerhaft ändern Test: Können alle Elemente des Screen durch grafische Merkmale erkannt werden, ohne Text zu lesen

4 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Nur sinnvolle Informationen Each screen element... Every control every icon each color alle emphasis the screen organization all screen animation each message all forms of feedback must... Have meaning to screen users serve a purpose in performing tasks

5 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Konsistenz Übereinstimmung mit den allgemeinen Erfahrungen - Übertragbarkeit Vergleichbarkeit mit bekannten Systemen Begriffe und Metaphern aus dem gewohnten Arbeitsumfeld Wann sind Abweichungen sinnvoll? Test

6 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Navigation Oben-links geht es los! Navigations - Unterstützung durch Gruppierung, Anordnung, Begrenzungslinien Hervorhebung und Abfolgen berücksichtigen die Unterscheidung zwischen: Wichtig, Sekundär, Unwichtig Sinvolle Reihenfolge für TAB-unterstützendes Navigieren

7 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Visually Pleasing Composition Provide visually pleasing composition with the following qualities: –Balance –Symmetrie –Regularity –Predictability –Sequentiality –Economy –Unity –Proportion –Simplicity –Groupings

8 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Balance Create screen balance by providing an equal weight of screen elements, left and right, top and bottom BalanceInstability

9 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Symmetry Create symmetrie by replicating elements left and right SymmetrieAsymmetrie

10 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Regularity Create screen regularity by establishing standard and consistently spaced horizontal and vertical alignment points RegularityIrregularity

11 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Predictability Create predictability by being consistant and following conventional orders or arrangements IconTitle BarIcon Menu Bar Control Button Predictability Icon Title Bar Icon Menu Bar Control Button Spontaneity

12 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Sequentiality Provide sequentiality by arranging elements to guide the eye through the screen in an obvious, logical, rhythmic, and efficient manner. The eye tends to be attracted to: –A brighter element before one less brigth –Isolated elements before elements in a group –Graphics before text –Color before black and white –Highly saturated colors before those less saturated –Dark areas before light areas –A big element before a small one –An unusual shape before a usual one An welches Element können Sie sich erinnern?

13 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Proportion Create windows and groupings of data or text with aesthetical pleasing proportions Square 1:1 Square root of three 1:1.732 Double Square 1:2 Square-root of two 1:1.414 Golden rectangle 1:1.618

14 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Economy Verwendung möglichst weniger Stile; Display techniques und Farben Unity - Geschlossenheit durch Ähnlichkeit der Elemente und Vermeidung zu großer Leerräume UnityFragmentation

15 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Gruppierung Provide functional groupings of associated elements Create spatial groupings as closely as possible to five degrees of visual angle (1.67 inches in diameter or about six to seven lines of text, 12 to 14 characters in width) Evenly space controls within a grouping, allowing 1/8 to 1/4 inch between each Gesetz der Nähe, Geschlossenheit und Gleichartigkeit konsistent kombinieren Incorporate line borders for: –Focusing attention on groupings or related information –Guiding the eye through a screen Do not exceed three line thicknesses or two line styles on a screen, however –use a standard hierarchy for line presentation Create lines consistent in height and length Use rules and borders sparingly

16 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Gruppenzahl berechnen Durchschnittsabstand der Buchstaben berechnen (Wert 1 für direkt benachbarte, 2 für übereinandergestellte) Alle Buchstaben, die paarweise nicht weiter als der doppelte Durchschnittsabstand entfernt sind, bilden eine Gruppe ************************ * * TIP GROUND 14K * * ************************ DC RESISTANCE 3500 K T - R 14 K T - G 3500 K R - G BALANCE 39 DB DC VOLTAGE 0 V T - G 0 V R - G AC SIGNATURE 9 K T - R 14 K T - G 629 K R - G CENTRAL OFFICE VALID LINE CKT DIAL TONE OK

17 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Einfachheit vs. Komplexität Maßeinheit: –Zahl der Elemente –horizontal alignment points –vertical alignment points Ziel: Reduzierung zwecks Verkürzung der durchschnittlichen Zeit für Suchaufgaben

18 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Alignment - points IconTitle BarIcon Menu Bar Control Button Predictability Icon Title Bar Icon Menu Bar Control Button Spontaneity

19 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Amount of Information Nicht mehr als 30% des Screens ausfüllen lokale Dichte reduzieren Dichte pro Zeichen (Z Di ): Z di = aller Gewichte der Matrix, die durch ein Nachbarzeichen belegt sind durchschnittliche lokale Dichte des Screen in Prozent bei n Zeichen: = Z di n * 2,

20 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Sinnvolles Ordnen Provide an ordering of elements that: –Is logical and sequential –Is rhythmic, guiding a persons eye through the display –Encourages natural movement sequences –Minimizes cursor and eye movement distances Locate the most important and most frequently used elements or controls to the top left Maintain a top-to-bottom, left-to-right flow When groups of related information must be broken and displayed on seperate screens, provide breaks at logical or natural points in the information flow

21 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Ordnungskriterien Konvention Reihenfolge der Nutzung Häufigkeit Funktion Wichtigkeit allgemein zu speziell

22 Thomas Herrmann Software - Ergonomie bei interaktiven Medien Unterscheidbarkeit und Hervorhebung Elemente dürfen sich weder gegenseitig berühren oder Grenzlinien berühren oder überschreiten Hervorhebung die wichtigsten Elemente betonen


Herunterladen ppt "Thomas Herrmann Software - Ergonomie bei interaktiven Medien 06.04.1999 1 Prinzipien gelungenen Screen Designs - Überblick - (1) Nutzererwartungen und."

Ähnliche Präsentationen


Google-Anzeigen