Use LEFT and RIGHT arrow keys to navigate between flashcards;
Use UP and DOWN arrow keys to flip the card;
H to show hint;
A reads text to speech;
370 Cards in this Set
- Front
- Back
|
paradigm shift examples |
batch processing time sharing networking graphical display (direct manip) microprocessor www ubiquitous computing |
|
|
batch processing |
stack of punch cards left in a tray in computer room. computer guy took all those stacks and processed them. you'd leave your deck there and wait for him to process it. one of the initial paradigms. |
|
|
time-sharing |
1940s-50s people used to book times to communicate b/w computers/share machines; talk directly to the copmuter. a single computer could support multiple users at the same time "having users enter commands on a text-based terminal in real-time" |
|
|
networking |
? |
|
|
microprocessor |
paradigm shift. personal computing. more emphasis on HCI |
|
|
direct manipulation |
e.g. mouse and keyboard devices allow for direct manip |
|
|
video display units (VDU) |
terminal - no processing power, just text. present and manipulate info in form of images. |
|
|
sketchpad program - problem with lightpen? |
light pen was a problem because your arm would get tired |
|
|
Engelbart |
developed first mouse beleived in "augmenting man's intellect" developed word processing |
|
|
metaphor |
using somrthing user is already familiar with. good for introducing new systems. |
|
|
examples of a metaphor |
turtle metaphor for kids drawing system. could type english phrases like "go forward" or "turn left" "windows" metaphor |
|
|
what is LOGO |
turtle drawing program. turtle dragging its tail in the dirt |
|
|
what is the problem with metaphors? |
sometimes sytems can do more things that are NOT familiar with real life. e.g. floppy disks, CDs |
|
|
when did personal computing become popular |
1980s this is when metaphors like 'desktops' started |
|
|
no matter how powerful a system may be, it will always be more powerful if... |
if it is easier to use. |
|
|
WIMP stands for |
Windows Icons Menus Pointer |
|
|
Windows and WIMP allowed users to |
multitask; not just work sequentially. humans do not typically work in a linear way. thus, a personal computer must be flexible and able to "change the topic" as the human is. |
|
|
first commercial windowing system |
Xerox Star (1981) |
|
|
Who was LOGO developed by? |
Papert. used the metaphor of turtle |
|
|
direct manipulation |
rapid feedback. visual feedback |
|
|
ben shneiderman's criterea for direct manipulation |
visibility of objects of interest that u manip
easily undo actions; not afraid to take risk
only gives LEGAL operations
replace complex commands with actions |
|
|
first commercially successful direct maniplation interface |
macintosh apple computer 1984 |
|
|
interaction |
communcation between user and system. |
|
|
system |
combinatino of integrated components that work together to achieve a goal. systems = more than just the interface. it means EVERYTHING involved. |
|
|
example of a system |
portable stapler that you bring to your desk. but what if the office made the stapler fixed? you'd pile up some papers and then make the trip to go staple. i.e. your whole SYSTEM has changed |
|
|
design |
achieving goals within constraints |
|
|
why do errors happen |
not always human error. sometimes design error. e.g. we should know how humans operate under stress, so if our designs don't account for that, it's our fault |
|
|
the core of interaction design |
the user |
|
|
what's the design process? |
RADIIB 1. requirements 2. analysis (task analysis, scenarios) 3. design (guidelines, principles) 4. implementation and deploy 5. iteration and prototyping 6. back to analysis |
|
|
trade-offs when designing usability |
deciding what to fix |
|
|
how to know your users? |
1. personas 2. cultural probes 3. who are they? young old experienced novice etc 4. they're probably NOT LIKE YOU 5. talk to them 6. watch them |
|
|
participatory design |
users are brought fully into design process |
|
|
why is it important to watch users |
to hear what they say; gives you insight |
|
|
what is a persona |
example user. detailed. not real person. |
|
|
ethnography |
watching people and being present; there is always a disruptive effect when someone's watching studying people in their natural environment. challenge: interpret and present data to inform design |
|
|
cultural probes |
small packs of items designed to provoke and record comments in various ways; they are given to people to take away and use in their own environment. involves direct observation. |
|
|
scenarios |
stories for design |
|
|
local structure |
navigation/structure of a single page design on a single screen (e.g. how to place the menus, buttons, other objects to interact with) |
|
|
global structure |
nav/structure of a whole site
|
|
|
Lifecycle for interactive systems model |
like waterfall model, except everything is CONNECTED - you test, then you might go back and change your requirements, or design, etc |
|
|
3 types of design rules |
standards guidelines principles |
|
|
standards |
e.g. standards for making a car. no matter what you follow these specific design rules high authority low generality |
|
|
guidelines |
direction for design low authority more general application |
|
|
principles |
general understanding. abstract design rules low authority high generality |
|
|
design patterns |
capture and reuse design knowlege (paradigms) |
|
|
we clasify rules along what 2 dimensions? |
authority
generality |
|
|
authority
|
how strictly rule must be followed |
|
|
generality |
can the rule be applied to many things, or just one? |
|
|
what rule has the most authority |
standards. |
|
|
what rule has the least authority |
guidelines. "if you want to use it, thats cool" |
|
|
what rule has the most generality |
guidelines |
|
|
Principles to support Usability (3) |
learnability flexibility robustness |
|
|
learnability |
easy to learn to achieve maximal performance. will a novice user be able to use your app right away? |
|
|
flexibility |
multiplicity of ways the user and system can exchange info |
|
|
robustness
|
helps user determine successful achievement of goal |
|
|
principles of learnability
|
predictability familiarity generalizability consistency |
|
|
predictability |
determining effect of future actions based on past interaction history users dont like surprises (Except in games) |
|
|
familiarity |
how prior knowledge applies to this app e.g. File>> New everyone knows |
|
|
generalizability |
extending specific interaction knowledge to new situations |
|
|
consistency |
likeness in input/output behavior arising from similar situations or task objectives. similar things throughout your system |
|
|
princples of flexibility |
dialogue initiative multithreading task migratability substitutivity customizability |
|
|
dialogue initiative |
If the system initiates dialogue too much, it feels less flexible |
|
|
multithreading |
Multitask |
|
|
task migratability |
passing responsibility for task between user and system e.g. spellcheck. you can do it, but you xfer this job to the system to do instead |
|
|
substitutibity |
allowing equivalent values of input/output to be substituted for each other e.g. allow you to use inches or cm |
|
|
customizability |
user can modify interface. personalization |
|
|
principles of robustness |
observability recoverability responsiveness task conformance |
|
|
observability |
ability of users to eval the internal state of the system from its perceivable representation |
|
|
recoverability |
able to recover from error |
|
|
responsiveness |
how user perceives rate of communcatino with system |
|
|
task conformance |
how much system services support all of users tasks. task completeness (coverage of tasks) task adequacy (users understanding of the tasks) |
|
|
design rules suggest.. |
how to increase usability. and they differ in generality and authority |
|
|
golden rules an dheuristics |
"broad brush" design rules. good checklist for design |
|
|
scniederman's 8 golden rules |
1. consistency 2. shortcuts 3. informative feedback 4. dialogs to yield closure - user knows their task is completed 5. error prevention + handling 6. easily reverse actions 7. support internal locus of control; so user is in control of system, which responds to his actions 8. reduce cognitive load |
|
|
norman's 7 principles |
1. use konwledge in world and knowledge in head 2. simplify structure of tasks 3. make this visible. interface should make clear what it can do and how 4. get the mappings right. user intentions should map clearly onto system controls 5. exploit power of constraints 6. design for error 7. when all fails, standardize |
|
|
computer's 3 interaction levels |
input >> processing >> output |
|
|
toolkit |
aid programmer; library |
|
|
AWT |
abstract window toolkit. Java toolkit for making windowed applications. |
|
|
interaction objects |
e.g. widgets have a predefined behavior, e.g. a button that already has features that you don't have to program yourself |
|
|
advantage of programming with toolkits |
can enforce consistency |
|
|
whats the "look and feel" of a toolkit?
|
consistency of behavior for interaction objects across diff applications that use the same toolkit
|
|
|
process = output = input = |
process = model output = view input = controller |
|
|
why understand I/O technologies |
you can design interactions that match a user's natural workflow. making choices for tasks in isolation leads to poor design. |
|
|
problem with wide range of input devices |
finding the best one. every device has pros and cons |
|
|
VLSI |
Very Large Scale Integration. millions of circuits in a small area/chip |
|
|
Joystick vs trackball example |
joystick - can control zoom by twisting; good for CAD trackball - controlling an oil refinery; trackball is more accurate, better precision |
|
|
strengths vs generality |
we cant design the single best, STRONGEST device for every single application, or we'd have too many devices. instead, get as much GENERALITY as possible from a smaller number of devices. |
|
|
GUI input handling is an example of the ___ pattern |
listener pattern |
|
|
fitts law formula |
difficulty index = 2*dist / width |
|
|
mvc: model |
manages the data, logic and rules of the application |
|
|
mvc: view |
output representation of information; multiple views of the same information are possible |
|
|
mvc: controller |
accepts input and converts it to commands for the model or view. can send commands to the model to update the model's state. can also send commands to its associated view to change the view's presentation of the model |
|
|
device centric vs task centric |
keep this in mind when naming devices. "keyboard" = device specific "text entry device" = task centric |
|
|
other forms of text entry |
speech written sign language (cameras) computer algorithms (word prediction) |
|
|
the goal of HCI
|
design technology based SYSTEMS for USABILITY.
to put focus on user and usability! not just making systems for professional use |
|
|
3 cognitive modelling methods |
MHP GOMS KLM |
|
|
MHP stands for... |
model human processor |
|
|
explain MHP |
cognitive modeling method used to calculate how long it takes to perform a certain task. tiger example: see the tiger, decide to shoot or climb, climb |
|
|
MHP 3 subsystems |
perceptual cognitive motor |
|
|
related time values in MHP |
perceptual input (time to perceive stimulus) cognitive (time to decide) motor output (time to react/move) |
|
|
perceptual system |
has sensors; stores sensory input buffer memories |
|
|
two buffer memories |
visual image store auditory image store |
|
|
cognitive system |
connects input of perceptual system to output of motor system receives coded info from sensory stores and working memory, and uses previously stored long-term memory to make decisions about how to respond with the motor system |
|
|
motor system |
carries out response |
|
|
how can we apply MHP to menus? |
instead of having all options in 1 menu, break your menu into submenus 4x4 (depth) is better and FASTER than 1x16 (breadth)!! |
|
|
GOMS |
identify end goal. break into subgoals |
|
|
KLM |
Keystroke-Level Model predicts how long it will take an EXPERT to accomplish a routine task without errors. |
|
|
common models uder stimulus-response approach |
hicks law practice law fitts law steering law |
|
|
3 key ingredients of system uysability |
Use design rules Follow a structured methodology
managerial and organizational techniques |
|
|
technology is used to support... (2) |
tasks (e.g. Word supports taking notes) processes (e.g. SIS supports student info system) |
|
|
process |
collection of tasks |
|
|
system |
collection of processes |
|
|
how do we resolve conflicts during development? |
find creative win win solutions |
|
|
how to build a process |
informal process: design a bit, code a bit... if process is slow, add people, work harder but... Fred Brooks says adding workers does not = more speed! |
|
|
man month |
cost does vary as the product of the number of men and number of months progress does not. thus, using man-month as a unit for measuring the size of a job is DECEPTIVE because it implies that men and months are interchangeable! |
|
|
software development process models |
waterfall spiral agile |
|
|
waterfall model |
requirements
architectural design detailed design coding and unit testing integration and testing operation + maintenance all these stages are SEQUENTIAL. do them in order! typically used for mission-critical systems - you can't risk moving on before the previous step is done! INFLEXIBLE. doesnt allow you to go back to previous phases result of each phase is called a deliverable, which flows into the next phase. |
|
|
spiral model |
often used for large, expensive, complicated projects |
|
|
agile |
intense team effort. frequent, short, intense meetings. fast paced. allows you to implement changes quickly. breaks process into cycles/iterations. each cycle is built and tested. attempts to reduce major risks by incremental steps in short time intervals. |
|
label the arrows in Nielsen's diagram. (6) |
THIS ILLUSTRATES A SCENARIO. scenarios are small - reduces number of features AND level of functionality. scenarios = cheap to design, but only works if the test user follows a previously planned path. Since the scenario is small, we can afford to change it frequently. allows quick and frequent feedback from users. |
|
|
WinWin |
a groupware tool that makes it easier for distributed stakeholders negotiate win win system. identify stakeholder's win conditions, find a win win solution. |
|
|
What is Win Win Spiral model? |
Theory W management approach, saying that making winers of the systems key stakeholders is necessary for project success. extends spiral software dev model by adding Theory W activities to the front of each cycle. |
|
|
Design Process
|
1. study users 2. model building 3. specify the design 4. analysis of design 5. prototyping 6. design evl 7. synthesis/design recommendations |
|
|
goals of evaluation |
assess extent of system functionality assess effect of interfaces on user identify specific problems |
|
|
how to do cognitive walkthrough |
1. specification or prototype of the system 2. description of task the user is to do 3. a complete list of actions needed to complete a task 4. indication of who the users are and what kind of experience and knowledge the evals can assume about them |
|
|
how many % of projects succeed? |
about 16% |
|
|
steve jobs: true innovation comes from... |
recognizing unmet need, designing a creative way to fill it |
|
|
how do we find unmet needs? |
focus groups and interviews can't solve this because many users don't know what they are missing. so we need DATA TOOLS to study users. to study their context. |
|
|
ethnography principles |
natural settings holistic - activites must be understood within the larger context descriptive - descriptive understanding of their everyday lives members' PoV - see world from their perspective and describe behaviors |
|
|
user modelling |
modelling human behavior to predict how they'll interact with the interface (predictive eval) |
|
|
goals of user modelling |
predict how good designs will be eval designs to support human abilities generate guidelines to enhance performance and overcome human limitations |
|
|
how can humans be seen? 3 views |
info processing machines (like computers)
biomechanical machines social actors in context |
|
|
3 approaches to model human behavior |
1. psychology - cognitive 2. physiology - physical, stimulus 3. socialogy - affective there are 3 spects for consideration when modelling human behavior: cognitive faactors, physical factors (how they move hands etc), and affective factors. |
|
|
hicks law |
estimates how long it will take to make a decision when they have multiple choices.
more choices = more time
sometimes used to justify menu designs. e.g. comparing a single level 64-item menu, or a 2 level menu: 8x8, or a 2 level menu: 4x4... ^ you can use hicks formula to calculate each option and pick the best one. |
|
|
power law of practice |
quantifies how performance improves as a function of practice. predicts how many practice iterations needed to reach a usability criteria. |
|
|
power law of practice is used for... |
typing speed improvement learning to use mouse pushing buttons in response to stimuli |
|
|
fitts law |
predicts how long it will take to reach a target using a specific pointing device.
|
|
|
steering law |
estimates time required to navigate, or steer, through a 2-dimensional tunnel. The tunnel can be thought of as a path or trajectory on a plane that has an associated thickness or width, where the width can vary along the tunnel you should design your tunnels (nested dropdowns) to be wide and short. |
|
|
design goal for: low motivation, discretionary use |
ease of learning
|
|
|
design goal for: low motivation, mandatory |
control, power |
|
|
design goal for: high motivation, due to fear |
ease of learning, robustness, control |
|
|
design goal for: high motivatino, due to interest |
power, ease of use |
|
|
separable model design |
model: maintains info about components state ui delegate: combines view and controller |
|
|
advantage of model-delegate design |
you can show data in 2 different ways e.g. 1 model with data, but 2 views of the to display the data in 2 different ways |
|
|
why we need prototyping |
never right the first time get feedback improve it |
|
|
prototyping iterative process |
design >> prototype >> eval >> okay? done! else, redesign and go back to prototype step |
|
|
formative evaluation |
any eval that is intended to improve design |
|
|
summative evaluation |
performed at the end to see if product is good enough |
|
|
why test ideas? |
check feasibility with users allow users to contribute validate + negotiate requirements check usefulness of application |
|
|
lowfi prototypes |
demonstrate look and feel, not how it works |
|
|
hi fi prototypes |
computer based fully interactive harder to make |
|
|
fidelity |
how much the prototype actually represents the APPEARANCE and INTERACTION of final product |
|
|
2 types of compromise in prototyping |
horizontal and vertical |
|
|
horizontal prototype |
has wide range of functions, but little detail (breadth) reduce the level of functionality and result in a user interface surface layer |
|
|
vertical prototype |
few functions, but lots of details (depth) reduce the number of features and implement the full functionality of those chosen |
|
|
prototyping steps |
1. mockups - low and hi fi |
|
|
dexterity - children ahve difficulty... |
holding down mouse, marquee sleection double click distinguish left from right |
|
|
younger the child = ____ the font |
younger child = larger font |
|
|
visualization |
formation of mental visual images OR method for generating images from data fed into a computer |
|
|
data visualization |
graphical display of abstract infop |
|
|
purpose of data visualiztion |
1. sense-making 2. communication |
|
|
what is abstract info? |
not physical. e.g. sales, stats, performance data... |
|
|
Passamoquoddy Bay: echo sound scanning data visualization |
visualize tides. data was displayed as a height field. linear ripples are errors in data because the roll of the ship that took the measurements was not properly taken into account |
|
|
advantages of visualization |
comprehend huge amount of data. it lets you see patterns, and this can give you insight. problems with data become apparent. understand large- and small-scale features of the data. facilitates hypothesis formation e.g. guess how the pockmarks were formedp |
|
|
pockmarks |
a pattern of features |
|
|
4 stages of data visualization |
1. collection of data 2. preprocessing - transform data into something easy to manipulate 3. map data to a visual rep 4. human perceptual and cognitive system |
|
|
visualization stages: feedback loops |
gathering data loop computational preprocessing loop visualization process |
|
|
why care about perception? |
high bandwidth to the brain we can see more than we can mentally image we can perceive patterns |
|
|
two stage process |
1. parallele extraction of low-level properties of scene 2. sequential goal-directed processing |
|
|
stage 1 - low level, parallel |
neurons in eye and brain responsible for diff info arrays of neurons work in parallel automatic rapid info is briefly held in iconic store bottom-up, pre-attentive processing |
|
|
stage 2 - sequential, goal-directed |
splits into subsystems for object recognition and for interacting with environment slow, involves memory, symbol manip. top-down processing |
|
|
iconic store |
3-7 items. visual buffer lets us hold the image for 0.2 seconds while we read the symbols into our shortterm memory. after 3/10s - transfer into visual or verbal working memory |
|
|
preattentive |
time taken to find target is independnt of number of distractors. preattentive ~= 10msec per item or better |
|
|
you should use ___ saturation colors for large areas, and ____ saturation for small objects. |
large areas = desaturated colors small objects = strong saturated colors |
|
|
social cognition |
process by which we make sense of other people. how people think about themselves and the social world. how they SELECT, INTERPRET, REMEMBER and USE social info to make judgements + decisions |
|
|
social cognition examines... |
how we take info and encode it (select)
how this interpretation is stored (interpret) how this info is retreived from memory and used (remember and use) |
|
|
schemas |
mental structures that represent knowledge about a conept or type of stimuli. often include attributes and relationship among those attributes present theories about social world |
|
|
types of schemas |
role self person event |
|
|
role schemas |
expectations about people in particular roles (e.g. the role of a doctor) |
|
|
self schemas |
expectations about self that organize and guide processing of self-relevant info |
|
|
person schemas |
expectations based on personality traits. what we associate with a certain type of person (e.g. introvert, warm person) |
|
|
event schemas
|
expectations about sequences of events in social situations (e.g. restaurant schemas) |
|
|
why schemas are important |
reduce amount of info to process redue ambiguity guide our attention, how quick we notice, what we notice, and how we interpret what we notice. our memory our judgements |
|
|
conversational mechanisms |
"rules" in conversations |
|
|
implicit cue to end a convo |
eg. looking at your watch
|
|
|
explicit cue |
"well i gotta go, bye" |
|
|
adjacency pairs |
conversational turn-taking. A: Shall we meet at 8? B: Um, how about later? B: i like fish ^ this would NOT satisfy the adjacency pair. |
|
|
farewell rituals |
bye, cya, gtg |
|
|
VideoWindow system (Bellcore,'89) |
50 miles apart can have a convo as if they are in the same room. 3x8 ft "window" between sites with video calling |
|
|
findings with VideoWindow |
talked constantly about the system spoke more to ppl in same room than other room trying to get closer to someone had opposite effect; went out of range of camera/mic |
|
|
skype sucess |
global household name video makes it more intimate |
|
|
Hypermirror, 1998 |
people are superimposed on the same screen to appear like theyre in the same space example of telepresence |
|
|
copresence |
tech that helps ppl in same room collaborate. eg smartbooard |
|
|
situational awareness |
being aware of what is happening around you in order to understand how info, events, and your own ations will affect ongoing and future events. ciritical in tech work like air traffic control or operating a theater, when things are constantly changing |
|
|
notification systems |
users notify others rather than being constantly monitored. |
|
|
lifelogging |
recording everything in one's life and sharing |
|
|
groupware types |
same place same time (whiteboard)
same place diff time (post it notes, email) diff place same time (video calling) diff place diff time (email) |
|
|
social interaction |
we cant go long w/o checking phones, email, etc. its integral part of our social lives. not surprising, given humans are social beings: we live, work, learn, play, talk with each other |
|
|
key assumptions: children are... |
creative,intelligent, capable of great things if they are given good tools and support.
|
|
|
if children cannot successfully use the tech we designed, it is ____ fault |
our fault |
|
|
designers who make stuff for children start at an ADVANTAGE cuz they... |
tend to believe in their users |
|
|
designers who make stuff for children may be disadvantaged cuz... |
they no longer remember the physical and cognitive differences of being a child! |
|
|
sensorimotor |
age 2 and under cognitions heavily rely on senses, immediate perceptions |
|
|
preoperational |
age 2-7 small attention span hold 1 thing in memory at a time cant understand other PoV |
|
|
concrete operational |
age 7-11 maturing, but abstract concepts difficult. logic, classification, relational logic. |
|
|
formal operational |
age 11+ pretty much like adults adult designers can partially rely on their own intuitions can think hypothetically. inductive reasoning - think like a scientist |
|
|
activity theory (Vygotsky) |
infants born with few mental functions: attention, sensation, perception, memory - eventually transformed by culture into higher mental functions. THUS, cognitive skills evolve from social interactions with parents/teachers etc
|
|
|
zone of proximal development |
range of tasks that are too complex to be mastered alone but can be accomplsihed with guidance. scaffolding - adult bridges only the unknown aspects of child's task |
|
|
cognitive development theories (2) |
sociocultural - Vygotsky's activity theory
biological - Piaget's cognitive development theory |
|
|
sociocultural - vygotsky's activity theory |
cognitive dev varies across cultures. stems from social interactions. social proesses >> individual processes adults guide changes through "scaffolding" |
|
|
biological - piaget's cognitive dev. theory |
cognitive dev. is universal. stems from independent explorations/development individual (egocentric) processes become social processes natural development timeline. |
|
|
cool or no cool means... |
we should avoid trying to be fashionable; what is cool changes too quickly. we should target a limited age range cuz childens abilities change quickly too |
|
|
children dexterity |
children have trouble holding down mouse, double clicking, distinguish left from right |
|
|
children writing |
speech recognition has good potential for wide variety of applications for children. if preliterate: use audio, graphics, animation to communicate |
|
|
children reading |
ages 9 to 11 like 14pt font more than 12pt font. the younger the child, larger the font should be. |
|
|
children and background knowlege |
they wont get adult-y metaphors like file folders inboxes... so choose metaphors that kids will understand. however, kids can understand unfamiliar metaphors if they are clear and consistent |
|
|
children and interaction syle |
kids prefer playful, spontaneous interactions. children repeated error to hear error noise. children clicked everything to see what would happen. children confused ads with content. |
|
|
working with children: eval process. using video cameras. |
behavior changes when camera is present.
causes kids to freeze or perform; allow them to control if possible. multiple methods to capture messy data from zone of interaction still important to capture behavioral signs, not just rely on interview |
|
|
children developmental issues |
kids have trouble verbalizing thoughts. personality may impact kids willingness to speak up to adults and their motivation to please authority figures. capacity to concentrate varies among kids. kids cant really think abstract or logical. have trouble remembering several items at once. cant really monitor goal-directed performance some ages may have more pronouced gender differences than others. |
|
|
traditional usability testing with children: points |
emphasize testing software, not participants show them all the recording and observation devices to build trust. |
|
|
think/talk aloud: problems with children |
children make few comments. |
|
|
other methods for getting info |
post-task interviews codiscovery - 2 friends do it together (ineffective cuz children dont interact in these conditions) peer-tutoring (requires higher overhead for training) |
|
|
software for kids: understand timeline for development of: |
visuomotor skills (design cursor differnetly)
language (simplify language, use pictures) working memory (maintain visible cues) following instructions (repetition, step by step) |
|
|
what was the initial paradigm for HCI?
|
batch processing
|
|
|
example of paradigm shifts (7)
|
batch processing
time sharing networking graphical display microprocessor WWW ubiquitous computing |
|
|
batch processing paradigm –> impersonal computing
|
1940s–50s
stack of cards that you insert into the machine a deck of cards was left in a tray in the computer room and everyone leaves their deck the computer guy took those decks ("batch") processed the pile of papers would be the output |
|
|
time sharing paradigm –> interactive computing
|
1940s–50s to 1960s
a single computer could support multiple users book a time to use the terminal computer cuz ppl sharing it in different cities 60s systems started the subculture of programmers known as "hackers" |
|
|
networking paradigm –> community computing
|
1980s
talk to same server with terminal computers and these are connected to the server so interactivity talk to computer directly, talk to different users directly |
|
|
graphical displays paradigm –> direct manipulation
|
instead of using terminal to type out commands, you could now use icons and such to do the stuff you need (e.g. copy and paste)
|
|
|
microprocessor paradigm
|
personal computer domain
|
|
|
WWW paradigm
|
global information
|
|
|
ubiquitous computing paradigm
|
symbiosis of physical and electronic worlds in service of everyday activities
|
|
|
video display units (VDU)
|
e.g. monitors –> it's an input output device
present and manipulate info from computer in the form of images on a VDU
|
|
|
sketch pad program
|
1962–1963
one of the first programs with graphic interface similar to MS paint allows direct manipulation used a lightpen (one of the first devices to use direct manipulation; PREDECESSOR of mouse) |
|
|
when was the first mouse developed and by who?
|
Engelbart, 1968
|
|
|
the first direct manip. of objects by a pointer
|
Ivan Sutherland's Sketchpad, 1963
|
|
|
who came up with the word "icons"?
|
David Canfield Smith, 1975
|
|
|
who invented the mouse and when? what was it a replacement for?
|
Doug Engelbart, 1965, replacement for light pens
|
|
|
what was the first graphical video game and the first popular commercial game? when did they come out?
|
SpaceWar (1962)
Pong (1976) |
|
|
what was the Xerox Star and when did it come out?
|
1981
– office automation system that could be connected to each other via Ethernet and share access to printers/servers – had a mouse (two buttons) – windows displayed info and could overlap – progressive enhancement |
|
|
Apple's Lisa computer (1983)
|
electronic desktop that you could manipulate; had windows and visible commands |
|
|
problems with the Lisa computer
|
not exciting or pretty.
was like "twenty questions" to step user through tasks in hierarchical fashion. TOO MUCH PROMPTING and wasn't fun |
|
|
what two major events in 1979 changed the design of the Lisa hardware and software?
|
Motorola 68000 microprocessor
– support higher res display and interactive UI Apple engineers visiting Xerox's research centre – saw Smalltalk that used mouse |
|
|
what was Smalltalk by Xerox?
|
First OOP language but it wasn't the language used to write Star
|
|
|
what was Vannevar Bush's Memex? when was it ideated? |
1945
you could scan through a "library" of material super fast and sort them too |
|
|
augmenting human intellect
|
increase ability to solve problems
|
|
|
H–LAM/T
|
human using language, artifacts, methodology in which he is trained
|
|
|
5 trust factors
|
People
Aesthetics and UX Usability Engineering Transparency |
|
|
what did Engelbart demonstrate in 1962?
|
a display system called the NLS and it could show both text and solid lines on the screen
3 inputs – keyboard, chording keyboard, and MOUSE!!! |
|
|
difference between the Xerox Alto and the Star
|
Alto: had display, keyboard, and mouse
Star: stripped–down version of Alto and was commercialized |
|
|
what was Windows/Bill Gates influenced by?
|
1983, VisiCorp's graphical interface for IBM PCs called VisiOn
|
|
|
who did Apple sue?
|
1985 – Digital Research's GEM because it had a similar GUI to Lisa/Mac
1987 – Microsoft Windows 2.0, sued over the "look and feel" of the GUI *lost this one |
|
|
what was NeXTSTEP (1988)? what did it introduce?
|
Steve Jobs' GUI and operating system for the NeXT computer
– had 3D beveled look to GUI components, – used "x" symbol – had a dock – vertical menu strip on upper left corner |
|
|
what did Windows 95 introduce?
|
Start Menu – where all programs were launched
Task Bar – where you could switch between running programs |
|
|
why did interaction become really important after the 80s?
|
80s: PERSONAL COMPUTING popular; focused on consumers who were newbies
|
|
|
why was the programming language Logo good?
|
adapted programming language to a model kids could understand
e.g. "go forward" "turn left" |
|
|
what does WIMP stand for?
|
windows, icons, menus, pointer
|
|
|
what did Window systems and the WIMP interface let you do? what were PC systems like before in terms of sequence?
|
humans can pursue more than one task at a time
windows used for dialogue partitioning, to "change the topic" 1981 – Xerox Star first commercial windowing system Windows, icons, menus, and pointers now familiar interaction mechanisms |
|
|
what were PC systems like before Window and WIMP?
|
PC systems used to force the user to progress in order through all the tasks needed to achieve an objective –> humans don't work in this way!!!
|
|
|
what are some limitations of metaphors/models?
|
– cultural bias
– could get outdated – cannot represent EVERYTHING the system can do |
|
|
what was the usability problem with a standard command line interface?
|
you could only get feedback on previous interactions if you knew how to ask for it |
|
|
what is direct manipulation (an interaction technique)
|
rapid feedback
visibility of objects of interest incremental action at interface reversibility of all actions syntactic correctness of all actions – menu has all legal actions!! replacement of complex command languages with actions |
|
|
first real commercial success which demonstrated the inherent usability of direct manipulation
|
1984, Apple Macintosh personal computer
|
|
|
what is interaction?
|
communication between user and system/interface
|
|
|
what is a system?
|
combination of integrated components that work together to help you achieve your goal
|
|
|
what is a computer system?
|
software, hardware, everything that needs to make the system work (including people!!!!)
|
|
|
what are the interaction design basics?
|
design process
user and requirements scenarios navigation iteration and prototypes |
|
|
design ____ not just ____ & design ____ not just ____
|
interactions
interfaces interventions (e.g. documentations, manuals, tutorials) artefacts |
|
|
what is design?
|
achieving goals within constraints
goals = purpose (who is it for, why do they want it) constraints = materials, platforms (e.g. budget) have to make trade–offs between goals/constraints |
|
|
what is the golden rule of design for HCI?
|
understand your materials (computers, people, interaction)
computers = limitations, capacities, tools, platform people – psychological, social aspects, human error |
|
|
the core of interaction is the ___
|
the user
|
|
|
what is the process of design?
|
requirements
– what is there, what is wanted analysis – ordering/understanding design – what to do, how to decide iteration and prototyping implementation and deployment |
|
|
what is the trade–off concerning usability?
|
challenge is not finding the problems or fixing the problems, it's deciding WHAT to fix concerning trade–offs (maybe time)
|
|
|
how to get to know your user?
|
persona
cultural probes who are they? probably not like you talk to them (interviews, discussions, participatory design) watch them (ppl can tell you, but it's not the full story) use your imagination |
|
|
probe packs
|
small packs of items designed to provoke and record comments in various ways, given to ppl to use in their own environment (e.g. glass, camera, postcard)
they record what's meaningful to them |
|
|
pros and cons of scenarios
|
pros: communicate with others, validate other models, understand how it behaves
solution: use several scenarios |
|
|
levels of interaction of PC application
|
widgets (menu, buttons) –> screen design –> application navigation design
|
|
|
what are design rules? what do they do?
|
standards, guidelines, principles from any source
suggest how to INCREASE USABILITY |
|
|
waterfall model (sequential) |
1. requirements specifications (what should be in the calculator) Must do in order
used for mission critical systems, landing your spaceship on Mars –> we need everything to be perfect before we move on |
|
|
life cycle for interactive systems
|
waterfall model except everything is CONNECTED (even backwards!)
design is an iterative process |
|
|
difference between principles, standards/guidelines, and design patterns?
|
principles: general understanding standards + guidelines: direction for design design patterns: capture and reuse design knowledge |
|
|
3 categories of principles
|
learnability
flexibility: multiplicity of ways the user and system exchange info robustness: lvl of support for the user in determining successful achievement and assessment of goal–directed behaviour |
|
|
principles of learnability
|
predictability (determine results of future actions based on past actions)
familiarity (how prior knowlege applies) generalizability (extending specific interaction knowledge to new situations) consistency (similar behavior from similar situations) |
|
|
principles of flexibility
|
dialogue initiative (system vs user pre–emptiveness - who initiated?)
[more user driven = more flexibility] multithreading (can multitask) task migratability (pass task responsibility between user and system e.g. spellcheck) substitutivity (e.g. cm or inches)
|
|
|
principles of robustness
|
observability (can user evaluate internal state of system based on what he can see?)
|
|
|
who are design standards set by?
|
– national/international bodies to ensure compliance by large community of designers
– require underlying theory and slowly changing technology |
|
|
ISO 9241 defines usability as...
|
effectiveness, efficiency and satisfaction with which users accomplish tasks
|
|
|
golden rules and heuristics of design
|
"broad brush" design rules
Nielsen's 10 Heuristics (evaluation) Shneiderman's 8 Golden Rules (design + evaluation) Norman's 7 Principles |
|
|
every computer does 3 things
|
input, processing, output
|
|
|
user driven means that
|
the action the application takes is determined by the input received from the user
|
|
|
what is the key feature of WIMP interfaces?
|
input and output are LINKED to independent entities (e.g. physical movement of mouse and visual movement cursor are separate things but linked together)
illusion that entities are objects of interest – interaction objects – and that's necessary for direct manipulation interface |
|
|
toolkit
|
collection of programs/classes that take care of interaction level details
just worry about using objects, not implement their functionality toolkit provides programmer with interaction objects (widgets) which he or she can use to create app programs –> objects have predefined behaviour |
|
|
AWT (abstract window toolkit)
|
whenever you want WIMP in your program
maps interface objects such as buttons, menus onto corresponding Java classes |
|
|
one advantage of programming with toolkits?
|
enforce consistency in both input form and output form by providing similar behaviour to a collection of widgets because all developers use the same toolkit
|
|
|
look and feel of the toolkit
|
consistency of behaviour for interaction objects
|
|
|
MVC pattern
|
model view controller
basically input processing output means dividing your program into 3 main components, where one component handles input, one handles main logic (processing), and output |
|
|
why understand I/O technologies? |
Help us make designs that match a user's natural workflow |
|
|
what's important to know about i/o devices?
|
each input device has its own strengths and weaknesses just as each application has its own unique demands
|
|
|
what's better when choosing inputs: specific strengths or generality?
|
attempt to get as much generality as possible from a smaller number of devices
e.g. graphics tablets can emulate the behaviour of mouse, but can still be used to draw unlike a mouse |
|
|
naming inputs: device or task centric
|
we name based on device or task
e.g. keyboard is device–centric (because it has keys) |
|
|
how to conceptualize a problem
|
– know 4 basic components of problem definition
– create a hierarchic task description – understand why we need quantitative usability metrics – be able to create one sentence problem statement |
|
|
3 key ingredients for system usability
|
– application of established design principles and guidelines
– structured methodology for design – managerial and organizational techniques |
|
|
two ways technology can be used
|
– to support tasks
i.e. as tool (like Eclipse) – to support process i.e. as a system that supports processes |
|
|
how to figure out who your stakeholders are? who are usual stakeholders?
|
– who will ask for it?
– who will use it? – who will decide whether to use it? – who will PAY for it? – who has to make (design/build) it? – who has to make a profit from it? – who will raise hell if they don't like it? users, production team, sales, and regulators (govt etc) |
|
|
how can we resolve constraints?
|
– bargaining and compromise
– sometimes key decisions won't be yours but you can often influence them – arguments that focus on SELLING product are convincing |
|
|
design process (7 steps)
|
1. studying users
2. model building 3. specifying the design 4. analysis of the design 5. prototyping 6. design evaluation 7. synthesis / design recommendations |
|
|
what are limitations for focus groups and interviews?
|
consumers DON'T know what they're missing and true innovation is recognizing an UNMET need and designing a creative way to fill it
|
|
|
what does customer–centred and user–centred actually mean? 4 things
|
actually trying to understand things from the customer's POV
getting into user's context, early focus on users and task, understanding the user BEFORE even starting design get empirical measurements (structured user responses) to design artifacts THROUGHOUT design process iterative design |
|
|
4 principles of ethnography
|
1. natural settings
2. holistic – activities must be understood within larger context in which they occur 3. descriptive 4. members' point of view – describe behaviours in term relevant and meaningful to the study participants |
|
|
contextual design (CD)
|
framework for structuring font–end design to ensure that user data drives the overall system definition as well as the user interface
takes a CROSS–FUNCTIONAL team and collects data about users in field, interpret data, design product |
|
|
what is user modelling? why do we do it?
|
modelling human behaviour
help us predict how user will interact with interface |
|
|
3 goals of user modelling
|
1. predict performance of design alternatives
2. evaluate suitability of designs to support and enhance human abilities and limitations 3. generate design guidelines that enhance performance and overcome human limitations |
|
|
3 different views humans are seen
|
1. human as information processing machine
–> procedural model 2. biomechanical machine 3. social actor in context (social environment) |
|
|
3 aspects for consideration when modeling human behaviour in HCI
|
1. cognitive factors
2. physical factors 3. affective (mood/feeling) factors |
|
|
model human processor (MHP) –> 3 steps
|
1. you see something (perceptual/sensory)
2. you make a decision (cognitive) 3. you act on that decision (motor) |
|
|
what is model human processor (MHP)?
|
cognitive model that suggests that the human mind can also be treated like an information processing system
1. set of memories and processors with 2. set of principles, called "principles of operation" |
|
|
what is the perceptual system in the MHP?
|
carries sensations of physical world detected by body's sensory systems and internal representations of the mind by means of integrated sensory system
|
|
|
what is the cognitive system in the MHP?
|
connect inputs from perceptual system to RIGHT outputs of motor system
|
|
|
what is motor system of the MHP?
|
carries out response translating through into actions by activating patterns of voluntary muscles
|
|
|
what does GOMS stand for? what do each of the letters mean? who invented it? what does it do?
|
goals = end result you want to achieve
operators = lowest level actions available for performing a task methods = sequence of operators selection rules = choice of a method Card, Moran, Newell, 1983 interacting with system is problem solving, and we decompose those problems into sub problems we then determine goals to attack problem, know sequence of operations to used to achieve the goals, and select a way to solve the problem |
|
|
what does the GOMS model assume?
|
the one performing UI operations is an expert
|
|
|
what does a GOMS analysis provide?
|
GOMS analysis of a task describes the hierarchical procedural knowledge a person must have to successfully complete that task
|
|
|
keystroke level model (KLM)
|
simplification of GOMS
operators used to categorize the operation phase of a unit task (have keys for certain unit tasks) |
|
|
what are common models under stimulus–response approach?
|
Hick's Law, practice law, Fitts' Law, etc.
|
|
|
what does Hick's Law state and what do you use it for? what does it require?
|
used to estimate how long it will take ppl to make a decision when presented with multiple choices
states that time required to make a decision is a FUNCTION of the number of available options requires logical order (e.g. alphabetical) |
|
|
how does Hick's Law decision time increase? what is reaction time?
|
logarithmically
reaction time is time interval between presentation of stimulus and beginning of response to it reaction time = a + b log2 (n) a = total time not involved with decision making b = constant based on cognitive processing time for each option (0.155 s for human) n = number of equally probable alternatives |
|
|
what is one application of Hick's Law?
|
justify menu design decisions –> can improve menu selection by using broad, shallow menus
|
|
|
what does the Law of Practice predict? what does it quantify? how can we apply this law? what is the formula?
|
how many practice iterations needed to reach a usability criteria
quantifies how performance improves as a function of practice apply it for making predictions of human performance (e.g. typing speed improvement, learning to use mouse, etc.) |
|
|
what does Fitts' Law predict? how does it help us design? what's the formula?
|
allows to predict a time it takes for user to POINT at an object using a specific pointing device (mouse, trackpad, even a finger)
helps us design user interfaces, deciding location and size of buttons and other elements and choosing the right pointing device for the task 2A/W A = distance W = width |
|
|
in Fitts' Law, movement time increases as ____ and decreases as ________
|
increases as distance to target increases
decreases as size of target increases |
|
|
what is the Steering Law? what does it say? what is it applied to?
|
traversing "nested menus" –> steering through menu options opening up more options like windows folders (or dropdowns)
you should design tunnel user interface element to be wide and short |
|
|
you can categorize users into 3 groups
|
beginners
intermediates experts |
|
|
what are co–presence technologies? what are some examples?
|
technologies that enable co–located groups to collaborate more effectively when learning, socializing
e.g. smartboards, wii |
|
|
two things we should consider to understand how co–presence can support collaboration
|
coordinating and awareness mechanisms
|
|
|
when we meet face to face, how do we coordinate our activities?
|
verbal and non–verbal communication
– talks, nods, shakes, gestures schedules, rules, conventions shared external representations |
|
|
what do awareness mechanisms involve?
|
involve knowing who is around, what is happening, who is talking with whom
|
|
|
what is situational awareness?
|
aware of everything thats happening around you in order to understand how information, events, and your own actions will affect ongoing and future events
|
|
|
what is social cognition? what does it study?
|
process by which we make sense of other people
studies how people think about themselves and the socialworld – how they select, interpret, remember and use social informationto make judgments and decisions |
|
|
what are schemas?
|
mental structures that represent knowledge about aconcept or type of stimuli
|
|
|
4 types of schemas
|
Role Schemas: expectations about people in particular roles and socialcategories
Self–Schemas: expectations about the self that organize and guide theprocessing of self–relevant information Person Schemas: expectations based on personality traits, what weassociate with a certain type of person Event Schemas: expectations about sequences of events in socialsituations, what we associate with certain situations |
|
|
why are schemas advantageous? 3 ways
|
reduce the amount of information to process
reduce ambiguity guide our attention and encoding |
|
|
what is peripheral awareness?
|
a person's ability to maintain and constantly update a sense of what is going on in thephysical and social context, through keeping an eye on what is happening in the periphery of their vision
|
|
|
what is CSCW?
|
computer–supported collaborative work
|
|
|
what is the difference between formative evaluation and summative evaluation?
|
formative evaluation = any evaluation before/during a project's implementation with the aim of improving the project's design and performance
summative evaluation = performed at theend to verify whether the product is good enough |
|
|
why is prototyping a good idea?
|
involve the users intesting design ideas and get their feedback in the early stageof development, thus to reduce the time and cost
efficient and effective way to refine andoptimize interfaces through discussion, exploration, testingand iterative revision |
|
|
two types of prototyping and examples? what are they used for?
|
low–fidelity prototyping (e.g. paper–based mockup)
– used to gather feedback on the basic functionality or visuallayout high–fidelity prototyping (e.g. computer based simulation) – used to simulate much of the interaction and functionality in the final product |
|
|
what is fidelity?
|
degree to which the prototype accurately represents theappearance (look and feel) and interaction of the product
|
|
|
what is "vertical" and "horizontal" in the prototyping context?
|
they're compromises
‘horizontal’: provide a wide range of functions, but with littledetail –> breadth ‘vertical’: provide a lot of detail for only a few functions –> depth |
|
|
what is data visualization?
|
graphical display of abstract information for two purposes:
1. sense–making (also called data analysis), and2. communication |
|
|
what are some advantages of data visualization?
|
Comprehend huge amounts of data
Emergent properties and relations Detect problems and inconsistencies in data |
|
|
what is homing?
|
represents the time required to get into ‘homeposition’ for the device on which the next operationwill be executed
|
|
|
what is the formula for the Law of Practice?
|
Tn = T1/√n
Tn = the time to perform a task after n trials T1 = the time to perform a task in the first trial n = number of trials |
|
|
what is the formula for Hick's Law?
|
RT = a + b log2 (n)
RT = response time a = the total time that is not involved with decision making b = an empirically derived constant based on the cognitive processingtime for each option (0.155 seconds for humans) n = number of equally probable alternatives |
|
|
what is the formula for Fitts's Law?
|
ID = log2 (2A/W)
ID = index of difficulty A = distance to move W = width of target |
|
|
match the user motivations with the design goals:
low motivation, discretionary use low motivation, mandatory high motivation, due to fear high motivation, due to interest |
ease of learning
control, power ease of learning, robustness, control power, ease of use |
|
|
why do designers for software for children start at an advantage?
|
children automatically believe/trust
|
|
|
4 stages of children cognition according to Jean Piaget and describe what their cognition is like at each stage
|
1. sensorimotor (ages up to 2 years)
– cognition heavily dependent on what their senses immediately perceive 2. preoperational (ages 2 to 7) – attention can only hold one thing in memory at one time 3. concrete operational (ages 7 to 11) – maturing but abstract concepts can still be difficult – can use simple keyboard and mouse 4. formal operational (ages 11 and up) – child thinking generally similar to adults |
|
|
Vygotsky's sociocultural child theory
|
infants are born with few elementary mental functions (attention, sensation, perception, memory) that eventually get transformed by CULTURE into higher mental functions
cognitive skills evolve from SOCIAL INTERACTIONS with parents and teachers, etc. |
|
|
what is the zone of proximal development?
|
difference between what a learner can do without help and what he or she can do with help
range of tasks that are too complex to be mastered alone but can be accomplished with guidance and encouragement from a more skillful partner |
|
|
what is the difference between Vygotsky's sociocultural activity theory and Piaget's cognitive development theory?
|
Vygotsky says cognitive varies across cultures and stems from social interactions, but Piaget says cognitive development is universal and stems from independent explorations
|
|
|
what do children have difficulty with?
|
holding down mouse
double clicking, using multiple button at once distinguishing left from right |
|
|
what is a task?
|
activities required to obtain a particular goal in a particular domain
|
|
|
during requirements analysis, you need 4 things
|
– functional specification of what system will do
– data requirements and data flow – usability requirements – evaluating prototypes |
|
|
what does performance testing evaluating?
|
efficiency of task
|
|
|
what does user training guide?
|
users to understand tasks
|
|
|
what are stages of task analysis (5)
|
1. defining purpose and scope
2. obtaining data 3. extracting activity lists 4. organizing and describing task performance 5. confirming validity of description |
|
|
what is the main reason why software projects failed?
|
lack of user involvement in the design process
|
|
|
what did Steve Jobs say about true innovation?
|
true innovation comes from recognizing an unmet need and designing a creative way to fill it
|
|
|
what is structured input?
|
get user feedback at DISTINCT points in design process (e.g. focus group, walkthrough, formal/informal test)
|
|
|
cognitive processing is involved when ______ and _______
|
correct action isn't obvious
we don't have a memorized rule that applies (we lack the procedural knowledge) |
