188
Informatik (Fach) / Interaktions Design (Lektion)
Anzeige
- Was bedeutet WIMP? WIMP (Windows, Icons, Menus, Pointer) sind spezielle Symbole bzw. Window Gadgets (Widgets) die bei der Interaktion mit einer GUI verwendet werden.
- Look-&-Feel Look-&-Feel definiert vereinheitlichtes Erscheinungsbild und Verhalten der GUI
- Kontrollelemente Auswahlkontrolle:Checkbox (auch als Liste möglich)Radio ButtonsDrop-Down-ListSingle(Multiple)-Selection List/Tree (Scrolled möglich)"Press-&-Stick" Toggle Button (viele Varianten)Spinner (mit Pfeilen rechts)
- Konsumgerät Konsumgeräte (Consumer-Devices) sind Maschinen für täglichen Gebrauch, z.B. Waschmaschinen, Fernbedienung, Navis- Aufgabe soll in kurzer Zeit erledigt werden
- Mobile User Interface Mobile User Interfaces erlauben ortsabhängige (location-based) Interaktion
- Sprach-basierte UIs Sprach-basierte UIs nutzen natürlichsten und gebräuchlichsten Kanal der menschlichen Kommunikation.○ symmetrische Modalität - Synthese: Texte digital abbilden und in Audio verwandeln - Analyse: Computer soll Sprache des Benutzers verstehen
- Pen-basierte UIs Pen-basierte UIs erlauben es Benutzern präzise Informationen auf eine 2D-Fläche einzugeben (schreiben, zeichnen)Analogie zu Stifteingabe durch induktive Technologien
- Touch-basierte UIs Touch-basierte UIs sind Schnittstellen, die auf die Berührung des Benutzers reagierenTechnologien zur Toucherkennung:optisch (Licht/Laser wird durch Finger unterbrochen)resistiv (Druck)kapazitiv (elektrisches Feld)induktiv (Grafikpens)
- Air-basierte UIs (Mid-)Air-basierte UIs sind Schnittstelen, die Gesten im Raum erkennenUnterschied zu Touch ist fehlendes haptisches Feedback sowie ggf. zusätzliche Freiheitsgerade
- Haptische UIs Haptische UIs unterstützen Berührungssinn durch Kraft, Vibration oder Bewegung des BenutzersErzeugung von haptischem Feedback benötigt i.d.R. Instrumentierung des Benutzers
- Anzeige
- Multimodal UIs Multimodal UIs sind Schnittstellen, die mehrere Modalitäten (z.B. Sprache und Gesten) des Benutzers gleichzeitig unterstützt. (Synthese und Analyse)
- Tangible UIs Tangible UIs sind Schnittstellen, bei denen Personen mit digitalen Informationen durch physikalische Umgebung interagieren können.Beispiel:Physikalische Form (Landschaft mit vielen Quadraten (höhe Tiefe)
- AR & MR Augmented Reality (AR)Überlappung der realen Welt durch virtuelle InformationenAugmented Virtuality (AV)Erweiterung der virtuellen Welt durch Objekte oder Informationen der realen WeltVirtual Reality (VR)Ist eine vollständig vom Computer-generierte UmgebungMixed Reality (MR)vereinbart alle Möglichkeiten
- Wasserfallmodell Linear oder Linear mit Rücksprüngen.Problem ist, dass viel Geld fließt, bevor der Kunde den ersten Kontakt zum Produkt hat.-> Benutzereinbindung im Wasserfallmodell sehr spät- keine signifikante Änderung der Produkfuntionen oder -struktur mehr möglich, sondern meist nur kosmetische VerbesserungBesser: V-Modell (jeder Phase steht ein phasenweiser Test gegenüber) Grafik5 Schritte zur Verringerung von Risiken:STEP 1: Preliminary Program Design (vorläufiger Programmentwurf)STEP 2: Document the Design (Entwurf dokumentieren)STEP 3: Do it Twice (Nicht jeden Schritt wie ein Wasserfall behandeln)STEP 4: Plan, Control & Monitor TestingSTEP 5: Involve Customer
- Probleme linearer Modelle - Entwicklungsprozesse laufen meist nicht geradlinig ab- Rückschritte führen zu Verzögerung und Kosten- verspätete Änderung in Anforderungen lassen sich nur schwer (oder gar nicht) umsetzen- Schritte benötigen unterschiedlich lang- menschliche Ressourcen werden oft nicht optimal genutzt.- finales Produkt ist erst am Ende zu erkennen (keine Prototypen)
- Iterative Modelle - beschreiben Prozesse bei der meist inkrementelle Verbesserung (häufig) in kleinen Schritten vollzogen werden- stellen realistischere Modelle als das WFM dar.Probleme: Teilprodukte können nachträglich nur schwer geändert werden (bsp. Videosclisp müssen komplett neu produziert werden) Aktivitäten können innerhalb einer Iteration unterschiedlich lange Zeit benötigen Entwicklungszyklen müssen gelegentlich stärker voneinander entkoppelt werden Beispiele:SpiralmodellUnified ProcessRational Unified Process
- Prototyping - bezeichnet den Weg von Sketches oder skizzenartigen Prototypen durch schrittweise Entwicklung zu verfeinerten Prototypen.- Prototypen beinhalten bereits tatsächliche (horizontale & vertikale) Funktionalität- Risikominimierung durch Evaluation vom AuftraggeberEs gibt:○ Wegwerf-Prototypen (throw away prototypes) aus denen nur die Erkenntniss weiter verwendet wird.○ Evolutionäre Prototype (evolutionary prototypes) , die in jeder Iteration weiter verfeinert werden und aus denen das finale interaktive Produkt entsteht. Arten: Sketches und Storyboards Papier-Prototypen Video-Prototypten Wizard-of-Oz (Mensch simuliert System)
- Warum Sketches? geben ersten Eindruck im frühen Zeitpunkt der Entwicklung Diskussionen der Skizzen machen bereits auf Verständnisprobleme und Fehler aufmerksam geringes Zeit-Investment (1 Sketch = 6 Sekunden vs. 1 interaktiver Prototyp = 10 Std)
- Sketch vs. Prototyp Sketch - Prototyp andeutend - beschreibendfragend - beantwortendvorschlagend - auflösendprobierend - spezifizierend
- Spiralmodell Spiralmodell arbeitet zyklisch in Quadranten Ziele aufstellen Risikoanalyse und Prototyping Entwicklung und Test Planung des nächsten Zyklus Management kann nach jedem Zyklus eingreifen.Wesentlicher Aspekt des Modells ist Risikobetrachtung:- sämtliche Risiken, die Projekt bedrohen werden identifiziert und bewertet- Projekt schlägt fehl, wenn größte Risiken nicht beseitigt werden können- falls keine Risiken mehr exisiteren, wird Projekt abgeschlossen
- Unified Process Iteratives Vorgehensmodell- Anwendungsfallgetrieben- Risikofokussiert4 Phasen1. Initialisierung2. Ausarbeitung3. Entwicklung4. ÜbergabeRational Unified Process ist konkrete Implementierung des Unified Process
- Rational Unified Process Rational Unified Process ist konkrete Implementierung des Unified Process
- CHAOS-Studie Studie beschäftigt sich mit Erfolg und Misserfolg von IT-ProjektenTyp 1 - Projekt erfolgreich abgeschlossen: Das Projekt wurde rechtzeitig, ohne Kostenüberschreitung und mit dem ursprünglich geforderten Funktionsumfang abgeschlossen.Typ 2 - Projekt teilweise erfolgreich: Das Projekt wurde abgeschlossen, es kam jedoch zu Kosten- und/oder Zeitüberschreitungen oder es wurde nicht der vollständige geplante Funktionsumfang erreicht.Typ 3 - Projekt nicht erfolgreich: Das Projekt wurde abgebrochen.
- UCD-Modelle Mensch-zentrierte Prozesse (User Centered Development) sind iterative Vorgehensmodelle beim Entwurft von interaktiven Systemen, bei denen Menschen mit ihren Zilen und Bedürfnissen im Vordergrund stehen.
- ABC-Modell Bedienung von interaktiven System zerfällt in zwei Aspekte:1. Benutzer muss Aufgabe erfüllen 2. Benutzer möchte/soll Computersystem zur Lösung verwenden- bildet Grundlage um ergonomische Prinzipien der Programmierung im IT-Bereich zu definieren
- UCD-Methoden 1. Definition des Kontexts Details über Nutzung (beruflich, privat) Marktanalyse (Erwartungen rausfinden)2. Beschreibung der Benutzer Betrachtung des Menschen -> Personas Primäre (direkte), Sekundäre(Gelegenheits), Tertiäre Benutzer (Entscheider über Kauf)3. Task-Analyse Die Frage nach dem Was? Grundlage sind Interviews und Beobachtungen von Benutzern4. Anforderungsspezifikation5. Systementwurf / Basisdesign Zusammenfassung aller Komponenten und überprüfung, ob nicht zu teuer, rechtlich etc)6. Iterative Mockups & Prototypen Starten mit Entwürfen -> Prototyp7. Usability Tests und Alternativen In frühen Phasen "Expertenevaluation" In späten Phasen "Benutzerevaluation" (Benutzer sollen Aufgaben lösen)8. Iterative Tests & Redesign9. Updates & Wartung Rückmeldung von Benutzern
- PACT People, Activities, Technology, Context (alles in Wechselwirkung)PeopleActivitesTechnology (Möglichkeiten) Eingabe (Input) beschreibt, wie Benutzer Daten und Instruktionen sicher und zuverlässig zum interaktiven System bekommen Ausgabe (Output) beschreibt Art und Weise, wie interaktives System Benutzer Inhalte darstellt. Kommunikation (Communication) beschreibt Aspekte der Übertragung von Daten Kontent (Content) beschreibt Aspekte der Daten z.B. Aktualität Context (Anforderungen) Physikalische Umgebung○ Licht, Lautstärke, Luftfeuchtigkeit Sozialer Kontakt○ Privatspähre, soziale Normen Organisationskontext○ Hierarchien, Kommunikationsstruktur
- Experience-Ziele (Benutzer) Wie will sich der Benutzer fühlen?
- Life-Ziele (Benutzer) Wer/was will Benutzer sein?
- Personas Persona ist archetypische Benutzerfigur, die stellvertretend für reale Benutzer steht Persona bündelt Nutzergruppen bildhaft in konkrete hypothetische Person Personas sollten genau beschrieben werden (Name, Alter, Geschlecht, Bildung, ...) alle in Anwendungsfällen (Use Cases) auftretenden Benutzer sollten Personas sein Welche Personas sollten für Kunden einer E-Commerce-Website betrachtet werden?Tracker wissen exakt, welches Produkt sie wollen und vergleichen Preise, Lieferkosten und -zeiten Hunter wissen zwar Kategorie, benötigen aber Hilfe bei der Auswahl des exakten Produktes Explorer suchen Inspirationen und erkunden die Website Vorteile○ Alle Mitarbeiter entwickeln gemeinsames Verständnis ihrer Nutzer○ Produkt wird nicht an subjektiven Meinungen ausgerichtet, sondern an Anforderungen der Zielgruppe○ Meinungsverschiedenheiten werden durch Personas objektiviert und geklärt
- Anzeige
- Szenario Szenario ist typischer Ablauf als Sacherzählung z.B. bei Nutzung eines interaktiven Produktes durch Persona Beispiel (Aufnehmen eines Schadenfalls): 15 Uhr, Jakob S. Telefon klingelt Auf seinem Bidlschirm Infos des Anrufer Begrüßung des Kunden, der kaputtes Fenster melden möchte Auswahl aus verschiedenen Versicherungsverträgen Schadensfall aufgenommen Schlüsselpfad-Szenarien beschreiben die am häufigsten durchgeführten AktionenVarianten-Szenarien leicht Abwandlung der Schlüsselpfad-SzenarienDurchaus-Szenarien: notwendige, aber seltene AktionEdge-Case-Szenarien: untypische Situationen
- User Stories / Epics User Stories sind in Alltagssprache formulierte Software-AnforderungenWer will was warum?"Als <Nutzer/Rolle> möchte ich <Ziel> um <Nutzen>" Beispiel mit dem zerbrochenen Fenster:„Als Versicherungsnehmermöchte ich eine zerbrochene Fensterscheibe melden,um finanziell entschädigt zu werden.“ „Als Versicherungssachbearbeitermöchte ich einen Schadensfall aufnehmen,um einen zufriedenen Kunden zu haben.“
- Use Case Schrittweise Beschreibung eines Prozess, welcher Benutzer hilft Ziel zu erreichen.Beispiel:Use Case: Versicherungspolicen vom Kunden über dessen Versicherungsnummer suchenAkteur: VersicherungssachbearbeiterSchritte: In Suchformular 1. "Versicherungsnummer" eintragen 2. "Suchen"-Button drücken
- Was ist HTA? Hierarchische Aufgabenanalyse zerlegt Aufgaben in Teilaufgaben mit Hierarchien und Plänen.Hierarchische Berschreibung:0. Tasse Tee machen 1. Wasser kochen 1.1. Kessel mit Wasser füllen 1.2. Kessel auf Herd stellen 1.3. Warten bis Wasser kocht 1.4. Herd ausstellen 2. Kanne leeren 3. Teeblätter in Kanne geben 4. heißes Wasser in Kanne gießen 5. 3-8 Minuten warten 6. Tee in Tasse eingießenPlan 0:DO 1. AND IF Kanne.isVoll() DO 2.DO 3. - 4.DO 5. (wrt. Teesorte)DO 6.Plan 1 (Wie läuft der Wasserkochvorgang ab)
- Qualitative und Quantitative Daten Qualitativ: nicht-numerisches MaterialNotizen, Fotots, Audio, Videos, ...Qualitativ: numerische MessungenMessdaten, Interaktionslogs
- Datenerhebungsarten Interviews und Fokusgruppen Fragebögen und Nutzertagebücher Direkte und Indirekte Beobachtungen
- Interviews Interviews Fragearten:geschlossene Fragen geben Antwortschema vor:Haben Sie schonmal einen Touch-Scree n verwendet? - ja oder nein? offene Fragen benutzen kein vorgegebenes AntwortschemaWofür verwenden Sie Touch-Screens?Vorteile:○ direkter Eingriff bei Missverständnissen und Unklarheiten möglich○ quantitative und qualitative DatenNachteile:○ hohe soziale Kompetenz beim Interviewer notwendig○ Fehlermöglichkeit durch Suggestivfragen
- Think-Aloud-Technik Bei Erledigung einer Aufgabe laut mitsprechen
- "Form folgt Funktion" Das heißt Form soll sich aus Funktion ableiten & aus Form soll Funktion abgeleitet werden können.
- Was sind Eigenschaften von gutem Design? Gutes Design... … ist innovativ … macht Produkt brauchbar … macht Produkt verständlich … ist unaufdringlich … ist ehrlich … ist langlebig
- Affordanz Affordanzen sind alle vom Gegenstand zur Verfügung gestellten Gebrauchseigenschaften.Ein Stuhl ist für den Menschen bspw. als Sitzmöglichkeit oder Tritt zu sehen.Grenzen:○ Affordanzen alleine reichen bei komplexeren Interaktionen nicht aus - Beispiel: Regler suggerieren zwar, dass sie mit Hand umschlossen und gedreht werden können, aber es gibt keine Hinweise zur RichtungLösung: mentale Modelle
- Skeuomorphismus Skeuomorphismus ist Stilrichtung, bei derObjekte Material / Form älterer, vertrauterGegenstände nachahmen, ohne dass diesedurch Funktion begründet ist
- Flat Design Flat Design beschreibt einen grafisch minimalistischen Gestaltungsstil Gegenstrom zum Skeuomorphismus
- Minimales Design Grundregeln Reduktion: so einfach wie möglich, so komplex wie nötig (im Zweifel weglassen) Organisation: lässt Vielzahl geringer erscheinen, z.B. durch Auslagern Zeit: verzögerungsfreie Interaktion wird als einfach empfunden Lernen: Wissen macht alles einfacher Vertrauen: sinnvolle Vorschläge durch Automatisierung lassen System als einfach erscheinen Scheitern: Manches kann nicht vereinfacht werden Einfachheit: Einfachheit heißt das Offensichtliche entfernen und das Bedeutsame hinzufügen
- Interface Metaphern Interface Metaphern bestehen aus Menge von Objekten, Aktionen und Prozeduren, die konzeptionelles Modell widerspiegeln.Sie helfen dem Benutzer entsprechendes mentales Modell aufzubauen.z.B. Buttons wie "Einkaufswagen" / "zur Kasse gehen"
- Mapping Hauptaufgabe des IxD ist es (interne) Intentionen der Benutzer auf (externe) Gestaltungselemente (z.B. Formen, Buttons oder Icons) abzubilden.Wenn Abbildung (Mapping) gelingt, ist Design gelungen.
- Binnengliederung Die Binnengliederung bezeichnet in der Gruppenpsychologie die Aufteilung einer Gesamtgruppe in zwei oder mehrere Untergruppen.1. Gesetz der Ähnlichkeit2. Gesetz der Nähe3. Gesetz der Fortsetzung4. Gesetz der Einfachheit
- KISS-Regel "keep it simple and stupid"
- Greeking Beim Greeking wird Text durch Zufallswörter ersetzt, aber die Struktur der Elemente bleibt erhalten
- Design-Regelwerke (Heuristiken) Heuristiken bzw. Goldene Regeln sind Gestaltungsregeln, die meist einfach aber konkret formuliert einen Empfehlungscharakter haben Beispiele:○ Konsistenz - Verwendung von Styleguides○ Unterschiedliche Erfahrung berücksichtigen - Anfänger (Menüs), Erfahrene (Shortcuts)○ Rückmeldung auf Benutzeraktion - insbesonders wenn Aktion lange dauert○ Zusammenfassung abgeschlossener Operation○ Fehler verhindern - eindeutige Darstellung + Alternativen○ Undo - steiger Sicherheitsgefühl○ Geringe Belastung Arbeitsgedächtnis - Erkennen statt erinnern (menü breit, statt tief)