- 1 Abschnitt
- 10 Lektionen
- Um den Kurs in deinem Profil zu hinterlegen klicke oben auf Starten
- Benutzerschnittstellen11
- 1.1Einführung in Benutzerfreundlichkeit (Usability)
- 1.2Ergonomische Gestaltung von Benutzerschnittstellen
- 1.3User Experience (UX) Design
- 1.4Kundenanforderungen verstehen und umsetzen
- 1.5Prototyping und Mockups
- 1.6Usability-Tests und Feedback
- 1.7Responsive Design und Barrierefreiheit
- 1.8Design Patterns und Best Practices
- 1.9Benutzerschnittstellen8 Fragen
- 1.10Aufgaben
- 1.11Lösungen
Lösungen
Aufgabe 1: Grundlagen der Benutzerfreundlichkeit (Usability)
Frage 1: Definition: Usability beschreibt, wie leicht und effizient ein Benutzer mit einem System oder einer Anwendung interagieren kann. Es umfasst Aspekte wie Erlernbarkeit, Effizienz, Fehlervermeidung und Zufriedenheit bei der Nutzung.
Wichtigkeit: Usability ist wichtig, weil sie die Benutzererfahrung verbessert, die Effizienz steigert, Fehler reduziert und die Zufriedenheit der Benutzer erhöht. Gut nutzbare Produkte haben eine höhere Akzeptanz und führen zu geringeren Supportkosten.
Frage 2: 1. Konsistenz (Consistency):
- Beschreibung: Gleichartige Elemente und Handlungen sollten einheitlich gestaltet sein, um die Benutzerfreundlichkeit zu erhöhen.
- Beispiel: Schaltflächen zum Speichern und Abbrechen sollten immer an derselben Stelle und mit denselben Symbolen erscheinen.
2. Feedback:
- Beschreibung: Das System sollte dem Benutzer Rückmeldung über die aktuellen Vorgänge geben.
- Beispiel: Nach dem Absenden eines Formulars sollte eine Bestätigungsmeldung angezeigt werden.
3. Fehlervermeidung (Error Prevention):
- Beschreibung: Systeme sollten so gestaltet sein, dass Benutzer möglichst keine Fehler machen können.
- Beispiel: Eine Schaltfläche zum Löschen sollte eine Bestätigungsaufforderung anzeigen, um unbeabsichtigtes Löschen zu verhindern.
Frage 3:
| Prinzip | Beispielwebsite: Suchmaschine | Bewertung (1-5) | Kommentar |
|---|---|---|---|
| Konsistenz | Einheitliche Gestaltung der Buttons | 5 | Alle Buttons sehen gleich aus |
| Feedback | Anzeige von Suchergebnissen | 4 | Suchergebnisse werden sofort angezeigt |
| Fehlervermeidung | Autovervollständigung bei Sucheingabe | 4 | Fehlerhafte Eingaben werden reduziert |
| Sichtbarkeit des Systemstatus | Ladeanimation bei der Suche | 3 | Manchmal unklar, ob die Suche noch läuft |
Aufgabe 2: Ergonomische Gestaltung von Benutzerschnittstellen
Frage 4: Ergonomische Gestaltung: Ergonomische Gestaltung bezieht sich auf die Entwicklung von Produkten, Systemen und Umgebungen, die den Anforderungen und Fähigkeiten der Benutzer entsprechen. Sie ist wichtig, weil sie die Effizienz, Effektivität und das Wohlbefinden der Benutzer verbessert.
Frage 5: 1. Farben und Kontraste:
- Beschreibung: Verwende ausreichend Kontraste zwischen Text und Hintergrund, um die Lesbarkeit zu verbessern.
- Beispiel: Dunkler Text auf hellem Hintergrund sorgt für bessere Lesbarkeit.
2. Schriftarten und -größen:
- Beschreibung: Wähle gut lesbare Schriftarten und angemessene Schriftgrößen.
- Beispiel: Serifenlose Schriftarten wie Arial oder Helvetica sind gut lesbar, eine Mindestschriftgröße von 16px wird empfohlen.
Frage 6: Skizze einer Login-Seite:
+------------------------------------------------------+
| Login |
+------------------------------------------------------+
| Benutzername: [________________________] |
| Passwort: [________________________] |
| [Anmelden] |
+------------------------------------------------------+
| Passwort vergessen? | Registrieren |
+------------------------------------------------------+
Ergonomische Prinzipien:
- Konsistenz: Gleiche Schriftarten und Farben für alle Eingabefelder und Schaltflächen.
- Sichtbarkeit: Klare Beschriftungen und ausreichend Platz zwischen den Elementen.
- Fehlervermeidung: Benutzerfreundliche Fehlermeldungen bei falscher Eingabe.
Aufgabe 3: User Experience (UX) Design
Frage 7: Unterschied zwischen Usability und User Experience (UX):
- Usability: Konzentriert sich auf die Benutzerfreundlichkeit und die Effizienz, mit der Benutzer ihre Ziele erreichen können. Aspekte wie Erlernbarkeit, Effizienz, Fehlervermeidung und Zufriedenheit stehen im Vordergrund.
- User Experience (UX): Geht über Usability hinaus und berücksichtigt das gesamte Benutzererlebnis, einschließlich emotionaler und subjektiver Aspekte wie Freude, Vertrauen und Zufriedenheit bei der Nutzung des Produkts.
Frage 8: 1. Benutzerinterviews:
- Beschreibung: Gespräche mit Benutzern, um deren Bedürfnisse, Erwartungen und Probleme zu verstehen.
- Beispiel: Interviewe Benutzer, um herauszufinden, welche Funktionen sie in einer neuen Software erwarten und welche Herausforderungen sie mit der aktuellen Software haben.
2. Benutzerumfragen:
- Beschreibung: Schriftliche Umfragen, um strukturiertes Feedback von vielen Benutzern zu sammeln.
- Beispiel: Erstelle einen Fragebogen, der Fragen zu den gewünschten Funktionen und zur Benutzerfreundlichkeit der aktuellen Software enthält.
Aufgabe 4: Prototyping und Mockups
Frage 9: Unterschied zwischen Low-Fidelity und High-Fidelity Prototypen:
Low-Fidelity Prototypen: Einfache, schnelle Skizzen oder Papierprototypen, die grundlegende Layouts und Ideen darstellen.
- Beispiel: Handgezeichnete Skizzen einer Benutzeroberfläche.
High-Fidelity Prototypen: Detaillierte und interaktive Modelle, die dem Endprodukt sehr nahe kommen.
- Beispiel: Interaktive Prototypen, die mit Tools wie Adobe XD, Sketch oder Figma erstellt wurden.
Frage 10: Erstellen eines interaktiven Prototypen mit Figma:
Schritte:
- Projekt anlegen: Erstelle ein neues Projekt in Figma.
- Frame erstellen: Erstelle einen Frame (z.B. für eine mobile Ansicht).
- Elemente hinzufügen: Füge UI-Elemente wie Buttons, Eingabefelder und Navigationselemente hinzu.
- Interaktionen definieren: Definiere Interaktionen zwischen den Elementen, z.B. durch Verknüpfung von Buttons mit anderen Frames.
- Prototyp testen: Teste den interaktiven Prototypen in Figma, um sicherzustellen, dass alle Interaktionen wie erwartet funktionieren.
- Feedback einholen: Zeige den Prototypen Benutzern und Stakeholdern, um Feedback zu sammeln und Verbesserungen vorzunehmen.
