-
Visuelle Gestaltung
- -Möglichkeit für die Optimierung von Dialog und Form
- -Bedeutungszusammenhänge + Wahrnehmbarkeit
- -Erleichterung Suchen + Erkennen von Daten
- -ruhiges Erscheinungsbild schaffen
- -Verkürzung von Reaktionszeit + Entscheidungszeit (bis zu 30%)
- -Gesetz der Nähe
- -Gesetz der Gleichheit
- -Verbundenheit
- -Symmetrie, Einfachheit in Form
- -optische Täuschung vermeiden
- -Farbharmonie
-
Vor/Nachteile Mental Models, Metaphern
- -Formung von Metaphern unterstützt Mental Modells (Diskette)
- -"Idee" für Funktion entwickeln
- -Assoziationen wecken
- -Metapher kann Denkmuster gefangen nehmen
- -Fehleinschätzung der Anwender
- -Beleuchten von: Emotional, Ecological, Interaction, Metaphers
-
Fehler bei MCI
- -mangelnde Übereinstimmung von Mensch + Anwendung
- -Denkfehler, Gewohnheitsfehler
- -Merk / Vergessensfehler (Überspringen, hohe Gedächtnisleistung)
- -Urteils, - Erkennensfehler (Übersehen)
- -Bewegungsfehler (vertippt, verklickt, verlieren)
- -Wissenslücken
-
Grundsätze mensch-zentrierter Entwicklung
- -Mensch im Mittelpunkt, Nutzer in Entwicklung Einbeziehen
- -Berücksichtigung User Experience
- -the new computing is about what people can do
-
Lifecycle Prozess
- -Prozess: zielgerichtetes Set von Aktivitäten
- -Lifecycle: zeitliche Abfolge von Aktivitäten & Techniker
- 1.Verstehen + Analysieren
- 2.Ideation and Design (angewandtes Design)
- 3.Mockups & Prototypen erstellen
- 4.Evaluieren
-
Iteration
- -Flexibles revisiting von Prozessschritten
- -Fehler können schneller gefunden werden
-
Know the User
- -Tätigkeiten
- -Bedürfnisse
- -Ziele
- -Physische Umgebung
- -Soziale Umgebung
- -Organisatorische Umgebung
- -Materialien verstehen
-
Verstehen + Analysieren im Lifecycleprozess
- -Untersuchung der jeweiligen Umgebung der Nutzer, ihrer Tätigkeiten, Bedürfnisse + Erwartungen
- -potentielle Problemstellen
- -Nutzungskontext (sozial,physisch,Material, Benutzer)
- -Ableite auf Design-Prozesse
-
Methodisches Vorgehen
- -verschiedenste Datenerhebungstechniken für Nutzungsforschung
- -Interview, Dokumentenanalyse
- -Fokus Gruppen, Fragebögen
- -Kombination aus Beobachtung + Interview
-->Den Nutzer nicht fragen, was er gerne hätte
-
Ideation and Design
- -Ideen + Konzeptgenerierung
- -Erstellung von konzeptionellen Design, Interaktionsverhalten & dem "Look and Feel"
- -Ideengenerierung für konkrete Problemlösung + Ideenkritik
- -Szenarien, Skizzen, Storyboards, Interaction Flow Models
- -UI -Wireframes entwerfen, skizze Bildschirminhalt
-
Mockups + Prototypen im Lifecycleprozess
- -Design erlebbar integrierbar + testbar machen
- -Verstehen was funktioniert + was nicht Inkonsistenz erkennen
-
Gestaltungsprinzipien der Ein/Ausgabe
- -Entdeckbarkeit: Dargestellte Infos sind erkennbar, vorhanden, wahrnimmt
- -Ablenkungsfreiheit: ohne Wahrnehmungsstörung
- -Unterscheidbarkeit
- -Eindeutige Interpretierbarkeit
- -Kompaktheit
- -interne + externe Konsistenz
-
Gestaltung für text.field
- -Führungstext soll vorhanden sein
- - 4,4cm bei 50cm Entfernung
- -möglichst nicht mehrerer Wörter
- -Eingabebereich, kurz, angepasst an Länge
- -Unterscheidung "Muss" "kann" Feldern
- -Zahlen rechtsbündig
- -Vorbelegung für häufig erwartete Werte
-
Gestaltung Text Area
- -wie vorher aber:
- -Zeilenabstand 2 - 2,7fachen der Buchstabenhöhe
- -Rollbalken lieber vertikal als horizontal (4Zeilen)
- -linksbündig
set.Allignement(Pos.BASELINE_RIGHT)
-
Rasmussen Modell (1986)
- -automatisiert ablaufende Handlungen unterhalb der Bewusstseinsschwelle
- -unbewusst Abgleich des Wahrgenommen mit Modell der Welt
- -selektive Aufmerksamkeit + stützen über
-
Don Norman: Seven Stages of Action
- 1.Goals
- 2.Intention to act
- 3.Sequence of action plan
- 4.Execution of action->Systemübergabe
- 5.Precieving the state of the world
- 6.Interpreting the perception
- 7.Evaluation
-
Funktionsorientierte Interaktion
- -Syntax: -Wahl der Operation
- -Wahl eines oder mehrerer Operanten
- -Parameterangaben: Nach Wahl der Operation/des Operanden
- -Anwendung:
- -häufig in systemgeführten Dialogen
- -Anwendung einer Operation auf viele einzelne Operanden
- -modal: Beibehalten der Operationen bis zur neusten Wahl
Bsp: Farbeimer zum Färben
-
Objektorientierte Interaktion
- -Beispiel:
- -Textverarbeitung
- -Selektieren des Textbereiches
- -Formatierung durch Menübefehl
- -Formatierungsparameter in Dialogfeld
- Anwendung:
- -benutzergeführte Dialoge
- -Anwendung mehrerer Operationen
- -Selektion von Operanden bleibt meist erhalten
-
Kommandobasierte Interaktion
- -Eingabe primär über Tastatur (Sprache und Gesten auch möglich)
- -"Erinnern und Eingeben"
- Vorteile:
- -schnell + effizient
- -flexibel + mächtig
- -einfach Stapelverarbeitung
- Nachteile:
- -Platzbedarf
- -Navigations + Orientierungsprobleme
- -hierarische Menüs haben aufwendige Kommandos
-
Menübasierte Interaktion 2.0
- Menüvarianten:
- -statisch
- -PullDown DropDown (Up)
- -Symbolleisten / Toolbars
-Multifunktionsleisten wie bei Word
-
Formularbasierte Interaktion
- -strukturiert Darstellung von Feldern/Benutzersschnittstellen
- -Benutzung bei Forderungen von Eingabedaten des Users
- -Formulare müssen Valide + vollständige Daten liefern
- -verständlich, übersichtlich, erwartungskonform
- -Inhalte nach Wichtigkeit gliedern
- -Redundanzen vermeiden
- -Gestaltgesetze berücksichtigen
- -Formulare können auch dynamisch sein
- Vorteil:
- -direkte Validierung der Benutzereingaben
- -Fehler sind fest ausgeschlossen
- -Dynamisches Einblenden von Erläuterungen + Hinweisen
- Nachteil:
- -Intuitives Blättern in Formularen nicht möglich
- -Modalität sollte möglichst vermieden werden
-
Fensterbasierte Interaktion
- -Fenster als Sicht auf Objekte einer Anwendung
- -Fenster als Interaktionsbereich
- -versch. Fenster für eine Anwendung möglich
- -2D Darstellung
- -Wechsel zw. Fenster möglich
- -direkte Manipulation
-
Fenstertypen
- -Anwendungsfenster
- -Unterfenster
- -Dialogfenster
- -Mitteilungsfenster
- Systemmodaler Dialog:
- -erlaubt keinen Wechsel zwischen Fenstern
- -Aktuelles Dialogfenster muss zu Ende bearbeitet werden
- -Bsp: Sicherheitsfrage bei Installation bei Windows
- Anwendungsmodaler Dialog:
- -Erlaubt Wechsel zw. Fenstern
- -Zur Weiterarbeit mit gegenwärtigen Anwendungen, muss der Dialog jedoch geschlossen werden
- -"Speichern unter" Dialog
- Nicht-Modaler-Dialog:
- -Erlaubt den belieben Wechsel zwischen allen Fenstern
- -Microsoft Outlook 2016
-
Mehrere Fenster
- -benötigt bei Alerts/Meldungen, Konfigurationsfenstern öffnen mehrere Dokumente
- -Fenster = Stage (FxML erlaubt Inhalte der Stage flexibel zu gestalten)
- -Soll der User das "Parent" - Fenster weiter bearbeiten können
- -Freiheit vs. Fehlervermeidung/Einfachhheit
-
Direkte Manipulation
-User können Objekte mit einem Zeigegerät bewegen, die graphisch visualisiert werden
- Vorteile:
- -kleine Anzahl von Bearbeitungsregeln durch generische Funktion
- -leichte Erlernbarkeit
- -gut zu behandeln
- -auch für Experten effizient
- -Arbeitsfortschritt ständig sichtbar
- -kaum Fehlermeldung nötig
- Probleme:
- -benötigter Bildschirmplatz (nur Ausschnitt darstellbar)
- -langsame Eingabe z.B. blind bediente Tastatur schneller als Maus
- -graphische Vorgänge nicht genormt
- -begrenzte Gültigkeit von Metaphern
- -Entwicklungsaufwand sehr hoch(Drag n Drop)
- Einsatzkriterien:
- -Unmittelbare Reaktion des Systems möglich
- -Ausreichender Bildschirmplatz vorhanden
- -Passendes Ein/Ausgabegerät
- -Maus, Pad, sensomotorische Geräte
- -passende Metaphern
- -Gelegenheitsnutzung steht im Vordergrund
-
6. Design Prinzipien von Norman (1-2)
- -Design Rules und Style guides zu beachten (Marke)
- -helfen Look and Feel zu vermitteln
- 1.Visibility:
- -je ersichtlicher die Funktion, desto schneller begreift User
- -Fehlermeldung sichtbar, Funktion auffindbar Link/Button erkennbar, Status ersichtlich
- -Was der Nutzer nicht sieht, kann er nicht nutzen
- 2.Feedback:
- -kann auf verschiedene Weisen erfolgen (grafisch, auditiv, haptisch, textuell)
- -Unmittelbarkeit ist entscheidend, geht auch kontinuierlich (Ladebalken)
- -Reaktion des Systems, Korrigierbarkeit, veränderbar, kann der User fortfahren
-
6. Design Prinzipien von Norman (3-4)
- 3.Mapping:
- -Zuordnung von Bedienelementen und dessen Wirkung
- -Labels sind ein Workaround
- -räumliche Attribute
- -schwere Mappings können im Ernstfall zum Zögern führen
- -keine Doppelbelegung
- -Reihenfolge ist auch wichtig (Play stop usw)
- 4.Constraints:
- -Beschränkungen (ausgegraut, keine Eingabe möglich)
- -helfen um Nutzer/Betreiber zu schützen vor unnötigen Infos
- -konkreten Kontext berücksichtigen
-
6. Design Prinzipien von Norman (5-6)
- 5.Consistency:
- -Erinnerung an Regeln
- -Gleiche Platzierung von Logo + Suche
- -Gleiche Art von Funktion
- -Asthetische Konsistenz
- -Funktionale Konsistenz
- -In/Externe Konsistenz
- 6.Affordance:
- -intuitive Benutzerschnittstellen
- -Knopf = Drücken , slide to unlock
- -Spezifischer Einsatz von Aussehen und Form Gestalt soll Aufmerksamkeit erreichen & Hinweise auf Bedingung geben
-
Shneidermans Eight Golden Rules
- 1.Strive for consistency
- 2.Cater to universal usability
- 3.offer informative Feedback
- 4.Design dialog to yield closure
- 5.Prevent errors
- 6.Permit easy reversal of actions
- 7.support internal focus
- 8.Reduce short term memory
-
Grundsätze der Dialoggestaltung
- 1. Aufgabenangemessenheit
- -Informationen anzeigen zur Unterstützung
- -Ein/Ausgabe passt zur Aufgabe
- -Dialog effizient gestalten
- 2.Selbstbeschreibungsfähigkeit
- -User Weiß ,wann wie wo was
- -Infos die zum Ziel führen, Eingabe sichtbar
- -Nicht "Das steht im Handbuch"
- 3.Erwartungskonformität:
- -allg. Konventionen erkennbar
- -Benutzer werden informiert wenn Konformität abweicht
4.Steuerbarkeit
- 5.Fehlertoleranz:
- -kein oder minimaler Korrekturaufwand
- -aktive Unterstützung (auto)
- -Fehlermanagment
- 6.Individualisierbarkeit:
- -Fähigkeiten und Bedürfnisse anpassen
- - verschiedene Formen Darstellungen Interaktionen wählbar
- 7.Lernförderlichkeit:
- -Ausprobieren ohne Angst
-
Visuelle Informationen von Farben
- -Farben nicht als alleinige Kodierung
- -Farben als Bedeutung und Orientierung
- -Farben zur Kodierung <= 6
- -Ton Helligkeit Sättigung
- -kein gesättigtes Blau oder Rot
- gesättigtes im Grund vermeiden
-
Verwendung von Effekten
- max 10-20% des Inhalts
- -nur eine Art der Hervorhebung verwenden (3D)
- -Lesbarkeit beachten
- -Kontrastverminderung, Blinken(sparsam)
- -keine Texte blinken lassen
-
Darstellung von Schrift
- -proportionale Zeichenbreite
- -sereinlos, ausreichend Auflösung
- -nicht unterstrichen und kursiv
- -Größe zu Zeichenkontrast 1:3
-
Herausforderung ergonomischer Dialoggestaltung
- -Ableitung von konkreten Gestaltungskriterien
- -Berücksichtigung von Änderungen im Arbeitsablauf
- -immer viele Bedingungen und Ausnahmen
-
Gestaltungsanforderungen
- -generisch für alle Geräte
- 1. Angemessenheit (Benutzung Aufgabe Nutzung)
- 2.Handbarkeit:
- Eindeutigkeit, Vorhersehbarkeit
- Konsistenz der Funktion
- Kann der User das
- unmittelbare Rückmeldung
- 3.Steuerbarkeit:
- Ansprechbarkeit,Störungsfrei,Zuverlässigkeit
-
Benutzerführung
- - auf allen Ebenen der Benutzerschnittstelle bei Ein und Ausgabe, Dialoge , Werkzeuge, Organisatorische Ebene
- -Unterscheidbarkeit zwischen inhaltlicher und unterstützender Funktion
- -innere Konsistenz wie richtiges Datum und Fehlermeldungen
- -unterbrochene Benutzerführung vermeiden
- -Dialog positiv und kurz sowie emotional neutral,einheitliche Grammatik
- -Interaktion, Reihenfolge erkennbar machen
-
Fehlerarten
- -Denkfehler
- -Gewohnheitsfehler
- -Bewegungsfehler
- -Merkfehler
- -Unterlassensfehler
- -Urteilsfehler
- -Erkennensfehler
-
Fehlerbehandlungen
- -Bestätigungsmeldung (Confirmation)-->Wenn der weitere Ablauf vom User abhängt, Anwendung schliessen?
- -Informationsmeldung-->User braucht Infos (Hilfefunktion oder Systemhilfe)
- -Warnungen--> Warnung vor Eingabe die nicht zum Abbruch führt (ungültige Datumseingabe)
- -Error / Fehlermeldung--> Eingabe die zum Abbruch des Programms führt (voller Speicher)
-
Fehler selbst formulieren
- -Ziel der Funktion vor Art der Behebung nennen
- -Steuerbarkeit betonen
- -positiver einheitlicher grammatikalischer Aufbau
- -kurze einfache Sätze, emotional neutral
-
Fehler Meldung inhalt
- Was ist von welcher Art falsch?
- Ursache nennen
- Korrekturmaßnahmen
- Ist alles falsch oder nur ein Teil?
-
Fehlervermeidung
- automatische Formatierung / Hinweise
- Verhindern von bestimmten unerwünschten Eingaben
- Automatische Korrektur bestimmter Eingaben
-
Alert- Dialogmodalitäten
Systemmodaler - Dialog: kein Wechsel zwischen Fenster, aktuelles Fenster muss zunächst zu Ende bearbeitet werden
Anwendungsmodaler-Dialog: Erlaub Wechsel zwischen Fenstern, aber keine Bearbeitung möglich
Nichtmodaler- Dialog: Erlaubt den beliebigen Wechsel und Bearbeitung
-
Prüfungen in Formularen
- Eingaben sollen syntaktisch korrekt sein, auch semantisch
- frühe Prüfung
- Beachtung der Handlungsflexibilität
- Lexikalische Prüfung, pragmatische Prüfung
- frühe Prüfung durch beschränkte Eingabeparameter
- pragmatische Prüfung beim Verlassen und speichern
-
Prüfung in JavaFX
- lexikalisch --> TextFormatter
- syntaktisch-->NumberFormat
- semantisch-->Converter in TexrFormatter
- pragmatisch ggf mit Parser
-
4 Phasen der menschzentrierten Entwicklung
- 1.Verstehen und Analysieren
- 2.Ideation und Design
- 3.Prototypen und Mockups
- 4.Evaluieren
-
Evaluation in der Softwareentwicklung
- Prüfung während Entwicklungs+Gestaltungsprozesse
- Prüfung auf Verlauf und festgelegte Ziele
- Ziel: Know the user you're not the user
-
Typische Evaluationsfragestellung
- Adressieren die Gestaltungslösungen die Bedürfnisse der Benutzer?
- Hat die Gestaltungslösung Funktion der Anforderungen?
- Gute Usability?
- Ist die Software flexibel bei Benutzerunfreundlichkeit?
- positives Benutzererlebnis?
-
Prüfgrundlage
- Usability und User Experience (Maße)
- Design und Gestaltungsrichtlinien (Normen)
- Spezifikation der Anforderungen(funktional, nicht funktional)
- Vergleich von Gestaltungsvarianten
- Vergleich mit Konkurrenzprodukten (einfache Bedienung)
-
Was lässt sich messen (Prüfgrundlage)?
Effektivität: Genauigkeit + Konsistenz mit dem Ziel erreicht wird
Effizienz: Aufwand mit dem Ziel erreicht wird
Satisfaction: Freiheit von Beeinträchtigung und positive Einstellungen ggü. der Nutzer des Produktes
-
Analytische Inspektionsmethoden
- Expertenbasierte Verfahren
- Heuristische Evaluation
- Cognitive & Design Walkthrough
-
Befragungsmethoden
- Interviews
- Fokusgruppen
- Fragebögen
- Tagebücher
- Experience Sampling
-
Interview ohne Interviewer (Bogen)
- Erhöhtes Augenmerk auf: Reihenfolge und Struktur der Fragen
- Verständlichkeit und Eindeutigkeit
- Umfang der Fragen
- nicht viele Freitextfelder
- Transparenz der Dauer
- keine Nachfrage möglich
-
Geschlossene Fragetypen
- Rating Skalen
- Semantisches Differential
- Ja/Nein Fragen
- Multiple/single Choice
- Gabelfragen
-
Hinweise zu Fragen
- Vermeidung von doppelter Verneinung, uneindeutiges, unbekannte Worte, Suggestivfragen
- Fragen sollen ein Objekt behandeln
- weniger als 20 Worte
- keine Schachtelsätze
-
Fragebogen Aufbau
- klare Anweisung von Beginn an
- einleitende demographische Frage
- inhaltliche Blöcke
- Abklingen lassen
- Reihenfolge der Fragen
-
Dimensionen im Fragebogen
semantisches Diffenrential, 28 Fragen, 4 Dimensionen (inhaltsblöcke)-->schnell auszuführen
- Beispiel an einer Software
- 1)Pragmatische Qualität funktionale Aspekte, was macht die Software?
- 2)Hedonische Qualität und Identität, kann man sich identifizieren?
- 3)Hedonische Stimulation Neuartige Software, ungewöhnlich spannend
- 4)Attraktivität - ästhetisch hochwertig angenehm sympathisch?
- Vorteile:
- altes Messinstrument
- schnell + leicht
- geringes Versuchspersonal
- Nachteil:
- kostenpflichtig
- Validität ist Basis
- Für Software mit wenig Emotionen
-
Fragebogen - wann einsetzen?
- Feedback in jedem Stadium
- emotionale Aspekte, Usability Satisfaction
- standardisierte Messinstrumente
- Verifizierung von Daten
- Vorteile:
- Kosten niedrig bei Standardprodukten
- Große Reichweite
- natürliche Umgebung
- kein Intervieweffekt
- Nachteil:
- keine Nachfragemöglichkeit
- schlechte Rücklaufquote
- Interpretation oft schwierig
- Ausfüll - Kontext
-
Beobachtungsmethoden
- Usability Test
- Experiment
- Eyetracking oder sensorbasiert
- Feldbeobachtungen
- Logfile Analyse
- Beobachtung in tatsächlicher Umgebung
- Feedback auf HighFidelty Prototypen oder erste Produkt Version
- Mentale Modelle
-
Formativ vs. Summativ
- Formativ während der Entwicklung:
- form your Design
- starke qualitative Usability
- Verbesserung fürs Design finden
- Summativ -Abschließend:
- sum up your Design
- quantitativ
- Grad der Zielerreichung
- Marketing unterstützen
-
Wer sind unsere Benutzer?
- Stichprobe aus möglicher Zielgruppe
- Vorführeffekte vermeiden, repräsentativ
- Auch Benutzer aus früherem Stadium + Neu Benutzer
- Usability Probleme: 5-8 Probanden
- Usability Messung: 16-30 Probanden
-
Properties
- sind dynamische Eigenschaften Ursprung in JavaBeans
- Implementieren das Interface java.fx.beans. Observable
- können Eigenschaften von Klassen an andere Objekte koppeln
- Typ private Property
- private StringProperty name = new SimpleStringProperty();
- Getter & Setter erlauben Zugriff aus Werte der Property
- public final setName(String value){
- name.set(value);}
-
Bindings
- ermöglichen Abhängigkeiten zwischen Properties zu erzeugen
- NumberBindings sum = Bindings.add(num1);
- oder num1.bind(num2.add(5));
|
|