Brainscape's Knowledge GenomeTM


Top Flashcards (Certified)
All Flashcards

Interaktionsdesign > User Interface Pattern > Flashcards

User Interface Pattern Flashcards

1
Q

Was sind Interface Pattern?

A

bieten Lösung für Reihe von gleichartigen Designproblemen im Bereich der Benutzerschnittstellen

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Was sind Interface Idiome?

A

beschreiben Muster für Typen oder Stile verschiedener Benutzerschnittstellen
- Gewöhnung und Vertrautheit (engl.
Familiarity) setzen bei wiederkehrende
Nutzung ein

Text-Editor, Formulare, Tabellenkalkulation

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Verhaltensmuster

Was ist Safe Exploration?

A

“Let me explore without
getting lost or getting into trouble.”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

Verhaltensmuster

Was ist Instant Gratification?

A

“I want to accomplish something now,
not later.”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

Verhaltensmuster

Was ist Satisficing?

A

“This is good enough.
I don’t want to spend more time
learning to do it better.”

satisfying + sufficient

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Verhaltensmuster

Was ist Changes in Midstream?

A

“I changed my mind
about what I was doing.”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

Verhaltensmuster

Was ist Deferred Choices?

A

“I don’t want to answer that now; just let me finish.”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Verhaltensmuster

Was ist Incremental Construction?

A

“Let me change this. That doesn’t look right; let me change it again; that’s better!”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Verhaltensmuster

Was ist Habituation?

A

“That gesture works everywhere else, why
doesn’t it work here, too?”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

Verhaltensmuster

Was sind Microbreaks?

A

“I’m waiting for the train.
Let me do something useful for two minutes.”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Verhaltensmuster

Was ist Spatial Memory?

A

“I swear that button was here a minute ago.
Where did it go?”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Verhaltensmuster

Was ist Prospective Memory?

A

“I’m putting this here to remind myself to
deal with it later.”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

Verhaltensmuster

Was ist Streamlined Repetition?

A

“I have to repeat this how many times?”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Verhaltensmuster

Was ist Keyboard Only?

A

“Please don’t make me use the mouse.”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

Was ist Atomic Design?

A

Methodik zur Erstellung
von interaktiven Systemen, die sich in fünf verschiedene Stufen gliedert:

  1. Atome (engl. Atoms)
  2. Moleküle (engl. Molecules)
  3. Organismen (engl. Organisms)
  4. Muster (engl. Templates)
  5. Seiten (engl. Pages)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

Was ist das Feature/Search/Browse Pattern?

A
  1. Artikel bzw. Produkte (engl. Features),
  2. Suchfunktion (engl. Search) und
  3. Liste von Items, die durchstöbert werden können (engl. Browse)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

Was ist das News Stream Pattern?

A

zeigt zeitsensitive Daten in umgekehrter chronologischer Liste, d.h. aktuellster Item oben etc.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

Nach dem News Stream Pattern, welche Informationen sollte jedes Item haben?

A

Was?, Wer?, Wann?, Wo?

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

Was ist das Picture Manager Pattern?

A

zeigt Vorschaubilder (engl. Thumbnails) in Grid-Struktur (engl. Thumbnail Grid) von Fotos, Videos oder
sonstigen piktoriellen Items

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

Was ist das Dashboard Pattern?

A
  • arrangiert Daten in einzige Darstellung mit hoher Informationsdichte, welche regelmäßig aktualisiert wird
  • können häufig benutzerspezifisch personalisiert werden
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

Was ist Canvas Plus Palette?

A
  • bei grafischen Editoren
  • Leinwand und ikonische Palette
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

Was ist das Pattern Wizard?

A
  • d leitet Benutzer Schritt-bei-Schritt durch Aufgabe in vorgegebener Reihenfolge
  • Aufgabe des Nutzers chunken
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

Was ist das Alternative Views Pattern?

A

erlauben es Benutzern alternative Ansichten auf Daten zu erhalten

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

Was ist das Many Workspaces Pattern?

A

erlauben es Benutzern mehrere Top-Level-Tabs oder
Gruppen von Tabs i.d.R. nebeneinander zu sehen

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Was ist das Multi-Level Help Pattern?
bieten Benutzern Hilfe unterschiedlichen Grades an verschiedenen Stellen an
26
Beschreib Hub & Spoke
27
Beschrieb Fully-Connected
28
Beschreib Multi-Level
29
Beschreib Stepwise
30
Beschreib Pyramid
31
Beschreib Pan & Zoom
32
Beschreib Modal Window
33
Beschreib Clear Entry Points
34
Beschreib Bookmarks
35
Beschreib Escape Hatch
36
Was ist Nested Doll?
37
Was ist Bento Box?
38
Was ist Filtered View?
bietet unterschiedliche Ansichten auf gleichen Datenbestand
39
Was ist eine Sequence Map?
40
Was ist Deep-linked state?
erlaubt es Benutzern Status oder Ort einer Seite zu speichern und/oder zu versenden
41
Was ist eine Menu Page?
erlauben es Benutzern aus einer großen Menge von Informationen zu selektieren
42
Was sind Fat / Mega Menus?
erlauben es Benutzern alle Optionen einer Seite auf einem Blick zu erkunden
43
Was sind Breadcrumbs?
44
Was ist eine annotated scrollbar?
dient Benutzer als Indikator für wesentliche wichtige Abschnitte im Dokument in der Nähe der Scrollbar-Position
45
Was ist eine Center Stage?
unterstützt Benutzer bei Erfüllung einer bestimmten (Haupt-)Aufgabe
46
Benenne
Grid of Equals
47
Benenne
Titled Sections
48
Benenne
Module Tabs
49
Benenne
Accordion
50
Benenne
Collapsible Panels
51
Benenne
Moveable Panels
52
Benenne
Diagonal Balance
53
Was ist Responsive Enabling?
startet mit Benutzerschnittstelle, die weitestgehend disabled erscheint und bei der Schritt-für- Schritt mehre Elemente enabled werden
54
Was ist Responsive Disclosure?
startet mit Benutzerschnittstelle, die wo wenig erscheint und bei der Schritt-für- Schritt mehre Elemente angezeigt werden
55
Was ist Liquid Layout?
passt Inhalt an sich verändernde Fenstergrößen an, so dass Fenster konstant “gefüllt” sind
56
Was sind Dark Pattern?
sind UI-Pattern, die darauf ausgelegt sind, Benutzer:innen dazu zu bringen, bestimmte Tätigkeiten auszuführen, die deren Interessen entgegenlaufen
57
Was ist Two-Panel Selector?
erlaubt Auswahl einzelner Items in einzigen Side-by-SideAnsicht
58
Was ist One-Window Drilldown?
erlaubt Auswahl eines Items aus Liste, wobei selektierte Items daraufhin bildschirmfüllend zuvor dargestellte Liste ersetzt
59
Was ist List Inlay?
zeigt Liste von Einträgen in Spalten bei der selektierte Auswahl (mit Zusatzinformationen) innerhalb der Liste angezeigt wird
60
Was sind Thumbnail Grids?
zeigt Menge von Items, die in Gitter oder Matrix angeordnet sind (vgl. Grid of Equals)
61
Was ist Row Striping?
62
Was ist Jump To Item?
63
Was ist Alphabet Scroller?
64
Was ist eine Cascading List?
stellen Hierarchie von selektierbaren Listen von Items dar
65
Was ist ein Tree Table?
stellt zeilenweise Liste von Items mit mehreren Spalten innerhalb einer Tabellenstruktur dar, wobei erste Spalte Baumstruktur enthält
66
Was ist New-Item Row?
erlaubt es Benutzer neues Item am Anfang oder Ende einer Liste durch One-Click zu erstellen
67
Was sind action panel?
* zeigen verbundene Aktionen, die im UI ständig sichtbar sind * werden anstelle von Menus oder Button Groups verwendet, wegen Sichtbarkeit, verfügbarer Platz und Freiheit bei Präsentation
68
Was sind Smart Menu Items?
sind Menü-Einträge, die Aussehen in abhängig von tatsächlichen Aktion modi!zieren können
69
Was sind Macros?
sind Aktionen, die benutzerspezifizierte Sequenz von Aktionen enthalten, die als eine Aktion aufgerufen werden können
70
Was ist Overlay Plus Detail?
zeigt Informationsgrafik neben zusätzlicher Detailansicht an
71
Was ist Local Zooming?
hilft komplexe Daten in Ansicht zu explorieren, indem Benutzer innerhalb dieser Ansicht an Maus-CursorPosition zoomen kann
72
Was sind Datatips?
zeigen zusätzliche Informationen zu Objekten in Informationsgra!k im eigenen Fenster an
73
Was ist ein Data Spotlight?
74
Was ist Data Brushing?
ermöglicht es Benutzern, Daten in einer Ansicht zu selektieren und gleiche Daten synchron in weiterer Ansicht hervorzuheben
74
Was sind Dynamic Queries?
ermöglichen es Benutzern durch (vor-)de!nierte Filter, Teile der Daten mit sofortiger Rückmeldung auszuwählen bzw. deselektieren
75
Was sind sortable table?
zeigt Daten in tabellarischer Form (z.B. Tree Table) bei der Benutzer zeilenweise angeordnete Daten nach Spalten sortieren kann
76
Was sind Radial Table?
* zeigt Daten der Informationsgra!k in Kreisanordnung statt tabellarischer Form an * ermöglicht es Relationen durch Verbindungen durch Kreismitte zu illustrieren
77
Was ist ein Multi-Y Graph?
78
Was sind Small Multiples?
stellen Menge von kleinen Grafiken der Daten bzgl. unterschiedlicher Dimensionen oder Modalitäten dar
79
Was ist eine Treemap?
stellt multidimensionale oder hierarchische Daten als Rechtecke unterschiedlicher Größe innerhalb einer Informationsgra!k dar
80
Was ist das Forgiving Format?
* erlaubt Benutzer, Text in unterschiedlichen Formaten und Syntax einzutragen * erfordert, dass Anwendung Daten ggf. analysiert (engl. parsed) und konvertiert
81
Was ist Fill-in-the-blanks?
ordnet ein oder mehrere Felder in Form eines Satzes an, wobei Benutzer “Freitext-Felder” füllen muss
82
Was ist der Unterschied zwischen Input Hints und Input Prompts?
83
Was ist ein Dropdown Chooser?
erweitert Konzept des Menüs durch Verwendung eines Drop-Down oder Pop-Up Panels, welches ähnliche Auswahloptionen anbietet
84
Was ist ein List Builder?
zeigt gleichzeitig Quell- (engl. Source) und Ziel- (engl. Destination) Liste und lässt Benutzer Einträge zwischen beiden hin- und herschieben, z.B. via Button- oder Drag- &-Drop-Interaktion
85
# Stanford Web Credibility Project 2002 Was ist ein Deep Background?
* stellt Bild oder Gradient in Hintergrund einer Anwendung * erlaubt Fokussierung auf Vordergrund * sollte u.a. weichen Fokus, Tiefenhinweise und keine starken Fokuspunkte verwenden
86
# Stanford Web Credibility Project 2002 Was besagt das Few Hues / Many Values Prinzip?
besagt, dass wenig Farbtöne (ca. 3-5) gewählt werden sollten, die durch verschiedene Stufen der Sättigung und Helligkeit in Palette kombiniert werden
87
# Stanford Web Credibility Project 2002 Was besagt das Corner Treatments Prinzip?
* dass (anstelle von rechten Winkeln) Kurven oder Diagonalen für einige Ecken im UI verwendet werden sollten * sollten konsistent innerhalb des UI Design sein
88
# Stanford Web Credibility Project 2002 Was besagt das Border Echo Fonts Prinzip?
dass Ränder gleiche/ähnliche visuelle Gestaltung (z.B. Farbe, Dicke und Kurvenverläufe) wie Haupt-Schriftart des UI haben sollte
89
# Stanford Web Credibility Project 2002 Was sind Hairlines?
erlauben visuelle Trennung unterschiedlicher Inhalte durch (Trenn-)linien
90
# Stanford Web Credibility Project 2002 Was besagt das Contrasting Fonts Prinzip?
dass mindestens zwei kontrastreiche Schriftarten verwendet werden sollten
91
Beschreib Milgram’s Kontinuum
92
Welche drei Anforderungen muss VR erfüllen?
* Echtzeit-Rendering * Räumlichkeit * Interaktivität
93
# In VR Was ist Immersion?
beschreibt bis zu welchem Grad Technologie die Illusion realer Umgebung für Nutzer:innen schaffen kann
94
# In VR Was ist Präsenz?
Bewusstseinszustand, der Illusion darstellt, das Gefühl zu haben in virtueller Umgebung zu sein
95
Wie hängen Immersion und Präsenz zusammen?
Immersion (objektiv in technologischer Hinsicht) kann subjektives Präsenzgefühl hervorrufen
96
Aus welchen Komponenten besteht Präsenz?
97
Beschreib
98
Beschreib
99
Beschreib
100
Was sind die fünf Hauptaufgaben im 3D-Raum?
1. Navigieren & Wegfindung 2. Systemkontrolle 3. Symbolische Eingaben 4. Selektion 5. Manipulation

Interaktionsdesign (6 decks)

Brainscape helps you reach your goals faster, through stronger study habits.
© 2025 Bold Learning Solutions. Terms and Conditions