Flashcards
Interaktive Systeme
Cards in this deck (110)
- 1Human Interface Compter
- 2Layers of Input Processing
- 3Interaction Elements- Components of the UI to manipulate the state of UI and domain objects
- Fit physical input/output devices to human effectors/sensors (shape, behavior, ergonomics)
- Apply interaction elements to domain objects - 4Input DevicesMouse
- Actions: Press, release
- States: Pressed, released
- 5Hard and Soft controls- Hard control is a physical input device
- Soft control is a software interface - 6Control-Display Relationships- Relationship between operation of a control and effect on display
- spatial relation
- Dynamic relationship - 7Spatial Relation- if control DOF < display DOF, modes are necessary to fully access the display DOF (z.B rotation with a mouse)
- 8Control Display (CD) Gain- Quantifies amount of display movement for a given amount of controller movement
- Speed Accuracy Trade off
- Opposing relationship between gross and fine positioning times
- 9Latency- latency is the delay between input action and response on display (noticeable in for example VR)
- 10Widgets- user interface elements
- tools to manipulate content
- verb to object relationship: Widget -> Verb , content -> object
- 11No Chrome- widgets are in conflict with actual content (need screen space, visual clutter)
- Philosophy: interface elements should get out of the way to let user focus (works well for experts and media consumption) - 12Widget Categories- Imperative (buttons)
- Selection (check box)
- Entry (sliders)
- Display (scroll bar) - 13Focus and Hover- Focus: at most one widget is in focus and there is a focus order
- Hover: widgets respond to mouse movement above them - 14Scene Graphs- Set of trees of graphical objects (nodes)
- Allows post-hoc transformation of structure (z.B size changes)
- Creating graphics by modifying the scene graph
- Efficient
- Elements: Node (Parent (Group, Region(control, pane)), ImageView, Shape)
- - 15Panes-BorderPane, HBox Pane, VBox Pane, StackPane, GridPane, FlowPane, AnchorPane
- 16Declarative Layout DefinitionAllows for constructing scene graphs declaratively
Xml structure cooreponds to UI structure
More clearly shows ui structure than procedural code - 17List View (Example of item collections)- Scrollable list of items
- automatically observes changes in data model - 18Model View Controller (MVC) Pattern- Often, view and controller merge (as in ListView)
- flexibility, modularity, seperation of concerns
- 19Focus vs. SelectionFocus: focused item
Selected: Selected Items
- 20Property Binding- A property can be bound to another property (values are linked)
Example: A label that always shows the focused list item
- Property either encapsulates a value or is bound to an observable value
- Property publishes change notifications - 21Interface Observable- Informs other objects when its state changes
- Can register listeners - 22Reactive Programming- Focus on dataflow
- Automatically propagate changes
- Imperative programming assigns value when expression is evaluated
- reactive keeps value up to date when components change - 23Event Streams Example
- 24SceneGraph: Event Delivery
- 25SceneGraph: Coordinate Systems- Scenegraph has multiple coordinate systems
- x,y - sceneX,sceneY - screenX, screenY
- Each node has own coordinate system - 26Affine Transformation- modifys a nodes local coordinate system
- linear mappings of coordinates (represented as matrices)
- Translation: shifts origin of coordinate system along x or y axis
- rotation: rotates the coordinate system
- scaling: scales axes
- shearing: rotates the axes, such that they are no longer perpendicular - 27Scene Node Properties- Cursor: The mouse cursor image (z.B an hand)
- Effects: Blurring, shadow, reflection
- Clipping: a node that defines the clipping shape
- Opacity: degree of transparency - 28JavaFX Threads- Application Thread: Primary Thread
- Render Thread: Updates interface at 60 fps
- Worker threads: long running tasks, programmer-defined - 29Concurrency- UI has to stay responsive
- Long task should run on different thread
- Access Javafx scenegraph only over application thread
- Communication between worker threads and application thread - 30Concurrency API- Worker: interface for objects performing work on background thread
- Task: executes work
- Service: Executes tasks - 31Static/Dyamic Web UI strutcureStatic: DOM, CSS, HTML
Dynamic: DOM, Events, JS - 32Document Object Model (DOM)Browser represent parsed html/css as tree
W3C specified api for this tree
Can access and modify nodes - 33DOM: Fundamental Data InterfacesNode: every object in tree is a node
Document: represents loaded page
Element: base interface for element objects (HTML, SVG)
Element attributes
text: text of an element
event: event triggered by user or programmatically
event target: receiver objects of events
Mutationobserver: observes changes in dom tree - 34DOM: Event FlowCapture Phase: from window to targets parent
Target Phase: event reaches event target
Bubble Phase: from targets parent to window
- 35Cancelable Events- Can control further processing
- e.g prevent checkbox to change its state - 36UIEvent InterfaceUIEvent provides information associated with user-generated events
Examples: load, select, focus, blur(focusout) - 37Reactive for web- Events streams as layer on top of js events
- map: define mapping of events on stream
- link/bind: from view to model -> Eventlistener to react to user input; from model to view -> modify an html element when dependent obserable is modified - 38VueJSModel View ViewModel architecture
ViewModel: Additional layer between View and Model (converts values between view and model; Bindings between view elements and properties in Viewodel)
- Components (reuseable extensions of html elements)
- Templates - 39Svelte- Declaration of reactive bindings between DOM elements and js objects
- Requires a compilation step (transformation of reactive syntax into relationships) - 40interaction technique definitionAn interaction technique is a way of using a physical input/output device to perform a generic task in a human-computer dialogue
- 41Alignment techniquestranslation, rotation stretching for placing objects in 2D
- Precise spatial relationships with other objects - 42Grid Snapping- Snapping object points to a grid of discrete points
- Less general and flexible than object snapping(predefined grid is not always appropriate)
- Makes scaling difficult (scaled objects may fall between grid points)
- 43Snap draggingWhen objects are dragged or stretched, positions that correspond to preferred ending points are given gravity
- Warp (snap) objects to gravity points when close enough
- 44Traditional snapping
- 45Snap-and-Go- Traditional snapping makes area in close proximity of snap location inaccessible
- snap-and-go stops objects at snap location (shifts cursor position relative to object)
- 46Oh SnapAvoids object jumps towards snap location
Avoids displacement by catching up after snap location - 47Semantic snappingGeometric aspect and semantic aspect
- Geometric: Objects in close proximity snap into positions
- Semantic: Reflects semantic consequences of a snap - 48Pointing techniquesSelecting one object among a larger set of candidates
Tradeoff between precision and speed
Point Cursor: Problematic for small targets
Area Cursors: well suited for small targets (area resizes depending on distance to closest target)
To reduce movement time: increase target size or reduce distance to target. - 49Fitts lawMovement Time: MT=a+b*ID
Index of difficulity: ID = log_2(D/W+1) - 50Bubble Cursor
- 51DynaspotSize of activation area depends on movement speed
- 52Empirical Research- Research: Systematic investigation and study of phenomena in order to establish facts and reach new conclusions
- Empirical: Originating in or based on observation or experience - 53ReproduciblityThe extend to which consistent results are obtained when produced repeatedly
Research write-up must be sufficiently detailed to allow reproduction
Research results are more credible if independently confirmed - 54Problems of research repetitionsDifficult to publish
Expensive
Takes time - 55Replicability/ReproducibilityReplicability: Exact repetition of experiment
Reproducibility: Repetition with some variation in conditions - 56Observe/MeasureOberserve: Starting point
Measurements: empirical evidence - 57Nominal DataCategorical
No mean
count is important - 58Ordinal Dataassociates an order or rank to an attribute
Example: Users rank GPS-Systems
Comparison of greater than or less than possible - 59Interval DataEqual distance between boundaries of intervals of same size
No absolute zero
Example: Temperature in C - 60Ratio DataPreferred scale of measurement
Absolute zero -> many calculations possible
Ratios enable summaries and comparisons - 61ExperimentsThe process of performing a scientific procedure to determine something
Setup artificial conditions, try to uncover relationsships
Document steps of the process
In HCI: what variables, tasks and procedures; How many participants. - 62Good research questionIs the measured entry speed (in words per minute) higher for the new technique than for QSK after one hour of use.
define experimental condition and decide what to measure. - 63Internal/external ValidityInternal: The extent to which the results are due to test conditions
External: the extend to which the results are generalizable to other people and situations
Its tradeoff between the two - 64Independent VariableIndependent of participant behaviour e.g interface, device, layout
In HCI: Must have atleast two levels e.g device: mouse, trackball, joystick - 65Human characteristicsGender, age, height, weight
- 66Dependant variableDepends on what participant does e.g task completion time, speed, accuracy etc.
- 67Random VariableCircumstance that is allowed to vary randomly
z.B Prior experience using a phone in a phoen experiment. Consumed coffee etc.
Improves external validity and compromises internal validity - 68Control VariableCircumstances that are kept constant while testing effect of independent variable
More contol -> less generalizable
Improves internal validity and compromises external validity - 69Cofounding VariableCircumstance that varies systematically with an independent variable
Example camera when the camera distance is an independent variable. - 70QuestionnairesCollect information about participants (demographics, feedback)
- 71Within-Subjects, Between-SubjectsWithin: Each participant is tested on each condition (Fewer participants needed, less variation, negative order effects through learning for example (can be fixed with latin sqiuare)
Between: Each participant is tested on one condition only (No order effects, more participants, more variation, need to balance groups) - 72Null HypothesisQuestion: is the time different to complete task using method A or B
Null hypothesis: there is no difference
Significance test: check if obtained data makes null hypothesis unlikely - 73Randomization Tests with Independent SamplesBetween subject experiments
Each participant provides a single data point
data points are assumed to be independent - 74Randomization test with matched samplesEach participant generates two datapoints
Within subject experiment
Samples are not independent from single participant - 75Parametric/Non-Parametric TestsNon-Parametric: data are not assumed to come from a particular distribution
Parametric: data is assumed to come from distribution e.g normal ditribution - 76Measurement Scales and Statistics
- 77Kind of test
- 78AnovaGoal: determine if independent variable has significant effect on dependent variable
Idea: Compare variability within groups and across group-means
- 79STD, Variance
- 80Errors in Hypothesis testing- Null hypothesis is true (there is no effect)
Experiement yields p <= 0.05 -> null type 1 error (falsely rejected)
Experiment yields p > 0.05 -> correctly accepting
- Null hypthesis is false (there is effect)
p <= 0.05 -> correctly rejecting
p > 0.05 -> type 2 error (failing to reject) - 81Assumption for ANOVADV is normally distributed
Equal variances in groups
Independent observations
ANOVA is robust against violations of normality - 82CHi-square testFor nominal data
compares observed counts against expected - 83Confidence intervalshelp judge the variability of the data
easy to interpret - 84Correlationlinear association between two variables
- 85Descriptive modelsDescribes aspects of reality
Any reduction of a problem space qualifies as a descriptive model - 86Guiards model of bimanual control
- 87Predictive modelspredictive model is an equation
predicts dependent variable based one or more independent variables
They deal with numbers
Without a model its hard to predict other points in space than the ground truth
predicts how the dependent variable varies with change of the independent variable - 88Linear RegressionA linear prediciton equation is found using linear regression
Goal: Given a set of (x, y) sample points, find coefficients m and b for the line that minimizes squared distances of the points from line
Result: equation that yields best y for x
Assumption: Linear relationship - 89Fitts LawModel for rapid aimed movements
Fitts index of difficulty (ID) is a measure of the difficulty of a target selection task
hypothesized that movement time and ID have a linear relationship - 90Keystroke-Level Model (KLM)for predicting human performance with interactive computing systems
Predicts expert error-free task completion times
Elements: Task, Command language, Motor skill parameter, response time parameter - 91Stepwise model selectionpredictor variables (independent) are removed one by one to get the best model.
Backwards Elimination: init model with all predictors -> weak predictors are dropped one at a time -> Select model with highest adjusted R^2 and drop insignificant predictors
Forward selection:
- Initially model contains no predictors
- add strong predictors one at a time
- select model with highest adjusted R^2
add predictor with lowest significant p-value - 92Goals of visualizationidentify patterns, trends etc.
replace cognitive calculations with simple perceptual operations
make data more accessible - 93Augmented CognitionUsing external artifacts to amplify human mental abilities
-> Reduce effort/ need for search
-> Enable pattern recognition - 94Definition of Information visualization- Transforming of the symbolic into the geometric
- Finding the artificial memory that best supports our natural means of perception - 95Visualization DesignWhat is the purpose
What data has to be shown
How to map data values to graphical features
Clarity
Aesthetics - 96TreeMapShows hierarchy as 2D layout
Fillup space with rectangles representing objects
nested rectangles indicate levels of hierarchy
- 97Treemap problemsadjacency not well defined
lots of thin and wide boxes
hard to understand
Solution->Squarified Treemaps(avoids large aspect ratios) - 98Slice and Dice Algorithms
- 99Strip Treemap Algorithmus
- 100Types of visual encodingsElement properties (position, size)
Gestalt properties (grouping)
Animation - 101Visual encodings Design CriteriaConsistency: property of image should match data
Importance ordering: encode most important information in most efficient way
Expressiveness
Effectivness - 102Information Visualization Reference Model
- 103Brushing and LinkingInteract with one view, see effects in this view and in other views
Linking: Indicating which parts of one data view correspond to that of another
Brushing: Selecting subsets of data by brushing items in a single view - 104Human-Centered AIfocus on amplifying, augmenting and enhancing human performance in ways that make systems reliable safe and trustworthy
- 105Attributes of Human-Centered AITrustworthy: Can user trust predictions
Ethical: data collected in ethical manner
Secure: How vulnerable is the system to attack
Private: Does the system protect a persons identity and data
Robust
Available
Resilient: Can the system recover from disruptions - 106Control and AutomationAutomate where: Reliable performance is possible but allows overrides
Give human control where: Desired for creative flexibility
Automation is uncertain
But prevent human errors - 107Guidelines for Human-AI Interaction
- 108Why explainability/intelligibility is importantAI may have wrong objectives
inadequate features (bias)
users are more likely to accept if there is an explanation - 109Aims of explanations
- 110Microsofts ML Workflow
Information
- Description
- Informatik Flashcards on Interaktive Systeme, created by Paul H on 07/08/2022.
- Created by
- Paul H
- Views
- 0
- Rating