Human factor in service systems, importance of proper interface design.

toto je len prva, neupravena verzia, v ktorej moze byt cosi naviac, cosi moze chybat, cosi nemusi byt na spravnom mieste, upravujte podla najlepsieho svedomia a vedomia :)

feel free to edit, it's just first version which can be improved a lot :)

Basics of human-computer interaction. Involves the study, planning, and design of the interaction between people (users) and computers. It is often regarded as the intersection of computer science, behavioral sciences, design and several other fields of study. Interaction between users and computers occurs at the user interface (or simply interface), which includes both software and hardware; for example, characters or objects displayed by software on a personal computer's monitor, input received from users via hardware peripherals such as keyboards and mouses, and other user interactions with large-scale computerized systems such as aircraft and power plants.

Usability engineering is software engineering

– far too easy to jump into detailed design that is:


 * founded on incorrect requirements
 * has inappropriate dialogue flow
 * is not easily used
 * is never tested until it is too late

Understanding users and their tasks

– Task-centered system design


 * how to develop task examples
 * how to evaluate designs through a task-centered walk-through

Designing with the user

– User centered design and prototyping


 * methods for designing with the user
 * low and medium fidelity prototyping

– Evaluating interfaces with users


 * the role of evaluation in interface design
 * how to observe people using systems to detect interface problems

Designing visual interfaces

– Design of everyday things


 * what makes visual design work?

– Beyond screen design


 * representations and metaphors

– Graphical screen design


 * the placement of interface components on a screen

Principles for design

– Design principles, guidelines, and usability heuristics


 * using guidelines to design and discover usability problems

Psychological and physiological aspects of interface design: memory, attention, perception and decision.

Thirteen principles of display design Christopher Wickens et al. defined 13 principles of display design in their book An Introduction to Human Factors Engineering.

These principles of human perception and information processing can be utilized to create an effective display design. A reduction in errors, a reduction in required training time, an increase in efficiency, and an increase in user satisfaction are a few of the many potential benefits that can be achieved through utilization of these principles.

Certain principles may not be applicable to different displays or situations. Some principles may seem to be conflicting, and there is no simple solution to say that one principle is more important than another. The principles may be tailored to a specific design or situation. Striking a functional balance among the principles is critical for an effective design.

Perceptual principles


 * 1) Make displays legible (or audible). A display’s legibility is critical and necessary for designing a usable display. If the characters or objects being displayed cannot be discernible, then the operator cannot effectively make use of them.
 * 2) Avoid absolute judgment limits. Do not ask the user to determine the level of a variable on the basis of a single sensory variable (e.g. color, size, loudness). These sensory variables can contain many possible levels.
 * 3) Top-down processing. Signals are likely perceived and interpreted in accordance with what is expected based on a user’s past experience. If a signal is presented contrary to the user’s expectation, more physical evidence of that signal may need to be presented to assure that it is understood correctly.
 * 4) Redundancy gain. If a signal is presented more than once, it is more likely that it will be understood correctly. This can be done by presenting the signal in alternative physical forms (e.g. color and shape, voice and print, etc.), as redundancy does not imply repetition. A traffic light is a good example of redundancy, as color and position are redundant.
 * 5) Similarity causes confusion: Use discriminable elements. Signals that appear to be similar will likely be confused. The ratio of similar features to different features causes signals to be similar. For example, A423B9 is more similar to A423B8 than 92 is to 93. Unnecessary similar features should be removed and dissimilar features should be highlighted.

Mental model principles


 * 1) Principle of pictorial realism. A display should look like the variable that it represents (e.g. high temperature on a thermometer shown as a higher vertical level). If there are multiple elements, they can be configured in a manner that looks like it would in the represented environment.
 * 2) Principle of the moving part. Moving elements should move in a pattern and direction compatible with the user’s mental model of how it actually moves in the system. For example, the moving element on an altimeter should move upward with increasing altitude.

Principles based on attention


 * 1) Minimizing information access cost. When the user’s attention is diverted from one location to another to access necessary information, there is an associated cost in time or effort. A display design should minimize this cost by allowing for frequently accessed sources to be located at the nearest possible position. However, adequate legibility should not be sacrificed to reduce this cost.
 * 2) Proximity compatibility principle. Divided attention between two information sources may be necessary for the completion of one task. These sources must be mentally integrated and are defined to have close mental proximity. Information access costs should be low, which can be achieved in many ways (e.g. proximity, linkage by common colors, patterns, shapes, etc.). However, close display proximity can be harmful by causing too much clutter.
 * 3) Principle of multiple resources. A user can more easily process information across different resources. For example, visual and auditory information can be presented simultaneously rather than presenting all visual or all auditory information.

Memory principles


 * 1) Replace memory with visual information: knowledge in the world. A user should not need to retain important information solely in working memory or retrieve it from long-term memory. A menu, checklist, or another display can aid the user by easing the use of their memory. However, the use of memory may sometimes benefit the user by eliminating the need to reference some type of knowledge in the world (e.g. an expert computer operator would rather use direct commands from memory than refer to a manual). The use of knowledge in a user’s head and knowledge in the world must be balanced for an effective design.
 * 2) Principle of predictive aiding. Proactive actions are usually more effective than reactive actions. A display should attempt to eliminate resource-demanding cognitive tasks and replace them with simpler perceptual tasks to reduce the use of the user’s mental resources. This will allow the user to not only focus on current conditions, but also think about possible future conditions. An example of a predictive aid is a road sign displaying the distance from a certain destination.
 * 3) Principle of consistency. Old habits from other displays will easily transfer to support processing of new displays if they are designed in a consistent manner. A user’s long-term memory will trigger actions that are expected to be appropriate. A design must accept this fact and utilize consistency among different displays.

User centered design and prototyping.

User Centered System Design

Design is based upon a user’s


 * abilities and real needs
 * context
 * work
 * tasks
 * need for usable and useful product

... is based on understanding the domain of work or play in which people are engaged and in which they interact with computers…

Assumptions


 * The result of a good design is a satisfied customer
 * The process of design is a collaboration between designers and customers. The design evolves and adapts to their changing concerns, and the process produces a specification as an important by product
 * The customer and designer are in constant communication during the entire process

Participatory design

Problem


 * intuitions wrong
 * interviews etc not precise
 * designer cannot know the user sufficiently well to answer all issues that come up during the design
 * =>Designers should have access to representative users
 * END users, not their managers or union reps!

Up side


 * users are excellent at reacting to suggested system designs
 * designs must be concrete and visible
 * users bring in important “folk” knowledge of work context
 * knowledge may be otherwise inaccessible to design team
 * greater buy-in for the system often results

Down side


 * hard to get a good pool of end users
 * expensive, reluctance ...
 * users are not expert designers
 * don’t expect them to come up with design ideas from scratch
 * the user is not always right
 * don’t expect them to know what they want

Methods for involving the user

At the very least, talk to users


 * surprising how many designers don’t!

Contextual interviews + site visits


 * interview users in their workplace, as they are doing their job
 * discover user’s culture, requirements, expectations,…

Explain designs


 * describe what you’re going to do
 * get input at all design stages
 * all designs subject to revision

Important to have visuals and/or demos


 * people react far differently with verbal explanations
 * this is why prototypes are critical

Sketches -> Invite – Suggest – Explore – Question – Propose – Provoke

Prototype -> Attend – Describe – Refine – Answer – Test – Resolve

Purpose


 * brainstorm competing representations
 * elicit user reactions
 * elicit user modifications / suggestions

Sketches


 * drawing of the outward appearance of the intended system
 * crudity means people concentrate on high level concepts
 * but hard to envision a dialog’s progression

Attributes Quick to make Timely – provided when needed Disposable – investment in the concept, not the execution Plentiful – they make sense in a collection or series of ideas Clear vocabulary – rendering & style indicates it’s a sketch, not an implementation Constrained resolution – doesn’t inhibit concept exploration Consistency with state – refinement of rendering matches the actual state of development of the concept Suggest & explore rather than confirm – value lies in suggesting and provoking what could be i.e., they are the catalyst to conversation and interaction

Storyboarding


 * a series of key frames as sketches
 * originally from film; used to get the idea of a scene
 * snapshots of the interface at particular points in the interaction
 * users can evaluate quickly the direction the interface is heading

Spotlight: an interactive foam core and paper sketch/storyboard

Pictive - plastic interface for collaborative technology initiatives through video exploration

Designing with office supplies


 * multiple layers of sticky notes and plastic overlays
 * different sized stickies represent icons, menus, windows etc.interaction demonstrated by manipulating notes
 * new interfaces built on the fly session videotaped for later analysis
 * usually end up with mess of paper and plastic!

Medium fidelity prototypes

Prototyping with a computer


 * simulate some but not all features of the interface
 * engaging for end users purpose
 * provides sophisticated but limited scenario for the user to try
 * can test more subtle design issues dangers
 * user’s reactions often “in the small”
 * users reluctant to challenge designer
 * users reluctant to touch the design
 * management may think its real!

vertical prototypes


 * includes in-depth functionality for only a few selected features
 * common design ideas can be tested in depth

horizontal prototypes


 * the entire surface interface with no underlying functionality
 * a simulation; no real work can be performed scenario
 * scripts of particular fixed uses of the system; no deviation allowed

throw-away


 * prototype only serves to elicit user reaction
 * creating prototype must be rapid, otherwise too expensive

incremental


 * product built as separate components (modules)
 * each component prototyped & tested, then added to the final system

evolutionary


 * prototype altered to incorporate design changes
 * eventually becomes the final product

Wizard of Oz > Human ‘wizard’ simulates system response


 * interprets user input according to an algorithm
 * controls computer to simulate appropriate output
 * uses real or mock interface
 * wizard sometimes visible, sometimes hidden
 * “pay no attention to the man behind the curtain!”

good for:


 * adding simulated and complex vertical functionality
 * testing futuristic ideas

Summary

User centered + participatory design 


 * based upon a user’s real needs, tasks, and work context 
 * bring end-user in as a first class citizen into the design process 

Prototyping 


 * allows users to react to the design and suggest changes
 * sketching / low-fidelity vs medium-fidelity

Prototyping methods


 * vertical, horizontal and scenario prototyping
 * sketches, storyboarding, pictive
 * scripted simulations, Wizard of Oz

CRAP

Contrast


 * make different things different
 * brings out dominant elements
 * mutes lesser elements
 * creates dynamism

Repetition


 * repeat design throughout the interface
 * consistency
 * creates unity

Alignment


 * visually connects elements
 * creates a visual flow

Proximity


 * groups related elements
 * separates unrelated ones

Representation and visualization methods, advanced visualization methods.

Representations


 * formal system or mapping by which information can be specified (D. Marr)
 * a sign system in that it stands for something other than its self.

Good representations


 * allow people to find relevant information
 * information may be present but hard to find
 * allow people to compute desired conclusions
 * computations may be difficult or “for free” depending on representations

Graphics should reveal the data


 * show the data
 * not get in the way of the message
 * avoid distortion
 * present many numbers in a small space
 * make large data sets coherent
 * encourage comparison between data
 * supply both a broad overview and fine detail
 * serve a clear purpose

Good representations


 * captures essential elements of the event / world & mutes the irrelevant
 * appropriate for the person, their task, and their interpretation Information visualization
 * Tufte’s principles
 * overview first, zoom and filter, then details on demand
 * many techniques now available .... PhotoFinder, Table Lens, Infinite Zoom, Fisheye Menus, Fisheye Text, Perspective Wall, Document Lens, Data Mountain, Task Gallery, Cone Trees, Hyperbolic Lens

Visual variables - attributes

position


 * changes in the x, y (z) location

size


 * change in length, area or repetition shape
 * infinite number of shapes

value


 * changes from light to dark orientation
 * changes in alignment

colour


 * changes in hue at a given value texture
 * variation in pattern motion

Visual variables - characteristics

Different variable attributes may be:


 * selective; is a change enough to allow us to select it from a group?
 * associative; is a change enough to allow us to perceive them as a group?
 * quantitative; is there a numerical reading obtainable from changes in this variable?
 * order; are changes in this variable perceived as ordered?
 * length; across how many changes in this variable are distinctions perceptible?

Metaphors

Definition


 * represents a system object as if it were another type of object
 * disc / network file structure represented as file folders

Purpose


 * leverages our knowledge of familiar, concrete objects to understand abstract computer and task concepts

Problem


 * metaphor portrays inaccurate/naive conceptual model of the system

Human judgment supporting visualization.

Example problems

cryptic input codes


 * XR300/1: change (X) sign 300 on highway M5 (R) to code 1
 * i.e. change particular sign to indicate fog condition

no feedback


 * operator entered command, no visible effect of system response

cryptic error messages


 * “Error code 7”

teletype machine was old, text illegible


 * people could not see what they typed or system’s reply

operator overloaded with other chores


 * also handled radio and telephone traffic

High-level models of human-computer behaviour

Developing Theories in HCI


 * must explain and predict human behaviour in the human-computer system
 * must work in a wide variety of task situations
 * must work within broad spectrum of system designs and implementations

•Some low-level theories can be used to predict human performance


 * Fitt’s law - time to select an item with a pointing device
 * Keystroke level model - sums up times for keystroking, pointing, homing, drawing, thinking and waiting

General models that explain human behaviour with machines


 * Syntactic/semantic model (Shneiderman)
 * Stages of interaction (Norman)
 * all of psychology!

Dialog systems basics. Nine principles of design


 * 1) Simple and natural dialog
 * 2) Speak the user’s language
 * 3) Minimize user’s memory load
 * 4) Be consistent
 * 5) Provide feedback
 * 6) Provide clearly marked exits
 * 7) Provide shortcuts
 * 8) Deal with errors in a positive manner
 * 9) Provide help

Heuristic evaluation


 * Principles can be used to systematically inspect the interface for usability problem

How it was mirrored in lessons learnt from Interim Project?:

source: wikipedia.org, Jiri Sochor (http://www.fi.muni.cz/~sochor/PV182ENG/)