Vorlesungsfolien

Evaluation components:

• setting

• evaluation time

• evaluation partner

• result type

Clear structure:

• Introduction

• Warm up

• Main body

• Closur

occasionally anonymity cannot be guaranteed,

Study method that catches results that are difficult to catch otherwise

Idea: While sombeody is doing something (task), he is constantly explaining what he’s thinking. They are alone and have to handle the system (you are not allowed to give hints,..)

Candidates: preferrably non-experts with comparable verbalization skills

Prepare: Explain system, setting and expectation

Perform: Record (stay out of sight)

Finalize: Extensive interpretation

1. Preparation

2. Perform the Study

3. Finalize

• oftentimes qualitative and subjective evaluation since generalizations are very difficult

• interpretation can be done on various psychological theories and models

-> improve session by:

- look for issues, categorize obvious issues

Study method to measure the mental workload of a system. How?

Using following criteria: (DR UBSS)

• Sensitivity

• Selectivity -

• Bandwidth

• (Un)Obstrusiveness

• Reliability (Reproducability)

• Diagnosticity

e.g. using Microsoft Word for ages but don’t know all the features

1. primary task - directly correlated with the task (usually get an absolute value): measure time, speed, strength and derive workload metrics

2. secondary task - indirect: while task, person has to do rythmic tapping or give random numbers (tapping variability/randomness decreases with workload)

3. physiological corrolates - measure physiologic metrics like heartrate, problem: conditioning required! comparison between subjects, difficult setup

   to achieve Conditioning:

   1. baseline phase (relax to get baselevel),

   2. interaction phase (do task),

   3. recovery phase (recovery to base level)

4. subjective ratings - apply popular workload scales like NASA Task Load indeX

Index to measure percieved mental workload (subjective)

Two Parts:

1. 6 Dimensions: Mental, Physical, Temporal, Performace, Effort,

   Frustration (TEMPPF?)

2. Compare dimensions: Score 0-100, optimum score is determined by case

   how?

   1. for each dimension, sum the number of times it was selected as the leading pair wise factor,

   2. Divide this sum by 15 (the number of pairwise comparisons)

   3. Multiply this result by the score for each dimension

   4. Sum the resulting dimension scores

Study method, which closely observates the user

Goal: capture participant experience and it’s context

Essential Parts: (PPT)

• The person: Who?

• The place: Where?

• The thing: What?

(More precise parts: Space, Actors, Activities, Objects, Acts, Events, Time Goals, Feelings)

Main benefit:

user cannot hide -> take out user bias

(normally done in early stages of project)

Goal: capture participant experience and it’s context

• direct observation

  Think aloud

• indirect observation (tracking user’s activities)

  Diaries, Interaction logs, web analytics

• Both (either or)

  Video, audio, photos, notes

Contextual Inquiries

while ethnographic observation: few questions related to the context

nowadays popular (technology enables it easily)

Broad Difference:

Field Study -> you go to the participant, uncontrolled environment

Lab Study -> participant comes to you, controlled environment

• INTERVIEW AND QUESTIONNAIRE

• THINK ALOUD

• OBSERVATION AND ETHNOGRAPHY

• FIELD STUDIES

Use of XY in everyday lives is difficult to do in lab studies, so we are using field studies (e.g. living labs)

field studies can complment lab studies

- In situ (natural habitat) Field studies -> uncontrolled environment

- more likely to find novel insights

- expensive

Difference to Usability Lab studies?

- additional effort:

need to know which conditions to control -> pre studies

need to know which participants…

I. studies of current behavior (what are people doing now?)

-> Result: better understanding of current use of technology

-> Study: open ended questions

-> “How do family members share technology (TV)?”

II. proof of concept studies (does my technology function in the real world?)

-> Result: validation of a new technology

-> Study: Give out technology, specific questions

-> “Give out phone App (+ ask: does it work?)”

III. experience studies (How does my prototype change people’s behavior?)

-> Result: Experience with a new product

-> Study: Experience with using a technology for a longer period of time, Wizard of Oz

-> Experience in the long run

Surveys

-> regular survey after any change of condition

Logging

-> use mobile device to also collect data about usage

Used to conduct a Experience Study (Ubicomp field study type III)

= simulates and controls system from behind the scenes (use mock interface and interact with user

(appear as a smooth, already implemented system)

• good for proof of concept

• expensive

Questionnaires at various point throughout the day/event/… (via smartphone)

Why? Records changes in users behavior when using an user interface, not only the usability of the interface

Grouping (professionals, non professionals)

-> based on expertise, frequency of use, demographics

Data sampling strategy

-> random sampling,

-> systematic sampling,

-> stratified sampling,

-> samples of convenience

Representation of Study Participants (to the intended user group)

-> representative vs. non-representative participant set

depends on what you are looking for:

Jakob Nielsen recommends: rather few participants but frequent studies! (5 users identify 80%) -> experimental study idea)

but: validity depends on statistical strength

therefore it depends on acceptable error

• probability based study of behavior -> z-Test: choose confidence level and error margin: N = (0.25 z^2) / w^2

• controlled survey -> controlled sample size (e.g. sample of convenience)

• experimental study -> 5 evaluators identify 80% of usability issues

• Within Subjects (one participant gets several tasks, result compared to other tasks)

• Between Subjects (everybody gets same task, compare how different users perform the task) users have to be grouped

• mixed

If you have several options: teest order may influence the outcome

-> randomize (using a Latin Square)

1. concrete research question

2. Answer the questions:

   a. Screen (Who?)

   b. Schedule (When?)

   c. Setup (What will they do?) -> short and precise!

   d. Data (What data to collect?)

=> put everything in a design document for the study

(Research questions, Participant profile, Method description, Timeline, Data to collect, Analysis, Validate Hypothesis, Incentives)

Quantiative and Qualitative (= mixed) offers maximum insight

Define dependent and independent variables:

- independent: what you vary to measure an effect (different types of haptic stimulation on the glove)

- dependent: effect to measure (how many errors they do when playing the piano)

Dependent/Independent variables can be influenced by:

- confounding variables: influences both independent and dependent variables (pre-knowledge about the piano piece)

- extraneous variables: only influences dependent variables (environment is 35° and you can’t see anymore)

How to solve?

- randomize

- matching

- statistical control

- design control

• Depends on type of study (experience studies longer than behaviour study)

• depends on novelty (entirely new system?)

• pracical considerations (effort from participants, breaks)

• frequency of use

VL 2 Slide 160 & 162 (p. 146 & 148)

• Reliability: does the method produce the same results on separate occasions?

• Validity: does the method measure what it is intended to measure?

  • Internal Validity (certainty that you know the cause)

  • External Validity (result can be generalized)

  • Ecological validity: does the environment of the evaluation distort the results? Is the result transferable to a general environment?

• Biases: Are there biases that distort the results?

• Scope: How generalizable are the results?

Inspect study without the user: have domain experts look over the study

Inspection:

• use multiple Inspection methods (several kinds)

• review with domain experts

• use heuristic evaluation

• walkthroughs

What should experts look at: ask them about

• match between system and real world

• user control and freedom

• consistency

• error prevention

• …

Both are examples for expert evaluation techniques of a study:

1. Cognitive Walkthroughs:

   Designer presents design, usage scenario and context

   -> Domain expert tries to imagine a user doing it and is guided by questions of the designer: Will the user notice the correct action?

2. Pluralistic Walkthrough:

   multiple experts do a cognitive walkthrough, discuss afterwards

Human: Input, Processing, Output,

Computer: Input, Processing, Outut (same)

(“both Outputs are very interesting, interpretation of output is up to you”)

Senses -> initial Analysis -> Memory -> Motor Systems

-> Output from speech/muscles…

(SIMMO)

Stimuli on left, Responses on right, inbetween different streams (parallel, unparallel,…).

Blue arrow is attention ressources (Information Processing Ressources), limited

Senses as “windows to the world”

A system that responds to physical energy and that corresponds to a defined region within the brain where signals are recieved and interpreted

Sensory information,

Sensory stores (Iconic, Echoic = Vision, Hearing)

Sensory input that is selectively attended

Working Memory -> Output, Store in / Retrieve from Longterm meomery (Articulatory Loop)

can store perception after the stimulus,

• echoic memory (2-10 sec after stimulus, hearing)

• iconic memory (0,5-1 sec after stimulus, visual)

tightly related to attention ressources

Attention: Cognitive process of selectively concentrating on one aspect of the environment while ignoring other things

-> can be directed to a particular task or divided between different tasks

-> practice reduces amount of attention required by a particular task

Types of attention:

• selective attention (willingly select focus, one source)

• focused attention (respond to external events, not willingly, e.g. somebody talks nearby, one source)

• divided attention (simultaneous focusing on different events, multiple sources)

Optimum: selective attention

Allocation model:

- limited amount of “processing power” at our disposal

- task execution depends on how much of our attention “capacity” we can spare on it

-> controlled processing (heavy attention demand)

-> automatic processing (takes no resources)

=> practice reduces amount of attention required by a particular task

“Vigilance is an aspect of attention which refers to detecting a rare event or signal in a desert of inactivity or noise” (Wachsamkeit)

Types:

• time

  • free-response paradigm: can occur anytime (e.g. flight simulator training)

  • inspection paradigm: regular small errors (e.g. quality control)

• order

  • successive vigilance paradigm: has to be remembered (e.g. color darker than initial target)

  • simultaneous vigilance paradigm: all information present, compare

• perception

  • sensory vigilance paradigm: signals change intensity (e.g. color change)

  • cognitive vigilance paradigm: signal represents information

two stages of information processing in the task of detection

1. sensory evidence is gathered (= recognition)

2. decision is made

decision can be influenced by noise:

Types of noises

• external (in the data, snow overlaying sign)

• internal (in our brain, same stimulus different neuronal activity)

Internal Response = neural activity resulting from a stimuli

evaluated by

• decision criteria Xc

• response bias (beta, rarely adapted by humans -> “sluggish beta”)

Sensitivity: resolution of the detection mechanism

= separation of noise and signal (distribution along x axis)

low sensitivity: both kind of same percieved

high sensitivity: clearly distinguishable noise and signal

working memory and long term memory

Memory Processes:

• Recall

• Recognition

• Chunking

• Rehearsal

=> Multi Modal

Working Memory:

• 30 seconds storage

• 70ms access times

• storage size: 3-4 chunks,

• visual (visuo-spatial sketchpad) or verbal information (articulatory loop)

• chunk refers to a unit of information that the brain can hold as a single entity

• easy to overwrite

• easy trigger: sound

Types

• Verbal: Phonological Store, Articulatory Loop

• Visual: Visuospatial Sketchpad (“Klangbilder”)

• Operate in parallel

LTM:

• “unlimited” in capacity, from a few minutes to life time

• slow access (100ms)

• triggers: smell

Three types:

• episodic

• procedural

• semantic

Encoding - information is stored in memory

Retrieval - memories are recovered from long-term storage

Forgetting - fail to recover information

Recall - retrieve particular piece of information

Recognition - (“Wiedererkennung”) search memory and decide whether retrieved piece matches info

Rehearsal - repeating information in working memory facilitates transfer from WM to LTM

Designer helps you chunking

decay: information lost gradually, slowly

interference:

• retroactive (new information replaces old)

• proactive (old info interferes with new)

Remember over long period of time difficult

-> Recognition might be of help:

• much easier to recognize than recall something

• hold images and texts

Web Pages difficult to recall because they change format -> Recall often also bound to shape

=> How to implement? Icons very useful since

• use metaphor to recall

• understandable, familiar, memorable, informative,…

Guidline: practical rules for solving UI design problems

Principle: help for analyzing design alternatives

Theories: describte objects and give explanation of connections

• Organize in Chunks

• Short linear sequence of tasks

• Persistence (do not flash info shortly)

• Reminders

• Consistent user interface

• Consistent Icons/Colours, Terminology

Decision: After perception of stimulus, response needs to be selected

• automatic: fast, little attention required, reflexes or behavior from LTM

• controlled: slow, attention required, interaction with WM and LTM

Response: after decision made, it is executed by complex motor movements

Feedback: observe consequence of actions, producing feedback

(circular model)

Most influential model of user interaction: wants to quantify numbers on how long the human processing takes

-> These numbers are used later for the Interaction design models

consists of 3 interacting subsystems:

• Perceptual Processor (sensory inputm output to audio/visual storage)

• Cognitive Processor (access LTM to determine response)

• Motor Processor (carry out response)

principles of operation

• Fitts Law,

• Power Law of Practice

Serial Action or parallel perception

all about Processor Cycle time

Power Law of Practice

How often do we have to percieve an activity before we know it and perform faster?

-> task time follows a power of law:

Tn = T1 * n^-0,4

=> you get faster every time, perceptually and motorically (but not knowledge acquisition)

1. Classical senses: Sight, Hearing, Touch, Smell, Taste

2. Additional senses: Pain, Balance, Joint motion (proprioception), Temperature

3. Focus: Sight + Hearing

• Blind Spot (area with no photoreceptors, about 15–20° off the optical axis)

  -> Brain fills in blind spot using memory & experience: cognitive image

• Foveal Area: The small central region of the retina (fovea) where visual acuity is highest; it’s responsible for sharp central vision.

• Cones detect color and are concentrated in the center;

• rods detect black and white and are located in the periphery

• maximum around 22 images per second

• very sensitive to movement outside 30° out of vision

• Objects closer than 25 cm are difficult to focus on, and constant near-focusing leads to fatigue

• Presbyopia: age-related farsightedness

  -> reduces contrast sensitivity, making it harder to perceive fine differences in brightness and color

Vision detects colors, shapes, and edges.

Visual perception interprets these visual inputs to recognize and understand objects

-> (e.g., recognizing a “house” vs. just seeing “shapes”).

Methods the brain uses to simplify recognition by ordering

• Proximity

• Closure / Prägnanz

• Continuity / common fate

• Similarity / Symmetry / Part-Whole Relationship

• Area / Surroundness / Common Region

Objects that are close together are perceived as belonging to the same group.

People tend to perceive the simplest possible shape or organization from a complex image. The brain tends to complete incomplete figures to form familiar shapes

Elements arranged in a line or smooth curve are perceived as more related than disjointed ones

Elements that move in the same direction or speed are seen as related.

Elements that are aligned or have a similar orientation are grouped together—even without motion

Elements that look alike (shape, color, size) are perceived as part of the same group.

Symmetrical elements are perceived as a single, unified group.

The whole is different from the sum of its parts—parts can be perceived differently depending on how they’re arranged.

Smaller areas are perceived as the figure, while larger areas are seen as the background.

Enclosed areas are seen as separate figures; surrounding areas are background.

Elements inside the same chunk are perceived as belonging together.

We respond to intensity first (e.g., brightness, loudness) before recognizing the actual content.

Proportions can be used to represent logical hierarchies

Golden Ratio:

A mathematical proportion (~1.618) considered aesthetically pleasing, often used in layout and logo design.

Fibonacci:

A sequence where each number is the sum of the two before it (e.g., 1, 1, 2, 3, 5...). is perceived as visually harmonious (It approximates the golden ratio)

Screen complexity refers to how visually dense or difficult an interface is to interpret.

1. Draw rectangles around all elements.

2. Count the number of unique widths (columns) and heights (rows).

3. Calculate the frequency of each width/height type.

4. Apply the formula to compute complexity.

-> too simple or too complex is bad for usability

=> Tradeoff between complexity and usability

1. Too simple:

   • High predictability

   • Poor differentiation

   • “Flat” and uniform feel

2. Too complex:

   • Visually overwhelming

   • Difficult to scan or understand

   • Cluttered appearance

Arrangement of eyes allows us to perceive 3D

Primary Depth Cues (relevant for Immersive VR Systems)

• Retinal Disparity (Our eyes are ~7 cm apart, each receiving a slightly different image)

• Stereopsis (The brain combines images from both eyes to form a single 3D perception.)

• Accommodation (The eye changes the shape of the lens to focus at different distances)

• Convergence (Eyes rotate inward to focus on nearby objects, Greater inward angle = closer object.)

  
  

Secondary Depth Cues (for 2D displays)

• light and shade: improves the depth perception

• linear perspective: shadow on arrow

• height in the horizontal plane

• motion parallax: riding on a train and looking out of the window: near objects are perceived to flash by quickly, objects further away as slower

• overlap: e.g. overlapping windows in a GUI

• relative size: see sun + cloud

• texture gradient: textured surfaces appear closer

Additive Colour (Colours are created by adding light)

• Used in displays, RGB colour palette

Subtractive Colours (Colours are created by subtracting (absorbing) light)

• Printing, different colour palette

Short:

1. Additive = light-based (screens)

2. Subtractive = pigment-based (print)

Visual Limitations

• Blue color on edge of percievable spectrum

  -> dont use blue colour for small elements

• Colours may cause emotional response (Colour Conventions)

• Ability to distinguish colour is related to size of an object

• colorblind (mostly green)

• Shapes/edges detected faster than color

Colour Coding = use of colours to convey meaning

• improves search & decision tasks

• does not replace good structure

• differences to distinguishes vary

1. Use a Colour code

   • Max. 4 main colours, each with max 4 variants

2. Structure content and identify content that should be coloured

Viridis Colour Map:

Use gray scale for colour blind friendliness

3 components:

1. Hue

   • The type of colour (e.g., red, blue, green)

2. Value / Brightness / Luminance

   • How light or dark a colour appears

3. Chroma / Saturation

   • The intensity or purity of a colour

Colour Model

• RGB (Red, Green, Blue) – Additive

• CMYK (Cyan, Magenta, Yellow, Black) – Subtractive

1. Transduction, Sound → Neural signal

2. Auditory Grouping

   1. Segregation (into seperate streams)

   2. Integration (into coherent sounds)

3. Scene Analysis – Identify sound sources

4. Interpretation

1. Audio is percieved faster, directional, but transitory

2. Can guide visual attention

3. Continuous sound = cognitive load

Redundant Coding:

= Combines visual + audio (e.g. clicking sound when pressing button)

Speak > Write

Read > Listen

• Audio-only wearable for ubiquitous communication

• Designed for hands-free, eyes-free interaction, directed audio speakers

Interaction Types

• Active Interaction: voice commands (e.g. go to my mails), direct control

• Passive Interaction: background cues, no disruption

Laws to calculate timings: Fitts’ Law, Hicks Law

concepts to understand

analysis methods

analysis tools

Interaction time of manual movement (

gross-movement tasks (normal), precision pointing tasks (etwas mehr Parameter added)

How to order information in a menu (less important than Fitts’s Law)

Mental models: method to understand interaction that is both predictive and explanatory

Mapping

Mapping

Constraints

Find a concept / form that shows relationship between stages

Good mapping:

• understandable

• consistent

• recognizable / quickly learnable

• natural

9-2 = 7; 3+3 = 6 - 2 = 4

“You only allow certain things to guide users”

-> lead human to build correct mental models

-> minimize chance to make errors

• physical constraints (dial vs. button)

• semantic constraints (assumption that create something meaningful)

• cultural constraints (borders provided by cultural conventions, e.g. traffic signs, colours, ..)

• logical constraints (restrictions due to reasoning)

Affordance refers to the perceived and actual properties of the thing

-> they build a mental concept of a system (we interpret symbols and components)

-> Good design makes the affordances visible:

e.g. use Gestalt Laws to visually imply how elements are grouped or function (e.g., alignment, shape).

-> It is sprayed

Model by Don Norman: method to look for misunderstandings or difficulties to understand concepts by users

-> look for two gulfs of understanding: Execution, Evaluation

Gulf of execution: Mismatch between the user's intentions and the allowable

actions

-> Difficulty understanding what the user intends: not enough knowledge about concept, usage, access to function

Gulf of evaluation: Mismatch between the system's representation and the users'

expectations

-> Difficulty understanding what the system did: Problems with perception of state, interpretation of state, comparing goal and state

Task analysis:= is the study of how work is achieved by tasks.

-> Task analysis is concerned with the performance of work in a domain

e.g. “join a video meeting”, or “record a TV program”

Definition task:

A task is a goal together with some ordered set of actions.

Definition goal:

A goal is a state of the application domain that a work system wishes to achieve.

Goals are specified at particular levels of abstraction.

Definition task elaborated:

A task is a structured set of activities required, used or believed to be necessary by

an agent to achieve a goal using a particular technology. A task will often consist of

subtasks where a subtask is a task at a more detailed level of abstraction. The

structure of an activity may include selecting between alternative actions,

performing some actions a number of times and sequencing of actions

Definition action:

A task which has no problem solving associated and which does no control structure. Actions and task will be different for different people.

-> atomic elements, e.g. button click, finger movement, mouse movement

Task analysis supports:

• Understanding the problem (Analysis)

• Designing better solutions (Design)

• Measuring performance and fit (Evaluation)

HTA is a graphical representation of task structure using a hierarchy of tasks, subtasks, and actions. It allows sequences, repetitions, and alternatives, with optional annotations (plans).

How to use ATM

GOMS = Goals, Operators, Methods, Selection rules

Analyzes Coginitive Load by looking at user behavior and task structure

-> predicts performance

Example:

1. Goals: user intentions

2. Operators: basic actions (e.g. press key, read)

3. Methods: action sequences for achieving goals

4. Selection Rules: decide which method to use

Example:

practical design tool that can calculate the physical actions a user will have to carry out to complete specific tasks

-> used to determine the most efficient method

Given:

• A task (possibly involving several subtasks)

• The command language of a system

• The motor skill parameter of the user

• The response time parameters

Predict:

• The time an expert user will take to execute the task

K = Keystroke or button press -> 0,2s

P = Point with mouse -> 1,1s

H = Hand movement (keyboard ↔ mouse) -> 0,4s

M = Mental preparation -> 1,35

R = System response -> t

(D = Draw, sometimes included)

Are found at the design of interactive systems

-> help understanding practices and identifying problems

Requirements work,

envisionment,

evaluation,

conceptual design

physical design

Challenges: problem fluidity and external constraints;

Benefits: revisable ideas and lifecycle participation by users.

-> scenarios can be written at multiple levels, from many perspectives, and for many purposes

making the reasons for design decisions explicit

IBIS – issues, positions, arguments and relations

QOC – questions, options and criteria (graphical links)

1. User Stories

2. Conceptual Scenarios

3. Concrete Scenarios (with technology, more sepcific)

4. Use cases

Goals:

Understanding users,

specifying constraints,

generating ideas,

prototyping,

documentation.

Conceptual development followed by concrete scenarios

gathering

generation (more strucutred)

elicitation

engineering

identify problems and relevant stakeholders

Abstracted from multiple user stories; focus on requirements without specifying technology or solutions.

Specific versions of conceptual scenarios; useful for UI design, prototyping, and evaluation

-> use technology, not like conceptual scenarios

Describes interaction between user and system;

results from concrete scenarios

-> sum of all use cases specifies the system design

Authorship,

description,

history,

rationale,

cross-references,

data

Used in requirement generation, envisionment, prototyping, and evaluation; closely tied to design thinking.

Analyze

• what people do

• what people might want to do

• problems with existing systems

• how people do what they do

-> goal: “better” interactive systems for people

something the product must do or a quality that the product must have

-> requirement work is the transformation of observation and information

-> specify requirements (precise, documentation)

Functional: What system must do

Non functional: what qualities system must have and how it operates

-> both needed

What are functional requirements?

Specific functions the system must provide, like “send message” or “print document.”

What are non-functional requirements?

System qualities like performance, security, usability, reliability, or accessibility.

Not all requirements have equal impact on the system:

MoSoCoW:

must have

should have

could have

want to have

1. Gathering

2. Generation

3. Elicitation

4. Engineering

-> People perform activities in contexts using technologies.

method to rapidly build up scenarios

e.g.

The interaction of People, Activities, Contexts, and Technologies in system design.

• Temporal aspects (todo)

• Cooperation & Complexity

• Safety Critical

• Content type

Changes by interacting with a system

aid reasoning and memory

but

are incomplete and vary from designer intent

Physical environment

Social context

Organizational Structure

PACT can be used to quickly develop various kinds of scenarios

-> Scenarios are good for both evaluation and envisionment

To create fictional, evidence-based user archetypes that guide design decisions toward real user needs.

making ideas visible by externalizing thoughts (projection of how users will react)

-> helps designers

e.g. sketches, snapshots, storyboards, scenarios

To capture early design ideas, envision scenarios, and communicate interaction concepts quickly and cheaply.

• Sketches: Quickly drawn ideas and thoughts, Rough, flexible, invite change

• Snapshots: Show system state at specific moments (e.g. screen after login)

Used for dialogue design, scenario walkthroughs, and team discussion.

A sequence of sketches showing how the user interacts with the system over time.

To tackle emotional reflection towards design

Unstructured design tools (e.g. diaries, cameras, maps) given to users to capture personal insights and experiences.

-> get new perspectives of target group

e.g. ethongraphic study

Scenarios help visualize specific interactions

concrete scenarios -> prototyping -> envisionment scenarios

Include visual techniques and real-life data. Ground scenarios in context, characters, and assumptions.

Typical interactions, key design issues, unclear requirements, and safety-critical areas.🔹 Structure recommended: title, activities, rationale.

issues will arise about the deisgn

-> only when people see a concrete representation, they are able to comment meaningfully

A simplified version of a system used to visualize, test, and communicate design ideas. It supports feedback and iteration before full development.

Horizontal (implement user interface or function), all features but no functionality

Vertical (implement one feature set), full functionality but not the features

A quick, inexpensive, and rough representation of a design (e.g. paper sketches, wireframes).

-> needs user guidance (“set the scene”)

-> focused on underlying ideas and key functionality

-> Used in early stages to explore ideas, get feedback, and encourage change.

e.g. paper prototypes

Form of low fidelity prototypes

Issues:

• Robustness

• scope

• instructions

• flexibility

1. Low-fidelity: Fast, cheap (e.g. paper sketches)

2. High-fidelity: Looks/behaves like final system (e.g. coded UI) 📌 Choice depends on design phase and testing goals.

Same conceptual information can be presented via different physical interfaces

1. Conceptual interface: How users understand system functionality (e.g., clock shows time).

2. Physical interface: The medium used to present it (digital, analog, speech).

e.g.

A clock (concept: time) can be presented as a digital clock, analog clock, or speaking clock — all share the same info but vary in access and ease of use.

1. Indirect manipulation: Mouse input

2. Direct manipulation: Touchscreens Interaction can involve text, WIMP, and information content.

Interface Content = content seen on interface like text, information, concept

Involves eye movements (saccades), fixation (pausing on areas of interes) + cognitive processing = not just seeing letters but understanding meaning.

Reading is a two step process:

1. distignuish letter or word shape

2. associate meaning

Single letters easier in uppercase

Text passages more quickly in lowercase -> lowercase has more distinctive shapes

On paper, users rely more on spatial memory and annotation; screen reading lacks this, affecting comprehension and search.

Instrumental (Text that does work, e.g., button labels, checkbox titles, and hyperlinks)

e.g. buttons, hyperlinks

Commentary (Text that informs users, like help messages)

e.g. contextual help, procedural help, conceptual help, reference help

1. Legibility: age, context -> size, contrast

2. Readability: line length, spacing, format

3. Pyhsical factors: Font size

1. Reading distance

2. Screen resolution

3. Text/background contrast

4. User’s visual acuity

5. Type of reading (scanning vs. deep)

1. Line length: longer lines = faster reading

2. Margin width: larger margins = better focus

3. Vertical spacing (leading): double spacing can boost speed

4. Use left alignment for long texts

5. Maximize luminance contrast (e.g. black on white)

depends on the application.

Both have pros/cons. Key is consistency and clarity in navigation cues.

1. Serif: Better for long printed text (books)

2. Sans Serif (non-Serif): easy & fast to recognize -> Better for screens/presentations

3. Cursive: requires high resolution and good visibility

In general:

1. Use 10–14pt for body text

2. Provide enough line spacing (1.4× font size) for clarity

3. Adjust for viewing distance and resolution

=> Be consistent, use fonts that support fast recognition and readability

Windows, Icons, Menus, Pointer — a standard interface (contemporary GUIs), they compromise windows, icons, menus and pointers

Operating system software

user whoh must minimize, maximize,… windows

Window = Framed views onto different parts of the system

Types

• Tiled

• overlapping

• cascading

• interrupted cascade

• tabbed

organization and structuring of information to help users form a clear mental model of the system

• Uses ontologies (conceptual frameworks)

• Involves taxonomies (classification schemes)

• Information should be presented consistently, though multiple taxonomies may coexist

• Humans handle conflicting structures better than systems do