introduction to interaction design

238
An Introduction to An Introduction to Interaction Design Mark Billinghurst Mark Billinghurst HIT Lab NZ

Post on 21-Oct-2014

1.949 views

Category:

Technology


3 download

DESCRIPTION

A half day course on Interaction Design taught by Mark Billinghurst from the HIT Lab NZ at the University of Canterbury

TRANSCRIPT

Page 1: Introduction to Interaction Design

An Introduction to An Introduction to Interaction Designg

Mark BillinghurstMark BillinghurstHIT Lab NZ

Page 2: Introduction to Interaction Design

MarkPhD Electrical EngineeringPhD Electrical Engineering

University of WashingtonInteraction DesignInteraction Design

Museum experiencesTools for designersTools for designers

Augmented RealityMobile AR Evaluation Mobile AR, Evaluation, Multimodal Interfaces, Collaborative

CollaborationCollaborationEnhanced FtF and remote collaborationSocial networkingSocial networking

Page 3: Introduction to Interaction Design

Workshop Overview

1. What is Interaction Design 2 Understanding Interaction 2. Understanding Interaction 3. Understanding User Experience4. Design and Prototyping 5 Evaluation 5. Evaluation 6. Design in the Real World7. Resources

Page 4: Introduction to Interaction Design

Source MaterialInteraction Design: Beyond Human Computer-Interactionp

Rogers, Sharp, Preece

htt // id b k /http://www.id-book.com/

Page 5: Introduction to Interaction Design

1. What is Interaction Design?

Mark BillinghurstMark Billinghurst

Preece Chapter 1

Page 6: Introduction to Interaction Design

What to do?I iImagine

You’re bringing a new product to marketYour #2 competitor has been in the market for over a year, selling millions of unitsy gYour #1 competitor launches the same monthYour technology is slower than your competitorsYour technology is slower than your competitorsYour technology is older than your competitorsYour last product failed in the market

Page 7: Introduction to Interaction Design

Do you compete on Price ?Do you compete on Technology ?Do you compete on Technology ?Do you compete on Features ?

Wrong: Compete on user experience !Wrong: Compete on user experience !

Page 8: Introduction to Interaction Design
Page 9: Introduction to Interaction Design

Nintendo Wii

Cheap - $500 Unique game playUnique game play

Wireless 3 DOF controllerPosition and orientation sensing

Aiming to broaden user basegCan play previous games/downloads

Page 10: Introduction to Interaction Design
Page 11: Introduction to Interaction Design

Sales to Sept 2011

Page 12: Introduction to Interaction Design

“Th d i l “The product is no longer th b i f l Th the basis of value. The

experience is ”experience is.

Venkat RamaswamyThe Future of Competition.

Page 13: Introduction to Interaction Design

Gil + Pi E i EGilmore + Pine: Experience Economy

E tiexperiences Emotion

services

productsproducts

components Function

Sony CSL © 2004

Page 14: Introduction to Interaction Design

The Value of Experience

5050c

$3.50

20c

Page 15: Introduction to Interaction Design

Good Experience DesignReactrixReactrix

Top down projectionC b d iCamera based inputReactive GraphicsNo instructionsNo training

Page 16: Introduction to Interaction Design
Page 17: Introduction to Interaction Design
Page 18: Introduction to Interaction Design

Using the N-gage

Page 19: Introduction to Interaction Design

SideTalking

www.sidetalkin.com

Page 20: Introduction to Interaction Design
Page 21: Introduction to Interaction Design
Page 22: Introduction to Interaction Design

Interaction Design“Designing interactive products to support people

in their everyday and working lives”in their everyday and working livesPreece, J., (2002). Interaction Design

Design of User Experience with Technology

Page 23: Introduction to Interaction Design

Goals of interaction designDevelop usable products

Usability means easy to learn, effective to use and y y ,provide an enjoyable experience

Involve users in the design processInvolve users in the design process

Page 24: Introduction to Interaction Design

Bill Verplank

Interaction Design involves answering three questions:What do you do? - How do you affect the world?What do you do? How do you affect the world?What do you feel? – What do you sense of the world?What do you know? – What do you learn? y y

Page 25: Introduction to Interaction Design
Page 26: Introduction to Interaction Design

HCI and interaction design

26www.id-book.com

Page 27: Introduction to Interaction Design
Page 28: Introduction to Interaction Design

I D PInteraction Design Process

Identify needs/ establish

requirementsq

Evaluate

(Re)Design

Build an interactive versionversion

Final productDevelop alternative prototypes/concepts and compare themAnd iterate iterate iterateAnd iterate, iterate, iterate....

Page 29: Introduction to Interaction Design

2. Understanding Interaction

Mark BillinghurstMark Billinghurst

Page 30: Introduction to Interaction Design

Understanding the problem space

What do you want to create?yWhat are your assumptions?What are your claims?What are your claims?Will it achieve what you hope it will? If so, how?

Page 31: Introduction to Interaction Design

Analysing the problem spaceAre there problems with an existing product or user experience? pWhy do you think there are problems?How do you think your proposed design ideas How do you think your proposed design ideas might overcome these? When designing for a new user experience how When designing for a new user experience how will the proposed design extend or change current ways of doing things?y g g

Page 32: Introduction to Interaction Design

Conceptual modelA t l d l i A conceptual model is: “a high-level description of how a system is organized and

operates.” (Johnson and Henderson, 2002, p. 26)operates. (Johnson and Henderson, 2002, p. 26)Need to first think about how the system will appear to users (i.e. how they will understand it)Not a description of the user interface but a structure outlining the concepts and relationships between themB fBenefits

Enables “designers to straighten out their thinking before they start laying out their widgets” (p. 28)y g g (p )Provides a working strategy and a framework of general concepts and their interrelations

Page 33: Introduction to Interaction Design

Interface metaphorsD i d b i il h i l i b l h Designed to be similar to a physical entity but also has own properties

e g desktop metaphor search enginee.g. desktop metaphor, search engineExploit user’s familiar knowledge, helping them to understand ‘the unfamiliar’ Conjures up the essence of the unfamiliar activity, enabling users to leverage of this to understand more aspects of the

f ili f ti litunfamiliar functionalityPeople find it easier to learn and talk about what they are doing at the computer interface in terms familiar to themdoing at the computer interface in terms familiar to them

Page 34: Introduction to Interaction Design

Example: The spreadsheetAnalogous to ledger sheetsheetInteractive and computationalpEasy to understandGreatly extending Greatly extending what accountants and others could do

www.bricklin.com/history/refcards.htm

Page 35: Introduction to Interaction Design

Why was it so good?I l l d b h h It was simple, clear, and obvious to the users how to use the application and what it could do “i i j l ll h k h i “it is just a tool to allow others to work out their ideas and reduce the tedium of repeating the same calculations ”calculations.capitalized on user’s familiarity with ledger sheetsG h f f diff Got the computer to perform a range of different calculations in response to user input

Page 36: Introduction to Interaction Design

Another classic8010 S ff d k 8010 Star office system targeted at workers not interested in computing per seS l b i i ki Spent several person-years at beginning working out the conceptual modelSi lifi d h l i ld ki i Simplified the electronic world, making it seem more familiar, less alien, and easier to learn

Johnson et al (1989)

Page 37: Introduction to Interaction Design
Page 38: Introduction to Interaction Design

Benefits of interface metaphorsM k l Makes learning new systems easierHelps users understand the underlying p y gconceptual modelCan be innovative and enable the realm of Can be innovative and enable the realm of computers and their applications to be made more accessible to a greater diversity of usersmore accessible to a greater diversity of users

Page 39: Introduction to Interaction Design

P bl h f h Problems with interface metaphors (Nielson 1990)(Nielson, 1990)

Break conventional and cultural rulese.g., recycle bin placed on desktop

Can constrain designers in the way they conceptualize a problem Conflict with design principlesForces users to only understand the system in terms of the metaphorDesigners can inadvertently use bad existing designs and transfer h b d the bad parts over

Limits designers’ imagination with new conceptual models

Page 40: Introduction to Interaction Design

Microsoft Bob

Page 41: Introduction to Interaction Design

Summary pointsNeed to have a good understanding of the problem space

specifying what it is you are doing, why, and how it will support p y g y g, y, ppusers in the way intended

A conceptual model is a high-level description of a product what users can do with it and the concepts they need to

understand how to interact with it

D i i b l d i h ld b d b f Decisions about conceptual design should be made before commencing any physical designInterface metaphors are commonly used as part of a Interface metaphors are commonly used as part of a conceptual model

Page 42: Introduction to Interaction Design

3. Understanding User Experience

Mark BillinghurstMark Billinghurst

Page 43: Introduction to Interaction Design

What is a Bad Experience

??

Page 44: Introduction to Interaction Design

Misleading Graphics

Page 45: Introduction to Interaction Design

Cognitive Overload for Simple Taskg p

Page 46: Introduction to Interaction Design

Cognitive Overload for Simple Task

Page 47: Introduction to Interaction Design

Dangerously Undermining TaskMany people in Palm Beach, Florida that wanted to vote for y p pAl Gore, accidentally voted for Pat Buchanan

Estimated 4000 voted “wrong“wrong

Another 19,000 punched both holespunched both holes(invalid vote)

Page 48: Introduction to Interaction Design

Interaction Design is User Centered

A methodology for ensuring good user experiences with products by getting experiences with products by getting feedback from users to inform the design.

Page 49: Introduction to Interaction Design

1. User research and needs analysis

Identify needs/ establish

i trequirements

Evaluate

(Re)Design

Build an interactive version

Final producta p oduct

Page 50: Introduction to Interaction Design

What, How and Why?

•Why:•Why:Requirements definition: the stage

h f il t where failure occurs most commonly

Getting requirements right is crucial

50 www.id-book.com

Page 51: Introduction to Interaction Design
Page 52: Introduction to Interaction Design

What, how and why?•What

1. Understand users, task, context2. Produce a stable set of requirements

•How:D t th i ti itiData gathering activitiesData analysis activitiesExpression as ‘requirements’

IterateExpression as requirements

•Why:yRequirements definition: failure occurs most commonly

Getting requirements right is crucial

Page 53: Introduction to Interaction Design

Wh h R ?What are the Requirements?

FunctionalWhat should the system do? What has it done?

DataEnvironment or Context of useEnvironment or Context of use

Physical: dusty? noisy? light? heat? humidity? …. Social: sharing of files of displays work alone Social: sharing of files, of displays, work alone ..Organizational: IT support, hierarchy, training..

U Wh h ?Users: Who are they?Usability: learnability, throughput, flexibility..

Page 54: Introduction to Interaction Design

Who are your Users?

Everyone!y

Page 55: Introduction to Interaction Design

Who REALLY are your Users/Stakeholders?

•Not as obvious as you think:— those who interact directly with the product

— those who manage direct users

those who receive output from the product — those who receive output from the product

— those who make the purchasing decision

— those who use competitor’s productsthose who use competitor s products

•Three categories of user (Eason, 1987): — primary: frequent hands-onp y q

— secondary: occasional or via someone else

— tertiary: affected by its introduction, or will influence its purchase

Page 56: Introduction to Interaction Design

Who are the Stakeholders?Check-out operators

• Suppliers• Local shop owners

C tManagers and owners CustomersManagers and owners

Page 57: Introduction to Interaction Design

Understanding Specific Needs

Page 58: Introduction to Interaction Design

Designing for Everyone

Designing for Everyone pleases No one

Page 59: Introduction to Interaction Design

Consider the Whole User

Page 60: Introduction to Interaction Design

Data Gathering Techniques (1) Questionnaires

Looking for specific informationLooking for specific informationQualitative and quantitative resultsGood for getting data from a large dispersed groupGood for getting data from a large, dispersed group

InterviewsGood for exploring issues, using propsStructured, unstructured or semi-structuredBut are time consuming and difficult to visit everyone

Page 61: Introduction to Interaction Design

Data Gathering Techniques (2)W k h f Workshops or focus groups

Group interviews/activitiesG d i i i d/ Good at gaining a consensus view and/or

highlighting areas of conflictObservationsObservations

Spending time with users in day to day tasksGood for understanding task contextGood for understanding task contextrequires time and can result in a huge amount of data

DocumentationDocumentationProcedures and rules written down in manuals

Page 62: Introduction to Interaction Design

A day in the Life of.. Cultural Probes.. Role Playing..A day in the Life of.. Cultural Probes.. Role Playing..

Page 63: Introduction to Interaction Design

Case Study: Equator Domestic Probes

Page 64: Introduction to Interaction Design

Some Basic Guidelines• Focus on identifying the stakeholders’ needs

• Involve all the stakeholder groups • Involve all the stakeholder groups

• Involve more than one person from each group

• Use a combination of data gathering techniques

S h i h h • Support the process with props such as prototypes

• Consider carefully how to record the data y

Page 65: Introduction to Interaction Design

User Interactions =The Golden EggUser Interactions =The Golden Egg

Page 66: Introduction to Interaction Design

Why?U l f f db k b h Users can give you lots of feedback about what your product does well and what it doesn’t do well.

Users can give you insight into their lives and needs h l i d d h i hi h helping you understand the context in which your product will be used

Users can inspire design solutions you haven’t h h fthought of.

Page 67: Introduction to Interaction Design

Interviewing TechniquesGood interviewing is a skill and needs to be

done properly to ensure you maximize the p p y yopportunity you have with your users

Tips for interacting with end users:Tips for interacting with end users:1. Listen2. Watch3 C t T t3. Create Trust4. Inform Design g

Page 68: Introduction to Interaction Design

1. ListenMost important part of interviewing.

You are not there to train the user or todemonstrate how much you know. Youare interviewing an expert to gain knowledge.

Treat them like a precious partner and rememberthey know a lot more about their work then you do.

Page 69: Introduction to Interaction Design

2. WatchRemember users will tend to want to say whatthey think you want to hear.

Create opportunities to observe users rather thanask users.

Page 70: Introduction to Interaction Design

Case StudyCase Study –

A usability professional is interviewing a user:A usability professional is interviewing a user:

Professional: “Do you know how to set the margins?”

User: “Oh yes, I do that all the time.”

Professional: “Could you show me how to do it?”

User: “Sure.” (user presses a series of buttons unrelatedto setting margins – the button sequence is actuallychanging a different setting).

“See it beeped so the margins are set ”See it beeped so the margins are set.

Page 71: Introduction to Interaction Design

3. Create TrustUsers will be nervous that they will appearstupid or incompetent.

“We are testing design, not you”

To get good data, user must feel relaxedand trusting.

Page 72: Introduction to Interaction Design

A user’s perspective:

Well okay, today’s the day. I have to report to some building on 14th street. I must admit I’m a bit nervous. When I spoke to the woman on the phone, she askedadmit I m a bit nervous. When I spoke to the woman on the phone, she asked me a whole lot of questions about my background and experience. She seemed particularly gleeful that I wasn’t competent using computers and equipment. I’m glad she is happy but for me it’s a recurring problem.q p g ppy g p

I’ve always felt intimidated with electronics. She wants me to use something on the computer while some people watch me. Well, it’s an easy $50 bucks and seeing that I don’t know the people, it can’t be too embarrassing…

On the other hand, what if I’m the first person in the world that doesn’t understand how to do whatever I’m supposed to do? What if I totally bomb? What if they ask me a question that is embarrassing and they find out how stupid I really am. Well, I’ll give it a go this time but I don’t think I can do this again.

Page 73: Introduction to Interaction Design

4. Inform DesignUser research does not dictate your design butrather informs you so that you design better.

g

y y g

Page 74: Introduction to Interaction Design

Woodblock Study Exampley pUsers were asked to place ti k ti f tistickers representing functions

On a block model.

Resulting design did not copy wordResulting design did not copy wordfor word where the users placedbuttons.

Resulting design was informed byhow users grouped buttons andby observation of users interactingby observation of users interactingwith the stickers.

Page 75: Introduction to Interaction Design

SummaryFour basic activities in the design process

1. Establishing requirements2. Designing alternatives3. Prototyping4 Evaluating4. Evaluating

User-centered design rests on three principles1 E l f d t k1. Early focus on users and tasks2. Empirical measurement using quantifiable & measurable

usability criteria3. Iterative design

75 www.id-book.com

Page 76: Introduction to Interaction Design

4. Design and Prototyping

Mark Billinghurst

Page 77: Introduction to Interaction Design

2 (R )D2. (Re)Design

Identify needs/ establish

requirementsq

Evaluate

(Re)Design

Build an interactive versionversion

Final product

Page 78: Introduction to Interaction Design

Design Inspiration

Page 79: Introduction to Interaction Design

Discovering Unmet Needs

Digital Cameras for AppleLate 80s – What would happen if we married

a computer with a digital camera?

Many studies of current photography use.Uncovering of unmet needs in traditional experience

- not enough photos- not knowing whether photo good or not

bilit t dd d- ability to add sound- ability to organize

Features determined through research and designedFeatures determined through research and designedIteratively.

Page 80: Introduction to Interaction Design

BrainstormingBest with interdisciplinary team

Page 81: Introduction to Interaction Design

Other ProductsNotice all the iPod look-alikes?

Page 82: Introduction to Interaction Design

Tools for Effective Design

PersonasScenarios Scenarios Storyboards (comic strip, movie technique)Wireframes and Mock-upsPrototypesyp

Page 83: Introduction to Interaction Design

P T hPersona Technique

Personas are a design tool to help visualize who you are designing for and imagine how this you are designing for and imagine how this person will use the product

A persona is an archetype that represents the behavior and goals of a group of users

Based on insights and observations from customer researchcustomer research

Page 84: Introduction to Interaction Design

How to Develop a Persona

BrainstormingImagining different people using the technology

Design ResearchEthnographic StudiesEthnographic StudiesContextual InquiryField StudiesField StudiesUsability Studies

Marketing ResearchFocus GroupsSales FeedbackSales Feedback

Page 85: Introduction to Interaction Design

Gunther the Ad GuyGunther the Ad Guy

Gunther is from Germany. He Travels extensively for work andAs he is an advertising executivehe needs to present concepts toclients quickly and easily. He is a person very well-versed in newt h l i d i h h h dtechnologies and wishes he hadeasier portable solutions for hispresentations…..

Page 86: Introduction to Interaction Design

86 www.id-book.com

Page 87: Introduction to Interaction Design

How to use your PersonasUse them to find real people for usability testing.Use them as a foundation to discuss any design

/f h issues/feature issues that come up.Use them to evaluate competitor’s products.Use them to keep you honest.Keep updating them as part of your continued user

hresearch.Use them to find real customers you can have on-going relationships withgoing relationships with.

Page 88: Introduction to Interaction Design

ScenariosUsage Scenarios are narrative descriptions of how

the product meets the needs of a personathe product meets the needs of a persona

Short (2 pages max)Short (2 pages max)Focus on unmet needs of personaC Concrete storySet of stories around essential tasks, problems...Use to test ideas

Page 89: Introduction to Interaction Design

Scenario Technique

Develop with personasDevelop with personasPrioritize experiences to supportFocus on top three experiences but support other Focus on top three experiences but support other

experiences

Page 90: Introduction to Interaction Design

A business woman travels from SF to Paris on a business trip. On her way to the airport she narrowly misses a traffic delay She avoidsway to the airport she narrowly misses a traffic delay. She avoids the jam because her Smartphone beeps and send her a warning text message on her route from the office to the airport.

Upon arrival the location-sensitive Smartphone notifies the airline that she‘ll check in shortly and an airline employee finds her immediately and takes her baggage Her display shows that herimmediately and takes her baggage. Her display shows that her flight is on time and provides a map to her gate. On the way she downloads tourist information (maps, events) for Paris.

Symbian

Page 91: Introduction to Interaction Design

O f d h t h b i t i th d l d dOnce found her seat, she begins to review the downloaded information. She books a ticket for an opera she wants to see. Her Smartphone makes the booking using her credit card number p g gstored in memory. The security software of the Smartphone protects her against fraud.

The Smartphone stores the opera booking along ith emails rittenThe Smartphone stores the opera booking along with emails written on the plane. As soon as she steps off the plane, it makes the calls and sends the emails. As she leaves the airport, a map appears on the display and guides her to her hotel

Symbian

Page 92: Introduction to Interaction Design

Storyboarding

Sequence of sketches showing use of system in everyday use context

Concrete exampleEasier (faster) to grasp than text based storiesMeans of communication with users and system

developerspSketches, not drawings...Use to test interaction and make sure design works Use to test interaction and make sure design works

Page 93: Introduction to Interaction Design

Turning Scenarios into Storyboards

1. Photographs to match personas(can be used to communicate environment or (can be used to communicate environment or profession)

2. Drawings

3. Draw-over acted photos

4. Detail not important – communicate the experience rather than specificsrather than specifics.

Page 94: Introduction to Interaction Design

Example Storyboard

Page 95: Introduction to Interaction Design

Example Storyboard p.2

Page 96: Introduction to Interaction Design

Wireframes & Mock UpsRoughly sketched sequences exploring and validating

interaction design.

Focus is on navigation and functionality.

Usually explores one interaction but can also be used Usually explores one interaction but can also be used as the foundation for development of testing prototypes.p yp

Page 97: Introduction to Interaction Design
Page 98: Introduction to Interaction Design
Page 99: Introduction to Interaction Design

Prototyping

Mark Billinghurst

Page 100: Introduction to Interaction Design

D d PDesign and Prototyping

Identify needs/ establish

requirementsq

Evaluate

(Re)Design

Build an interactive versionversion

Final product

Page 101: Introduction to Interaction Design

Prototypes Redefined

Prototyping is common activity in product development.development.Traditional prototypes can take weeks or months.

RAPID prototyping is a design technique d d l f dto speed up development of ideas.

A rapid prototype can take as little as a few minutes to make.

Page 102: Introduction to Interaction Design

Benefits of RAPID Prototyping

Fast and inexpensiveIdentifies problems before they’re codedIdentifies problems before they re codedElicits more and better feedback from usersHelps developers think creativelyHelps developers think creativelyGets users and other stakeholders involved

l i th early in the processFosters teamwork and communicationA id i i Avoids opinion warsHelps decide design directions

Page 103: Introduction to Interaction Design

Types of Prototypes

Low Fidelity – quick and dirty, easy access materials like cardboard and paper.

High Fidelity – more involved electronic versions similar in materials to final product.

Page 104: Introduction to Interaction Design

Paper Prototyping (Low Fidelity)

Quick and simple means of sketching interfacesU ffi t i lUse office materialsEasier to criticize, quick to changeCreative process (develop in team)Creative process (develop in team)Can also use for usability test (focus on flow of

interaction rather than visuals)interaction rather than visuals)Used a lot to test out concepts before real design begins.g

Page 105: Introduction to Interaction Design

Paper Proto: Create Widgets

Page 106: Introduction to Interaction Design

Paper Prototyping w/Hardware

Page 107: Introduction to Interaction Design

Blank Model Prototypes

Page 108: Introduction to Interaction Design

S M kU PScreen MockUp Prototypes

Page 109: Introduction to Interaction Design

Interactive Role Play

Page 110: Introduction to Interaction Design

Interactive Role Play in Environment

IDEO.com

Page 111: Introduction to Interaction Design

Half-functional prototypes

More hi-fi

HTML ( HTML (or Powerpoint) ...

Mostly precodedflow, but allowsclicking and experiencing flow

Page 112: Introduction to Interaction Design

Wi f i T lWireframing ToolsPidoco (websites mobile desktop)Pidoco (websites, mobile, desktop)

No programminghttp://www.pidoco.com

WireframeSketcherPlug-in for Eclipsehtt // i f k t h /http://wireframesketcher.com/

Omnigraffle (Mac)Digramming toolhttp://www omnigroup com/products/omnigraffle/http://www.omnigroup.com/products/omnigraffle/

Page 113: Introduction to Interaction Design

Mobile Rapid Prototype Tools

Android: App Inventorhttp://appinventor.googlelabs.com/about/

iPhone – Meta collectioniPhone Meta collectionhttp://iphoneized.com/2009/11/21-prototyping-mockup wireframing tools iphone app development/mockup-wireframing-tools-iphone-app-development/

Page 114: Introduction to Interaction Design

Tethered Prototypes (High Fidelity)

Goal: Communicate Vision

HIGH FIDELITY PROTOTYE

Page 115: Introduction to Interaction Design

Rapid Prototyping

Speed development time with quick hardware mockupsSpeed development time with quick hardware mockupshandheld device connected to PCLCD screen USB phone keypad CameraLCD screen, USB phone keypad, Camera

Can use PC development tools for rapid developmentFl h Vi l B i Flash, Visual Basic, etc

Page 116: Introduction to Interaction Design

‘Wizard-of-Oz’ PrototypingThe user thinks they are interacting with a • The user thinks they are interacting with a computer, but a developer is responding to output rather than the system. output rather than the system.

• Usually done early in design to understand users’ expectations

User

>Blurb blurb>Do this>Why?

116 www.id-book.com

Page 117: Introduction to Interaction Design

Typical Iterations for HW/SW Product:

1 Paper prototype to evaluate conceptual model1. Paper prototype to evaluate conceptual model2. Interactive computer-based prototype with rough

screens to evaluate feature placementp3. Tethered prototype to evaluate button + screen

interactions4. Real device prototyped with major features working5. Real device prototyped with all features working and

graphic design implemented

Page 118: Introduction to Interaction Design

D d PDesign and Prototyping

Identify needs/ establish

requirementsq

Evaluate

(Re)Design

Build an interactive versionversion

Final product

Page 119: Introduction to Interaction Design

Design Case Study

Page 120: Introduction to Interaction Design

ITERATIVE DESIGN PROCESS

Design(redesign)

PrototypeTest Design with Users Evaluate

( i ) (Note problems)(Fix Issues)

Page 121: Introduction to Interaction Design

MOBILE AUGMENTED MOBILE AUGMENTED MOBILE AUGMENTED MOBILE AUGMENTED REALITY FOR SPATIAL REALITY FOR SPATIAL REALITY FOR SPATIAL REALITY FOR SPATIAL

NAVIGATIONNAVIGATION

Sharon BrosnanSharon BrosnanSharon BrosnanSharon Brosnan06518690651869

Bachelor of Science in Digital Media DesignBachelor of Science in Digital Media Design

Page 122: Introduction to Interaction Design

BUNRATTY FOLK BUNRATTY FOLK PARKSharon BrosnanSharon BrosnanPARKSharon BrosnanSharon Brosnan

06518690651869Bachelor of Science in Digital Media DesignBachelor of Science in Digital Media Design

Page 123: Introduction to Interaction Design

BUNRATTY FOLK PARK

Irish visitor attraction run by Shannon Heritageg

19 h l f d19th century life is recreated

Buildings from the mid-west have been l t d t th 26 l d di B tt relocated to the 26-land surrounding Bunratty

Castle

30 buildings are set in a rural or village setting

Page 124: Introduction to Interaction Design

AUGMENTED REALITY

In Bunratty Folk Park:Allows the visitor to point a camera at an Allows the visitor to point a camera at an exhibit, the device recognises its by it’s

f location and layers digital information on to the displayp y3- dimensional virtual objects can be positioned with real ones on displaypositioned with real ones on displayLeads to dynamic combination of a live camera view and information

Page 125: Introduction to Interaction Design

NAVIGATIONAL AID

Smartphone PlatformMost people carry mobile phones and are Most people carry mobile phones and are

comfortable with themId l A d R li T h lIdeal Augmented Reality Technology

Global tracking toolsgWireless communication capabilities Location based computingLarge display for interactionLarge display for interaction

Page 126: Introduction to Interaction Design

DESIGNINGFOR THE VISITOR

Page 127: Introduction to Interaction Design

HUMAN CENTRED DESIGNG l f th N i ti l AidGoal of the Navigational Aid

Easy to use, clear and understandableUseful to visitorsUseful to visitorsCreating interaction between the visitor and the aid through the user interfaceE h i iEngage the visitor

To ensure this… It is necessary to understand the visitor of a navigational aid in It is necessary to understand the visitor of a navigational aid in Bunratty Folk ParkIdentify visitor motives and goals while going through the Folk P kPark.

Page 128: Introduction to Interaction Design

HUMAN CENTRED DESIGNUnderstanding the technology and Related Understanding the technology and Related

WorksLiterature

Similar TechnologiesgElectronic Tours in Museum SettingsInteractions design in Outdoor Museumsg

Understanding the User over timeObObservationsInterviewste v ews

Page 129: Introduction to Interaction Design

HUMAN CENTRED DESIGN

FindingsMost visitors do not use the mapMost visitors do not use the map

Most visitors have mobile phones

Visitors want more information

View the Folk Park at their own pace

Information should be straight to the pointInformation should be straight to the point

Large social interaction within groups g g p

Page 130: Introduction to Interaction Design

NEXT STEPS FROM RESEARCH

Define Visitors Goals

D fi F ti liti f th AidDefine Functionalities of the Aid

Develop Personas – visitors who use the AidDevelop Personas visitors who use the Aid

Develop Scenarios – how the persona uses the p pnavigational aid in the Folk Park

Draw up Storyboards on scenarios

Page 131: Introduction to Interaction Design

FUNCTIONALITYFUNCTIONALITYView Options

Camera View

Augmented Reality Features for

Map ViewList View

navigationText Information

Sub-Options

Text Information3D Objects3D Tour GuideSub Options

PlacesEvents

3D Tour Guide3D Placement of BuildingsEvents

Restaurants

g

Page 132: Introduction to Interaction Design

STORYBOARD

Page 133: Introduction to Interaction Design
Page 134: Introduction to Interaction Design
Page 135: Introduction to Interaction Design

ITERATIVE DESIGN PROCESS

Page 136: Introduction to Interaction Design

ITERATIVE DESIGN PROCESS

Prototyping and User TestingLow Fidelity PrototypingLow Fidelity Prototyping

SketchesPaper PrototypingPaper PrototypingPost-It PrototypingPowerPoint PrototypingPowerPoint Prototyping

High Fidelity PrototypingWikitudeWikitude

Page 137: Introduction to Interaction Design

INITIAL SKETCHESPros:• Good for idea generation• Cheap• Concepts seem feasible

Cons:• Not great feedback gained• Photoshop not fast enough for• Photoshop not fast enough for making changes

Page 138: Introduction to Interaction Design

POST IT PROTOTYPINGCamera View with 3DCamera View with 3D

First Draft Second Draft Third Draft

• Selection • Home button added• Selection highlighted in blue

• Home button added for easy navigation to main menu

Page 139: Introduction to Interaction Design

POWERPOINT PROTOTYPINGPOWERPOINT PROTOTYPINGBenefitsBenefits • Used for User Testing• Interactive• Functionalities work when following the• Functionalities work when following the story of Scenario 1• QuickE t f lid• Easy arrangement of slides

User Testing• Participants found• 15 minute sessions screen captured

• ‘Talk Allowed’ technique used• Talk Allowed  technique used 

• Notes taken

• Post Interview• Post‐Interview

Page 140: Introduction to Interaction Design

WIKITUDE

Popular augmented reality browser for mobile devices

Mapping

Point of Interest abilities

M l i l fMultiplatform

Shows the points of interest Shows the points of interest of Bunratty Folk Park

Markers can be selected in and an Markers can be selected in and an information pop-up appears

Page 141: Introduction to Interaction Design

WIKITUDE

User TestingApplication well receivedApplication well received

Understandable

Participants playful with the technology

Page 142: Introduction to Interaction Design

FINAL CONCEPT DESIGN

Page 143: Introduction to Interaction Design

FINAL DESIGN CONCEPTK IKey Issues

Fix issues found in previous sessions

Design with guidelines in mind

Appealing to the Mental ModelIcon Design

Aesthetic DesignColour/FontButtonsLook

Page 144: Introduction to Interaction Design

VIDEO PROTOTYPEFlexible tool for capturing the use of an interface

Elaborate simulation of how the navigational aid will work

Does not need to be realistic in every detailevery detail

Gives a good idea of how the finished system will workfinished system will work

Page 145: Introduction to Interaction Design

5. User Evaluation

Mark BillinghurstMark Billinghurst

Page 146: Introduction to Interaction Design

4. Evaluation

Identify needs/ establish

i trequirements

Evaluate

(Re)Design

Build an interactive version

Final product

Page 147: Introduction to Interaction Design

What is evaluation?

Evaluation is concerned with h i d b h bili f gathering data about the usability of

a design or product by a specified a design or product by a specified group of users for a particular activitywithin a specified environment or work contextcontext

Page 148: Introduction to Interaction Design

When to evaluate?Once the product has been developed

pros : rapid development, small evaluation costp p p ,cons : rectifying problems

design implementation evaluation redesign &reimplementation

During design and development fi d d if bl lpros : find and rectify problems early

cons : higher evaluation cost, longer development

design implementation

Page 149: Introduction to Interaction Design

Four evaluation paradigms

‘quick and dirty’qu c a tyusability testing (lab studies)field studiespredictive evaluation predictive evaluation

Page 150: Introduction to Interaction Design

Quick and dirty

‘quick & dirty’ evaluation: informal feedback from users or consultants to confirm that their from users or consultants to confirm that their ideas are in-line with users’ needs and are liked.Quick & dirty evaluations are done any time.Emphasis is on fast input to the design process Emphasis is on fast input to the design process rather than carefully documented findings.

Page 151: Introduction to Interaction Design

Usability TestingRecording typical users’ performance on typical tasks in controlled settings. Field observations may be used.g yAs the users perform these tasks they are watched & recorded on video & their key presses are logged. This data is used to calculate performance times, errors & help explain why the users did what they did. User satisfaction questionnaires & interviews are used to elicit

users’ opinions.

Page 152: Introduction to Interaction Design

Laboratory-based studiesLaboratory-based studies

can be used for evaluating the design, or the can be used for evaluating the design, or the implemented systemare carried out in an interruption free usability labare carried out in an interruption-free usability labcan accurately record some work situationssome studies are only possible in a lab environmentsome tasks can be adequately performed in a labq y pare useful for comparing different designs in a controlled contextcontrolled context

Page 153: Introduction to Interaction Design

Laboratory-based studies

Controlled, instrumented environment

Page 154: Introduction to Interaction Design

Portable equipment for the field

154 www.id-book.com

Page 155: Introduction to Interaction Design

Field StudiesField studies are done in natural settingsThe aim is to understand what users do naturally and yhow technology impacts them.In product design field studies can be used to:In product design field studies can be used to:- identify opportunities for new technology- determine design requirements determine design requirements - decide how to introduce new technology- evaluate technology in use- evaluate technology in use.

Page 156: Introduction to Interaction Design

Predictive EvaluationExperts apply their knowledge of typical users often guided by heuristics to predict users, often guided by heuristics, to predict usability problems. Can involve theoretically based models. A key feature of predictive evaluation is A key feature of predictive evaluation is that users need not be presentRelatively quick and inexpensive

Page 157: Introduction to Interaction Design

Characteristics of approachesUsability testing

Field studies

Predictive

Users do task natural not involved

Location controlled natural anywhereLocation controlled natural anywhere

When prototype early prototype

Data quantitative qualitative problems

Feed back measures & descriptions problemserrors

Type applied naturalistic expert

Page 158: Introduction to Interaction Design

Evaluation approaches and methods

Method Usability testing

Field studies

Predictive

Observing x x

Asking x xAsking users

x x

Asking x xAsking experts

x x

Testing xTesting x

Modeling x

Page 159: Introduction to Interaction Design

Living labsPeople’s use of technology in their everyday lives can be evaluated in living labs.gSuch evaluations are too difficult to do in a usability labusability lab.Eg the Aware Home was embedded with a complex network of sensors and audio/video recording devices (Abowd et al., 2000).recording devices (Abowd et al., 2000).

159 www.id-book.com

Page 160: Introduction to Interaction Design

User Evaluation Process

160 www.id-book.com

Page 161: Introduction to Interaction Design

DECIDE: A framework to guide evaluationA framework to guide evaluation

- Determine the goals the evaluation addresses.Determine the goals the evaluation addresses.- Explore the specific questions to be answered.

Ch th l ti p di d t h i- Choose the evaluation paradigm and techniques- Identify the practical issues.- Decide how to deal with the ethical issues.- Evaluate, interpret and present the data.Evaluate, interpret and present the data.

Page 162: Introduction to Interaction Design

DECIDE FrameworkD G l Determine Goals:

What are the high-level goals of the evaluation?H t th l ti d h ?How wants the evaluation and why?

Explore the Questions:Create well defined, relevant questionsCreate well defined, relevant questions

Choose the Evaluation ParadigmInfluences the techniques used, how data is analyzed

Identify Practical IssuesHow to select users, stay on budget & scheduleHow to find evaluators, select equipment

Page 163: Introduction to Interaction Design

DECIDE FrameworkDecide on Ethical IssuesDecide on Ethical Issues

Informed consent formParticipants have a right to:

k th l f th t d d h t ill h t th fi di- know the goals of the study and what will happen to the findings- privacy of personal information

Evaluate, Interpret and Present Data, p

- Reliability: can the study be replicated?- Validity: is it measuring what you thought?y g y g- Biases: is the process creating biases?- Scope: can the findings be generalized?

E l i l lidit i th i t i fl i th lt ? - Ecological validity: is the environment influencing the results?

Page 164: Introduction to Interaction Design

K Key points• Many issues to consider before conducting an • Many issues to consider before conducting an

evaluation study. • These include: goals of the study; involvment or not • These include: goals of the study; involvment or not

of users; the methods to use; practical & ethical issues; how data will be collected analyzed & issues; how data will be collected, analyzed & presented.Th DECIDE f k id f l h kli • The DECIDE framework provides a useful checklist for planning an evaluation study.

164 www.id-book.com

Page 165: Introduction to Interaction Design

Usability Testing

Page 166: Introduction to Interaction Design

U b l TUsability TestingRecording performance of typical users doing typical tasksRecording performance of typical users doing typical tasks.Controlled settings. U b d d dUsers are observed and timed.Data is recorded on video & key presses are logged. The data is used to calculate performance times, and to identify & explain errors. User satisfaction is evaluated using questionnaires & interviews. Field observations can provide contextual understanding.

166 www.id-book.com

Page 167: Introduction to Interaction Design

Experiments & Usability Testing

Experiments test hypotheses to discover new knowledge by investigating the relationship between g y g g ptwo or more things – i.e., variables. Usability testing is applied experimentation. y g pp pDevelopers check that the system is usable by the intended user population for their tasks.p pExperiments may also be done in usability testing.

167 www.id-book.com

Page 168: Introduction to Interaction Design

U bilit T ti & R hUsability Testing & ResearchUsability testing Experiments for y g

Improve products

presearchDiscover knowledge

Few participantsResults inform designU ll l l

Many participantsResults validated statistically Usually not completely

replicableConditions controlled as

statistically Must be replicableStrongly controlled Conditions controlled as

much as possibleProcedure planned

Strongly controlled conditionsExperimental designp

Results reported to developers

p gScientific report to scientific community

168 www.id-book.com

Page 169: Introduction to Interaction Design

Pilot StudiesA small trial run of the main study.

Can identify majority of issues with interface designCan identify majority of issues with interface design

Pilot studies check:that the evaluation plan is viable- that the evaluation plan is viable

- you can conduct the procedureh i i i i i - that interview scripts, questionnaires,

experiments, etc. work appropriatelyIron out problems before doing the main study.

Page 170: Introduction to Interaction Design

Controlled experimentsDesigner of a controlled experiment should carefully considery

proposed hypothesisselected subjectsselected subjectsmeasured variablesexperimental methodsdata collectiondata analysis

Page 171: Introduction to Interaction Design

SubjectsTh h f b l h l d f The choice of subjects is critical to the validity of the results of an experiment

subjects group should be representative of the expected user population

In selecting the subjects it is important to consider things such as their g

age group, education, skills, cultureThe sample size should be large enough (10+) to The sample size should be large enough (10+) to be statistically representative of the population

Page 172: Introduction to Interaction Design

V i blVariablesExperiments manipulate and measure variablesExperiments manipulate and measure variablesunder controlled conditionsThere are two types of variables

independent: variables that are manipulated to independent: variables that are manipulated to create different experimental conditions

- e g number of items in menus colour of the icons e.g. number of items in menus, colour of the icons

dependent: variables that are measured to find out the effects of changing the independent variablesthe effects of changing the independent variables

- e.g. speed of menu selection, speed of locating icons

Page 173: Introduction to Interaction Design

“Other” VariablesControl variables

e.g. room light, noise…if controlled => less external validity

Random variables (not controlled)( )e.g. fatiguemore influence of random variable => less internal validityy

Confounding variables practicepracticeprevious experience

Page 174: Introduction to Interaction Design

HypothesisA hypothesis is a prediction of the outcomeoutcome

what will happen to the dependent variables when the independent variables are changedthe independent variables are changedto show that the prediction is right- dependant variables don’t change by changing

the independent variables- rejecting the null hypothesis (H0 )

Page 175: Introduction to Interaction Design

Experimental methodsIt is important to select the right experimental method so that the results of the experiment pcan be generalizedThere are mainly two experimental methodsThere are mainly two experimental methods

between-groups: each subject is assigned to one experimental conditionwithin-groups: each subject performs under all the different conditions

Page 176: Introduction to Interaction Design

Experimental methodsBetween-groups Within-groups

Subjects

g p

Subjects

g p

Randomlyassigned

Randomlyassigned

erim

enta

l tas

k

Condition2

Condition3

Condition1

rimen

tal t

asks

Condition2

Condition1

rimen

tal t

asks

Condition1

Condition2

rimen

tal t

asks

Condition1

Condition3

Expe

data data data data data data

Expe

r

Condition3 Ex

per

Condition3 Ex

per

Condition2

Statistical data analysis

data data data

Statistical data analysis

data data data

Page 177: Introduction to Interaction Design

Within vs. Between Subjectsbetween subjects design

each participant is tested on only one level/conditionp p ya separate group of participants is used for each conditioncondition

- one group uses HMD other group uses Handheld device

i hi bj d iwithin subjects designparticipant is tested on each level/condition

- e.g. participants use Handheld device and HMD

repeated measurementp

Page 178: Introduction to Interaction Design

Between SubjectsSometimes a factor must be between subjects

e.g. gender, age, experience

Between subjects advantage: avoids interference effects (e.g. practice / learning effect)( g p g )

Between subjects disadvantage:Increased variability = need more subjectsIncreased variability need more subjects

Important: randomised assignment to conditions

Page 179: Introduction to Interaction Design

Within SubjectsS ti f t t b ithi bj t Sometimes a factor must be within subjects

e.g. measuring learning effects

Within subjects advantagesless participants needed (all participants in all conditions)p p ( p p )differences (variability) between subjects the same across test conditions

Counterbalance order of presenting conditions A => B => C B => C => A C => A => BA => B => C B => C => A C => A => B

The order is best governed by a Latin Square

Page 180: Introduction to Interaction Design

Latin Square Designeach condition occurs once in each row and column

Note: In a balanced Latin Square each condition b th d d f ll h th diti both precedes and follows each other condition an equal number of times

Page 181: Introduction to Interaction Design

Data collection and analysisThe choice of a method is dependent on the type of data that needs to be collectedIn order to test a hypothesis the data has to be analysed using a statistical methodbe analysed using a statistical methodThe choice of a statistical method depends on h f ll d d the type of collected data All the decisions about an experiment should p

be made before it is carried out

Page 182: Introduction to Interaction Design

Observe and MeasureObservations are gathered…

manually (human observers)y ( )automatically (computers, software, cameras, sensors etc )sensors, etc.)

A measurement is a recorded observationObjective metricsObjective metricsSubjective metrics

Page 183: Introduction to Interaction Design

Typical objective metricsk l i itask completion time

errors (number, percent,…)percent of task completedpercent of task completedratio of successes to failuresnumber of repetitionsnumber of repetitionsnumber of commands usednumber of failed commandsnumber of failed commandsphysiological data (heart rate,…)…

Page 184: Introduction to Interaction Design

Typical subjective metricsuser satisfactionsubjective performancesubjective performanceratingsease of useintuitivenessintuitivenessjudgments…

Page 185: Introduction to Interaction Design

Data TypesSubjectiveSubjective

Subjective surveyLikert Scale condition rankings

How easy was the task

1 2 3 4 5- Likert Scale, condition rankings

Observations- Think Aloud

1 2 3 4 5Not very easy Very easy

Think Aloud

Interview responses

ObjectiveObjectivePerformance measures

Time accuracy errors - Time, accuracy, errors

Process measures- Video/audio analysisVideo/audio analysis

Page 186: Introduction to Interaction Design

E erimental Meas resExperimental MeasuresMeasure What does it tell us? How is it measured?

Timings Performance Via a stopwatch, orautomatically by the device.

Errors Performance, Particular sticking points in a task By success in completing the task correctly. Through experimentercorrectly. Through experimenter observation, examining the route walked.

Perceived Workload Effort invested. User satisfaction Through NASA TLX scales and other i iquestionnaires.

Distance traveled and route taken

Depending on the application, these can be used to pinpoint errors and to indicate performance

Using a pedometer, GPS or other location-sensing system. By experimenter observation.

Percentage preferred walking speed

Performance By finding average walking speed, which is compared with normal walking speed.

Comfort User satisfaction. Device acceptability Comfort Rating Scale and other questionnaires.

User comments and preferences

User satisfaction and preferences. Particular sticking points in a task.

Through questionnaires, interviews and think-alouds.preferences sticking points in a task. think alouds.

Experimenter observations Different aspects, depending on the experimenter and on the observations

Through observation and note-taking

Page 187: Introduction to Interaction Design

Statistical AnalysisOnce data is collected statistics can be used for analysisTypical Statistical Techniquesyp q

Comparing between two results- Unpaired T-Test (for between subjects – assumes normal distribution,

interval scale, homogeneity of variances)- Paired T-Test (for within subjects – assumes normal distribution, etc.)

Mann Whitney U test (between subjects if assumptions are not met)- Mann–Whitney U-test (between subjects – if assumptions are not met)

Comparing between > two results- Analysis of Variance – ANOVAAnalysis of Variance ANOVA- Followed by post-hoc analysis – Bonferroni adjustment- Kruskal–Wallis (does not assume normal distribution)

Page 188: Introduction to Interaction Design

Case Study: A Wearable Information Space

Head Stabilized Body Stabilized

A AR i t f id ti l di d i lAn AR interface provides spatial audio and visual cuesDoes a spatial interface aid performance?

–Task time / accuracy

Page 189: Introduction to Interaction Design

Task PerformanceT k Task

find target icons on 8 pagesb i f i remember information space

Conditions A - head-stabilized pagesB - cylindrical display with trackballC - cylindrical display with head tracking

SubjectsSubjectsWithin subjects (need fewer subjects)12 subjects used12 subjects used

Page 190: Introduction to Interaction Design

Experimental MeasuresObObjective

spatial ability (pre-test) Manytime to perform taskinformation recall

kl d (NASA TLX)

Many Different

workload (NASA TLX)

SubjectiveMeasures

jPost Experiment Survey

- rank conditions (forced choice)( )- Likert Scale Questions

• “How intuitive was the interface to use?”

Page 191: Introduction to Interaction Design

Post Experiment SurveyFor each of these conditions please answer:For each of these conditions please answer:

1) How easy was it to find the target?1 2 3 4 5 6 71=not very easy 7=very easy

For the head stabilised condition (A):For the cylindrical condition with mouse input (B):For the head tracked condition (C):

Rank all the conditions in order on a scale of one to three Rank all the conditions in order on a scale of one to three 1) Which condition was easiest to find target (1 = easiest, 3 = hardest)

A: B: C:

Page 192: Introduction to Interaction Design

ResultsB d St bili ti I d P fBody Stabilization Improved Performance

search times significantly faster (One factor ANOVA)

Head Tracking Improved Information recallno difference between trackball and stack case

Head tracking involved more physical work

Page 193: Introduction to Interaction Design

Subjective Impressions

3.54

4.55

1 52

2.53

Find Target

Enjoyable

00.5

11.5

A B C

Subjects Felt Spatialized Conditions (ANOVA):

A B C

j p ( )More enjoyableEasier to find target

Page 194: Introduction to Interaction Design

Subjective Impressions

2

2.5

3

1

1.5

2EasiestUnderstandingIntuitive

0

0.5

A B C

Subject Rankings (Kruskal-Wallis)S l d h h d b l dSpatialized easier to use than head stabilizedBody stabilized gave better understandingHead tracking most intuitiveHead tracking most intuitive

Page 195: Introduction to Interaction Design

Field Studies

Page 196: Introduction to Interaction Design

F ld S dField StudiesField studies are done in natural settingsField studies are done in natural settings.“in the wild” is a term for prototypes being used freely in natural settingsfreely in natural settings.Aim to understand what users do naturally and how technology impacts themtechnology impacts them.Field studies are used in product design to:- identify opportunities for new technology;- identify opportunities for new technology;- determine design requirements; - decide how best to introduce new technology;gy;- evaluate technology in use.

196 www.id-book.com

Page 197: Introduction to Interaction Design

ObservationDirect observation in the fieldDirect observation in the field

Structuring frameworksD f ti i ti (i id t id )Degree of participation (insider or outsider)Ethnography

D b ll d Direct observation in controlled environmentsIndirect observation: tracking users’ activities

DiariesInteraction logging

Page 198: Introduction to Interaction Design

Ethnography (1)• Ethnography is a philosophy with a set of techniques that include

participant observation and interviews• Debate about differences between participant observation and

ethnography• Ethnographers immerse themselves in the culture that they study• A researcher’s degree of participation can vary along a scale from

‘ d ’ ‘ d ’‘outside’ to ‘inside’• Analyzing video and data logs can be time-consuming• Collections of comments, incidents, and artifacts are made

Page 199: Introduction to Interaction Design

Ethnography (2)

Co-operation of people being observed is requiredCo operation of people being observed is requiredInformants are usefulData analysis is continuousData analysis is continuousInterpretivist technique

Questions get refined as understanding growsQuestions get refined as understanding growsReports usually contain examples

Page 200: Introduction to Interaction Design

Direct observation in a controlled settingg

Think-aloud techniqueq

Indirect observation

DiariesInteraction logsC lt l bCultural probes

Page 201: Introduction to Interaction Design

Frameworks to Guide Observation- The person. Who? - The place. Where?

The thing What?- The thing. What?

The Goetz and LeCompte (1984) framework:The Goetz and LeCompte (1984) framework:- Who is present? - What is their role? - What is happening? - When does the activity occur?

Wh i it h i ? - Where is it happening? - Why is it happening? - How is the activity organized?

201 www.id-book.com

How is the activity organized?

Page 202: Introduction to Interaction Design

Predictive Evaluation

Page 203: Introduction to Interaction Design

Predictive modelsProvide a way of evaluating products or designs without directly involving users.g y gLess expensive than user testing.Usefulness limited to systems with Usefulness limited to systems with predictable tasks - e.g., telephone answering systems mobiles cell phones etcsystems, mobiles, cell phones, etc.Based on expert error-free behavior.

Page 204: Introduction to Interaction Design

Fitts’ Law (Fitts 1954)

Fitts’ Law predicts that the time to point at an object using a device is a function of the distance object using a device is a function of the distance from the target object and the object’s size. The further away and the smaller the object the The further away and the smaller the object, the longer the time to locate it and point to it.

Page 205: Introduction to Interaction Design

GOMS ModelG l h h hi fi d Goals - the state the user wants to achieve e.g., find a website.Operators - the cognitive processes and physical actions Operators - the cognitive processes and physical actions needed to attain the goals

Eg moving mouse to select icong gMethods - the procedures for accomplishing the goals, e.g., drag mouse over icon, click on button.Selection rules - decide which method to select when there is more than one.

Page 206: Introduction to Interaction Design

GOMS Response Times (Card et al., 1983)

Operator Description Time (sec)K Pressing a single key or buttong g y

Average skilled typist (55 wpm)Average non-skilled typist (40 wpm)Pressing shift or control keyTypist unfamiliarwiththekeyboard

0.220.280.08120Typist unfamiliar with the keyboard 1.20

P Pointing with a mouse or other device on adisplay to select an object.This value is derived from Fitts’ Law which is

0.40

P1discussed below.Clicking the mouse or similar device 0.20

H Bring ‘home’ hands on the keyboard or otherdevice

0.40device

M Mentally prepare/respond 1.35R(t) The response time is counted only if it causes

the user to wait.t

Page 207: Introduction to Interaction Design

Expert InspectionsSeveral kinds.Experts use their knowledge of users and p gtechnology to review software usability.Expert critiques can be formal or informal reports.p q pHeuristic evaluation is a review guided by a set of heuristics.Walkthroughs involve stepping through a pre-planned scenario noting potential problems.p g p p

Page 208: Introduction to Interaction Design

Nielsen’s heuristicsVisibility of system statusVisibility of system status.Match between system and real world.User control and freedomUser control and freedom.Consistency and standards.E Error prevention. Recognition rather than recall.Flexibility and efficiency of use.Aesthetic and minimalist design.gHelp users recognize, diagnose, recover from errors.Help and documentation.Help and documentation.

Page 209: Introduction to Interaction Design

Three stages for doing heuristic evaluation

Briefing session to tell experts what to do.Evaluation period of 1-2 hours in which:

Each expert works separately;Take one pass to get a feel for the product;Take a second pass to focus on specific features.

Debriefing session in which experts work together to prioritize problems.g p p

Page 210: Introduction to Interaction Design

No. of evaluators & problems

Page 211: Introduction to Interaction Design

Advantages and problemsFew ethical and practical issues to consider because users not involved.Can be difficult and expensive to find experts.Best experts have knowledge of application Best experts have knowledge of application domain and users.Biggest problems:Biggest problems:

Important problems may get missed;Many trivial problems are often identified;Many trivial problems are often identified;Experts have biases.

Page 212: Introduction to Interaction Design

Data Collection

Page 213: Introduction to Interaction Design

OOverviewFi k i f d h i• Five key issues of data gathering

• Data recording• Data recording

• Interviews

• Questionnaires

• Observation

• Choosing and combining techniques• Choosing and combining techniques

213 www.id-book.com

Page 214: Introduction to Interaction Design

F K IFive Key Issues1. Setting goals1. Setting goals

- Decide how to analyze data once collected2. Identifying participants2. Identifying participants

- Decide who to gather data from3. Relationship with participants3. Relationship with participants

- Clear and professional- Informed consent when appropriatepp p

4. Triangulation- Look at data from more than one perspectiveLook at data from more than one perspective

5. Pilot studies- Small trial of main study

214 www.id-book.com

Small trial of main study

Page 215: Introduction to Interaction Design

Data recordingNotes, audio, video, photographs

Notes plus photographsAudio plus photographsAudio plus photographsVideo

215 www.id-book.com

Page 216: Introduction to Interaction Design

Interviews• Unstructured - are not directed by a script.

Rich but not replicable. St t d ti htl i t d ft lik • Structured - are tightly scripted, often like a questionnaire. Replicable but may lack richnessrichness.

• Semi-structured - guided by a script but interesting issues can be explored in more interesting issues can be explored in more depth. Can provide a good balance between richness and replicability.

216 www.id-book.com

Page 217: Introduction to Interaction Design

i Q iInterview Questions• Two types:Two types:

− ‘closed questions’ have a predetermined answer format, e.g., ‘yes’ or ‘no’

− ‘open questions’ do not have a predetermined format

• Closed questions are easier to analyzeA id• Avoid:− Long questions− Compound sentences - split them into two− Compound sentences - split them into two− Jargon and language that the interviewee may not

understand − Leading questions that make assumptions e.g., why do

you like …?− Unconscious biases e g gender stereotypes

217 www.id-book.com

− Unconscious biases e.g., gender stereotypes

Page 218: Introduction to Interaction Design

Enriching the interview process

• Props - devices for prompting interviewee, e.g., a prototype, scenario

218 www.id-book.com

Page 219: Introduction to Interaction Design

Questionnaires• Key Points• Key Points

• Can be administered to large populations• Paper email and the web used for dissemination• Paper, email and the web used for dissemination• Sampling can be a problem when the size of a

population is unknown as is common onlinepopulation is unknown as is common online• Design

• Provide clear instructions• Provide clear instructions• Questions can be closed or open

• closed easier to analyzeclosed easier to analyze

• The impact of a question can be influenced by order

219 www.id-book.com• Will phrases be positive, negative or mixed

Page 220: Introduction to Interaction Design

Encouraging a Good ResponseMake sure purpose of study is clearPromise anonymityy yEnsure questionnaire is well designedOffer a short version for those who do not have time to complete a long questionnaireFollow-up with emails, phone calls, lettersProvide an incentive40% response rate is high, 20% is often acceptablep g p

220 www.id-book.com

Page 221: Introduction to Interaction Design

Online Questionnairesk• www.surveymonkey.com

• Good• Low cost• Responses are usually received quickly• Data automatically collected• Time required for data analysis is reduced

• Bad• Sampling is problematic if population size is unknown• Sampling is problematic if population size is unknown• Preventing individuals from responding more than once

221 www.id-book.com

Page 222: Introduction to Interaction Design

6. Design in the Real WorldMark Billinghurst

Page 223: Introduction to Interaction Design

Product Development Balancing Act

MarketinggSoftwareHardwareHardwareIndustrial DesignInteraction DesignUsabilityUsabilityManufacturing

Page 224: Introduction to Interaction Design

Obstacles to SuccessE h i i Everyone has an opinion

Design by committeeMisunderstanding user researchMisunderstanding user research

Too literal, not objectivePower strugglesPower struggles

Blue vs. Red InterfaceLosing focus of the end userLosing focus of the end user

Feature CreepRelying on assumptions/mythsRelying on assumptions/mythsFeaturitis = Requirements not well established

Page 225: Introduction to Interaction Design

There is never only one design solution!!

Page 226: Introduction to Interaction Design

Penny Wise = Dollar Poor

Software/Hardware development rewarded for fast work and low budgets.gInteraction design activities take some budget and some timeand some time.Investment at front end saves money overall.

Page 227: Introduction to Interaction Design

Cost Justifying UsabilityCost of ChangesDesign Alternatives

Req.Phase

Dev.Phase

BuildPhase

Saving Development Costs

Page 228: Introduction to Interaction Design

Cost Justifying Usability

Increase Revenue“IBM’s Web presence has traditionally been made up of a difficult-to-navigatelabyrinth of disparate subsidies but a redesign made it more cohesive andlabyrinth of disparate subsidies, but a redesign made it more cohesive anduser-friendly. According to IBM, the massive redesign effort quickly paid dividends. The company said in the month after re-launch that traffic to the Shop IBM online store increased 120 percent and sales went up 400%Shop IBM online store increased 120 percent and sales went up 400%.(Battey, 1999)

Increase SafetyIncrease Safety“Chapanis cites two independent studies that showed a 54% reductionIn rear-end accidents with the use of human factors improvement: the centered high-mount brake light on autos.”centered high mount brake light on autos.

Page 229: Introduction to Interaction Design

More Value for Interaction Design

1. US trade magazines score products on usability along with features and cost.

2. 1/3 of new products fail in market place. (PDMA)3. Some big electronic chain stores do their own usability

review of products before they will stock them.4. Customers have become very sophisticated and

DEMAND highly usable products (as do distributors investors)DEMAND highly usable products (as do distributors, investors).5. Enables companies to develop on-going relationships with

customers to keep them current.p

Page 230: Introduction to Interaction Design

Stories from the Field

Connectix for Boeing

Assumption that users wouldAssumption that users wouldprimarily be business travellerswanting to work.wanting to work.

Studies showed primary userwere indeed business travellersbut wanting to RELAX.

Page 231: Introduction to Interaction Design

In Conclusion…

Page 232: Introduction to Interaction Design

7. Resources

Page 233: Introduction to Interaction Design

Books

Interaction Design by Jenny Preece, Yvonne Rogers, and Helen Sharpg pAbout Face 2.0: The Essentials of Interaction Design by Alan Cooper and Robert M Reimann Design by Alan Cooper and Robert M. Reimann Mobile Interaction Design by Matt Jones and Gary Marsden Gary Marsden

Page 234: Introduction to Interaction Design

Resources: More booksDesigning Interactions. Bill Moggridge

The Inmates Are Running the Asylum: Why High-Tech Products Drive Us Crazy and How to Restore the Sanity. Alan Cooper

Interface Culture. Steven Johnson (history of the development of interfaces, well written, more on the ideas)

Th i i ibl C D ld NThe invisible Computer. Donald Norman

Rapid Contextual Design. A How-to Guide to Key Techniques for User-Centered Desi n Karen H lt blattCentered Design. Karen Holtzblatt

Design Research. Brenda Laurel

Page 235: Introduction to Interaction Design

Resources: ConferencesOzCHIOzCHICHI (Computer Human Interaction, ACM)NordiCHI (Nordic CHI, ACM)MobileHCI (focused on mobile interaction/devices, ACM)IDC (Interaction Design and Children, ACM)Interact Interact HCI InternationalDIS (Designing Interactive Systems, ACM) - Design Research, open to

diff t h t d idifferent approaches to designDPPI (Designing Pleasurable Products) - Product Design ConferenceDUX (Designing the User Experience, ACM) - more practicionersCSCW (Computer Supported Cooperative Work)UbiComp

Page 236: Introduction to Interaction Design

Onlinehttp://www.interaction-design.org/ Interaction Design online p g g gencyclopediahttp://www.baddesigns.com/ scrapbook of illustrated examples of things that are hard to useof things that are hard to usehttp://www.ixda.org/en/ Interaction Design Associationhttp://dev.uxmatters.com/ (User Experience Matters - blog and

l )newsletter)http://www.nathan.com/ed/index.html (Nathan Shedroff‘s website on Experience Design)website on Experience Design)Web-Based User Interface Evaluation with Questionnaires, by Gary Perlman http://www.acm.org/~perlman/question.htmlh // bili / US D Of H l h d H S ihttp://usability.gov/ US Dept. Of Health and Human Servicehttp://www.paperprototyping.com/ (adjunct homepage to book on paper prototyping)p p p yp g)

Page 237: Introduction to Interaction Design

InstitutionsD-School - Stanford University (USA)D-School - Stanford University (USA)

http://www.stanford.edu/group/dschool/IIT Institute of Design (USA)

http://www.id.iit.edu/CMU School of Design (USA)

www.design.cmu.edu/ www.design.cmu.edu/ MIT Media Lab (USA)

www.media.mit.eduI i D i I i D A d (I l )Interaction Design Institute + Domus Academy (Italy)

http://www.interaction-ivrea.it/Interaction Design, Royal College of Art (UK)te act o es g , oya Co ege o t (U )

http://www.interaction.rca.ac.uk/University of Queensland (Australia)

htt // it d / id/http://www.itee.uq.edu.au/~id/

Page 238: Introduction to Interaction Design

More Information

• Mark Billinghurst– mark billinghurst@hitlabnz [email protected]

• Website– www.hitlabnz.org