Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September...

41
September 23, 2014 CS 350 - Computer/Human Interaction 1 Lecture 8 Make sure you have your interview notes from the interview exercise started in class on Tuesday, September 9.

Transcript of Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September...

Page 1: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 1

Lecture 8

● Make sure you have your interview notes from the interview exercise started in class on Tuesday, September 9.

Page 2: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 2

Outline

● Finish PHP● Project Overview, CGI Prototype assignment● Briefly review contextual inquiry● Chapter 4 - Contextual analysis

– Synthesizing work activity notes

– Work activity affinity diagram (WAAD)

– In-class exercise

Page 3: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 3

Review: Contextual inquiry

● Inquire into structure of users’ own work practice

● Learn about how people do work your system is to be designed to support

● Most general case, domain-complex systems– High technical content

– Elaborate work flow and inter-role communication

– Need to avoid risk

Page 4: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 4

Introduction

Page 5: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 5

Contextual analysis

● Systematic analysis of contextual user work activity data – Identification, sorting, organization, interpretation,

consolidation, and communication

– For the purpose of understanding work context for new system to be designed

● Contextual analysis does not directly yield either requirements or design

Page 6: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 6

How to do contextual analysis

● Identify work roles, user classes ● Build initial flow model ● Synthesize work activity notes● Consolidate data● Build work activity affinity diagram (WAAD) from

work activity notes ● Communicate results to team via walkthroughs

Page 7: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 7

Contextual analysis process

Page 8: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 8

Flow model

● A “big picture” diagram of work domain – Shows interconnections among components of

work domain

– Work flow among components

– Information flow among components

– Components include key work roles and machine roles (e.g., central database)

– In essence, shows how things get done in domain, how entities communicate

Page 9: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 9

Sketch initial flow model

● Draw nodes of diagram to represent work roles– Label nodes with work role names

● Add additional labeled nodes for other entities (e.g., a database)– Anything involved in flow of work practice

● Add arcs indicating flow– Label with what flows (e.g., order information)

– Include flow outside system and label with flow channel (e.g., phone, email)

Page 10: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 10

Example flow model for MUTTS

Page 11: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 11

Starting analysis

● Transcribe interview and observation recordings, if used. Start with whole team session to get in sync– Review data

● Each interviewer and note taker reviews notes with group● Retell stories, events

● Break into groups with moderators– Refine flow model sketches. Synthesize work activity

notes

● Get back in team session– Consolidate/merge flow models. Share, discuss, and

adjust work activity notes

Page 12: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 12

Synthesizing work activity notes

● IMPORTANT: Doing this well is key to rest of contextual analysis

● Tag each work activity note with source ID– Unique identifier of person observed or interviewed

● Paraphrase and synthesize, instead of quoting raw data verbatim

● Make each work activity note a simple declarative point – Not quote interviewer’s question plus user’s answer– Filter out all noise and fluff

Page 13: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 13

Synthesizing work activity notes

● Make each note– Compact, concise– Easily read, understood at a glance

● Each note should be brief (1-3 succinct sentences and contain– Just one concept, idea, or fact– Possibly with one rationale statement

● Break a long work activity note into shorter ones – Make each note complete and self-standing

Page 14: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 14

Synthesizing work activity notes

● Disambiguate pronouns, references to context● Refer to work roles rather than individual

people ● Avoid repetition of same information in multiple

places– Do not include information from flow model in work

activity notes

Page 15: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 15

Example: Work activity notes for MUTTS

● User (ticket buyer, id=u17) raw comment:

It is too difficult to get enough information about events from a ticket seller at the ticket window. For example, sometimes I want to see information about popular events that are showing downtown this week. I always get the feeling that there are other good events that I can choose from but I just do not know which ones are available and the ticket seller usually is not willing or able to help much, especially when the ticket window is busy.

Page 16: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 16

Example: Work activity notes for MUTTS

● Break up raw comment:It is too difficult to get enough information about events from a ticket seller at the ticket window. For example, sometimes I want to see information about popular events that are showing downtown this week.

● Synthesize work activity notes:It is too difficult to get enough information about events from a ticket seller at the ticket window.

I want to see information about current popular downtown events.

Page 17: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 17

Example: Work activity notes for MUTTS

● Break up raw comment:I always get the feeling that there are other good events that I can choose from but I just do not know which ones are available and the ticket seller usually is not willing or able to help much, especially when the ticket window is busy.

● Synthesize work activity notes (with some interpretation and further discussion):

I would like to be able to find my own events and not depend on the ticket seller to do all the browsing and searching.

There are potential communication gaps because the ticket seller does not always understand my needs.

Page 18: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 18

Example: Work activity notes for MUTTS

● User (ticket buyer, id=u17) raw comment:It is hard to judge just from information available at ticket window whether an event has been well received by others.

● Synthesize work activity notes (with some interpretation and further discussion):

It would be nice to get reviews and other feedback from people who have already seen the show.

[Design idea] Consider including capability for people to add reviews and rate reviews. Question: Should this be located at event venues rather than kiosk?

Page 19: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 19

Organize work activity notes as you go

● Best to print work activity notes (e.g., on Post-it™ stock)

● Extend anticipated data bins to accommodate emerging categories– Start putting work activity notes into corresponding

bins

Page 20: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 20

The work activity affinity diagram (WAAD)

● A work activity affinity diagram is a way to sort data into categories and sub-categories when you don’t know in advance what the categories will be

● The data determine the categories, not preconceived notions

● In practice, it’s both

Page 21: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 21

Prepare to construct WAAD

● Need a big room with plenty of wall space● Tape up large “belt” of paper around walls of

room● Have in hand huge stack of work activity notes● Need enough team members to make it go fast,

but not so many to get bogged down in discussion

Page 22: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 22

Prepare to construct WAAD

● Shuffle the work activity notes, for variety● Deal out dozen or two work activity notes to

each person● Allow time to read notes● Start slowly, working together

Page 23: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 23

Getting started on the WAAD

● Read note, discuss, post on work space (butcher paper on wall)

● If there is related note or notes already posted– Post this note next to it

– The physical proximity represents affinity

Page 24: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 24

Note clusters

● Do not talk about implementation yet● Grow clusters of related work activity notes

– Move notes to related affinity piles

● Label cluster temporarily– Capture gestalt

– So don’t have to re-read notes to know what cluster is about

Page 25: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 25

Example: MUTTS

● Newly hatched cluster with temporary topical label

Page 26: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 26

Post more notes in clusters

● As clusters start forming, team members can look through notes in hand for ones that relate

● Often effective to compartmentalize everything by work role

● Soon clusters will mature into real affinity groups

Page 27: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 27

Example: MUTTS

● Topical label that has grown in scope during affinity diagram building

Page 28: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 28

Pick up the pace

● After everyone gets it, speed it up, work in parallel– Ask for discussion when needed

● Stay flexible– Clusters move and morph

● Set aside outlier or “maverick” notes in a corner– Don’t waste time on them

– They might fall into place later

Page 29: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 29

Democratic process

● Anyone can post or move a label or note– Just have to discuss

● Don’t get invested in data ownership– No note/cluster/group is “owned” by anyone

– Everything is driven by team consensus

Page 30: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 30

Managing groups

● Don’t have huge note groups (4-5 to 12-15 is normal)

● Find ways to split large groups– Different sets of commonalities

● Labels must have high descriptive power– Capture “meaning” of group concisely

● Find groups that are related– Group together with higher-level label

● Can color code levels of labels in hierarchy

Page 31: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 31

Example: building group of groups

Page 32: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 32

Example

● Second-level labels for groups of groups shown in pink

Page 33: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 33

Walkthrough of WAAD

● Consolidation and communication● Share appreciation of user work activities,

issues with all stakeholders● Explain your process in a nutshell

– Goals

– Garner more input

– Discuss to unify WAAD and flow model

– Achieve shared understanding of user work issues

Page 34: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 34

Example: WAAD for MUTTS

Page 35: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 35

In-class exercise:Build a limited WAAD

● Materials– Yellow Post-it™ notes for work activity notes, one

pad for each person

– Purple Post-it™ notes for cluster labels, one pad for each group

– Sheets of paper

● The sheets of paper will make up the workspace. Work activity notes with affinity are to be "posted" to the same sheet of paper.

Page 36: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 36

In-class exercise:Synthesize work activity notes

● Use interview notes for smart fridge exercise from last time.

● The whole group (previous interviewers and interviewees) works together as an analysis team.

● Review the raw contextual data. Each interviewer and note taker should lead a quick review of their data.

Page 37: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 37

In-class exercise:Synthesize work activity notes

● Synthesize work activity notes per the process described in the book and in lecture.

● Write each work activity note directly onto a (yellow) Post-it™ note.– Paraphrase and synthesize, instead of quoting raw

data verbatim. – Make each work activity note a simple declarative

point understood at a glance.. Each note should contain just one concept, idea, or fact.

– Disambiguate pronouns, references to context.

Page 38: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 38

In-class exercise:Build a limited WAAD

● After you have your work activity notes, build a limited work activity affinity diagram from the work activity notes.

● Start by each group member grabbing a few work activity notes on Post-it™ notes.

● Take turns introducing a work activity note to the group, reading it and entertaining brief discussion, if needed.

Page 39: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 39

In-class exercise:Build a limited WAAD

● Then post the note on a sheet of paper● If there is a related note or notes already

posted, post this note next to it on the same sheet of paper, so that the physical proximity represents affinity.

● In this way you will grow affinity clusters as you work.

Page 40: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 40

In-class exercise:Build a limited WAAD

● As the clusters become more well-formed, start labeling them with temporary topic labels (purple Post-it™ notes).

● Use a cluster label (purple Post-it™ notes again) to capture the gestalt of the cluster, so no one has to read the notes again.

● Everyone on the team looks through their notes for others that relate to existing clusters.

Page 41: Lecture 8 - University of Evansvilleuenics.evansville.edu/~hwang/f14-courses/cs350/... · September 23, 2014 CS 350 - Computer/Human Interaction 9 Sketch initial flow model Draw nodes

September 23, 2014 CS 350 - Computer/Human Interaction 41

In-class exercise:Build a limited WAAD

● As clusters expand, if their scope grows, modify the cluster label accordingly.

● Clusters graduate into real groups. When you see groups that are related, create groups of groups and label accordingly.

● If there is time, we’ll have each group report to the class about your WAAD-building process and any difficulties.