66
Franz Kurfess: User-Centered Design Computer Science Department California Polytechnic State University San Luis Obispo, CA, U.S.A. Franz J. Kurfess User-Centered Design and Development 1 Saturday, March 15, 2008

User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

  • Upload
    others

  • View
    15

  • Download
    0

Embed Size (px)

Citation preview

Page 3: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Franz Kurfess: User-Centered Design

Use and Distribution of these Slides

These slides are primarily intended for the students in classes I teach. In some cases, I only make PDF versions publicly available. If you would like to get a copy of the originals (Apple KeyNote or Microsoft PowerPoint), please contact me via email at [email protected]. I hereby grant permission to use them in educational settings. If you do so, it would be nice to send me an email about it. If you’re considering using them in a commercial environment, please contact me first.

3

3Saturday, March 15, 2008

Page 4: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Copyright Notice

• These slides are a revised version of the originals provided with the book “Interaction Design” by Jennifer Preece, Yvonne Rogers, and Helen Sharp, Wiley, 2002. The original slides are available from www.idbook.com.

• I added some material, made some minor modifications, and created a custom show to select a subset.–Slides added or modified by me are marked with my

initials (FJK) and the year of the most recent modification, unless I forgot it …

FJK 2005

4Saturday, March 15, 2008

Page 6: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Chapter Overview

•Good vs. bad design•Interaction design•Interaction design process•Goals of interaction design•Design and usability practices

FJK 2005

6Saturday, March 15, 2008

Page 7: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Motivation

•More and more products and systems have become highly complex, posing challenges to users.

•As much as possible products should be designed to accommodate their users, not vice versa.

•Computer-based products can be extremely versatile, but their interaction with the user can also be adapted relatively easily.

FJK 2005

7Saturday, March 15, 2008

Page 8: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Objectives

•To become familiar with the main concepts and terms in the area of user-centered design (UCD) and human-computer interaction (HCI).

• To understand the contributing factors to good and poor design.

•To know about important principles for good interaction design.

FJK 2005

8Saturday, March 15, 2008

Page 9: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

What is Interaction Design?

9Saturday, March 15, 2008

Page 10: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

What is interaction design?

•Designing interactive products to support people in their everyday and working lives

–Sharp, Rogers and Preece (2002)

•The design of spaces for human communication and interaction

–Winograd (1997)

10Saturday, March 15, 2008

Page 11: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Goals of interaction design

•Develop usable products–Usability means easy to learn, effective to use and provide an enjoyable experience

•Involve users in the design process

11Saturday, March 15, 2008

Page 12: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Example of bad and good design–Elevator controls and labels on the bottom row all look the same, so it is easy to push a label by mistake instead of a control button

–People do not make same mistake for the labels and buttons on the top row. Why not?

From: www.baddesigns.com

12Saturday, March 15, 2008

Page 13: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Why is this vending machine so bad?

•Need to push button first to activate reader

•Normally insert bill first before making selection

•Contravenes well known convention

From: www.baddesigns.com

13Saturday, March 15, 2008

Page 14: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Understanding users’ needs

–Need to take into account what people are good and bad at

–Consider what might help people in the way they currently do things

–Listen to what people want and get them involved

–Use tried and tested user-based methods

14Saturday, March 15, 2008

Page 15: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Relationship between ID, HCI and other fields

Interdisciplinary fields (e.g HCI, CSCW)

Design practices(e.g. graphic design)

Academicdisciplines(e.g. computer science,psychology)

InteractionDesign

15Saturday, March 15, 2008

Page 16: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Interaction design in business• Increasing number of ID consultancies, examples of well

known ones include:

–Nielsen Norman Group: “help companies enter the age of the consumer, designing human-centered products and services”

–Swim: “provides a wide range of design services, in each case targeted to address the product development needs at hand”

– IDEO: “creates products, services and environments for companies pioneering new ways to provide value to their customers”

16Saturday, March 15, 2008

Page 17: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

What do professionals do in the ID business?

• interaction designers - people involved in the design of all the interactive aspects of a product

• usability engineers - people who focus on evaluating products, using usability methods and principles

• web designers - people who develop and create the visual design of websites, such as layouts

• information architects - people who come up with ideas of how to plan and structure interactive products

• user experience designers - people who do all the above but who may also carry out field studies to inform the design of products

17Saturday, March 15, 2008

Page 18: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

What is involved in the process of interaction design

• Identify needs and establish requirements•Develop alternative designs•Build interactive prototypes that can be

communicated and assessed•Evaluate what is being built throughout the

process

18Saturday, March 15, 2008

Page 19: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Core characteristics of interaction design

•users should be involved through the development of the project

• specific usability and user experience goals need to be identified, clearly documented and agreed at the beginning of the project

• iteration is needed through the core activities

19Saturday, March 15, 2008

Page 20: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Usability goals

•Effective to use•Efficient to use•Safe to use•Have good utility•Easy to learn•Easy to remember how to use

20Saturday, March 15, 2008

Page 21: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

User experience goals

–Satisfying - rewarding–Fun - support creativity–Enjoyable - emotionally fulfilling–Entertaining …and more–Helpful–Motivating–Aesthetically pleasing–Motivating

21Saturday, March 15, 2008

Page 22: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Usability principles (Nielsen 2001)

• Visibility of system status• Match between system and the real world• User control and freedom• Consistency and standards• Help users recognize, diagnose and recover

from errors• Error prevention• Recognition rather than recall• Flexibility and efficiency of use• Aesthetic and minimalist design• Help and documentation

22Saturday, March 15, 2008

Page 24: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

What is Interaction Design?

• It is a process:–a goal-directed problem solving activity informed by intended use, target domain, materials, cost, and feasibility

–a creative activity–a decision-making activity to balance trade-offs

• It is a representation:–a plan for development–a set of alternatives and successive elaborations

24Saturday, March 15, 2008

Page 25: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Four Basic Activities

•Identifying needs and establishing requirements

•Developing alternative designs•Building interactive versions of the designs–prototypes

•Evaluating designs

25Saturday, March 15, 2008

Page 26: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Three Key Characteristics

Three key characteristics permeate these four activities:

1.Focus on users early in the design and evaluation of the artefact

2.Identify, document and agree specific usability and user experience goals

3.Iteration is inevitable. Designers never get it right first time

26Saturday, March 15, 2008

Page 27: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Some Practical Issues

•Who are the users?•What are ‘needs’?•Where do alternatives come from?•How do you choose among alternatives?

27Saturday, March 15, 2008

Page 28: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Who are the Users and Stakeholders?

•Not as obvious as one may think:–those who interact directly with the product

–those who manage direct users–those who receive output from the product

–those who make the purchasing decision –those who use competitor’s products

28Saturday, March 15, 2008

Page 29: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Three Categories of Users

•primary: frequent hands-on•secondary: occasional or via someone else

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

(Eason, 1987)

29Saturday, March 15, 2008

Page 30: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Who are the stakeholders?Check-out operators

CustomersManagers and owners

• Suppliers• Local shop owners

30Saturday, March 15, 2008

Page 31: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

User Needs•Users rarely know what is possible•Users may not know their ‘needs’

–to help them achieve their goals

• Existing tasks:–their context–what information do they require?–who collaborates to achieve the task?–why is the task achieved the way it is?

•Envisioned tasks:–can be rooted in existing behaviour–can be described as future scenarios

31Saturday, March 15, 2008

Page 32: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

User-Centered Approaches

FJK 2005

32Saturday, March 15, 2008

Page 33: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Chapter Overview

•User Involvement•User-Centered Approach•Contextual Design•Participatory Design

FJK 2005

33Saturday, March 15, 2008

Page 34: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Why involve users at all?

•Expectation management –Realistic expectations –No surprises, no disappointments–Timely training–Communication, but no hype

•Ownership –Make the users active stakeholders–More likely to forgive or accept problems–Can make a big difference to acceptance and success of product

34Saturday, March 15, 2008

Page 35: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Degrees of user involvement

•Member of the design team–Full time: constant input, but lose touch with users

–Part time: patchy input, can be stressful–Short term: inconsistent across project life–Long term: consistent, but lose touch with users

•Newsletters, other dissemination devices –Reach wider selection of users–Need communication both ways

•Combination of these approaches

35Saturday, March 15, 2008

Page 36: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

User-centered Approach

•early focus on users and tasks–directly studying cognitive, behavioral, anthropomorphic & attitudinal characteristics

• empirical measurement–users’ reactions and performance to scenarios, manuals, simulations & prototypes are observed, recorded and analysed

• iterative design–when problems are found in user testing, fix them and carry out more tests

36Saturday, March 15, 2008

Page 37: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Early focus on users and tasks

• users’ tasks and goals–driving force behind the development

• users’ behavior and context of use –product is designed to support them

• users’ characteristics – captured & designed for

• users are consulted throughout development, – from earliest phases to the latest– their input is seriously taken into account

• design decisions – taken within the context of the user, their work and

their environment

37Saturday, March 15, 2008

Page 38: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Contextual Design

• developed to handle data collection and analysis from fieldwork for developing a software-based product

• used quite widely commercially• Contextual Design has seven parts:

–Contextual inquiry, –Work modelling, –Consolidation, –Work redesign, –User environment design,–Mock-up and test with customers, –Putting it into practice

38Saturday, March 15, 2008

Page 39: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Contextual Inquiry

•an approach to ethnographic study –user is expert, designer is apprentice

•a form of interview, but–at users’ workplace (workstation)–2 to 3 hours long

39Saturday, March 15, 2008

Page 40: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Main Principles Contextual Inquiry

•Context–see workplace & what happens

•Partnership–user and developer collaborate

• Interpretation–observations interpreted by user and developer together

• Focus–project focus to help understand what to look for

40Saturday, March 15, 2008

Page 41: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Participatory Design

•Scandinavian history•Emphasizes social and organisational aspects

•Based on study, model-building and analysis of new and potential future systems

41Saturday, March 15, 2008

Page 42: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

User Involvement in Participatory Design

•who will represent the user community?–possibly assisted by a facilitator

• shared representations• co-design using simple tools

–e.g. paper, video scenarios

•proposed designs–designers and users communicate about them

•cooperative evaluation–e.g. assessment of prototypes

42Saturday, March 15, 2008

Page 43: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Usability evaluation

43Saturday, March 15, 2008

Page 44: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Usability Evaluation Aims

• Discuss how developers cope with real-world constraints.

• Explain the concepts and terms used to discuss evaluation.

• Examine how different techniques are used at different stages of development.

44Saturday, March 15, 2008

Page 45: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Two main types of evaluation

• Formative evaluation is done at different stages of development to check that the product meets users’ needs.

• Summative evaluation assesses the quality of a finished product.

Our focus is on formative evaluation.

45Saturday, March 15, 2008

Page 46: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

What to evaluate

• Iterative design & evaluation is a continuous process that examines:–Early ideas for conceptual model –Early prototypes of the new system–Later, more complete prototypes

• Designers need to check that they understand users’ requirements.

46Saturday, March 15, 2008

Page 47: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

When to evaluate

• Throughout design–From the first descriptions, sketches etc. of users needs

through to the final product

• Design proceeds through iterative cycles of ‘design-test-redesign’

• Evaluation is a key ingredient for a successful design.

47Saturday, March 15, 2008

Page 48: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

FJK 2005

Evaluation paradigm

• Any kind of evaluation is guided explicitly or implicitly by a set of beliefs– these beliefs are often supported by theory

• The beliefs and the methods associated with them are known as an ‘evaluation paradigm’

48Saturday, March 15, 2008

Page 49: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Four evaluation paradigms

•‘quick and dirty’•usability testing•field studies•predictive evaluation

49Saturday, March 15, 2008

Page 54: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Franz Kurfess: User-Centered Design 54

CSC 484 User Interaction Design

A Gigi Choy, Alex Kleissner, Eric Litak, Frank Vasquez, Brandon Wirick

Cal Poly Knowledge Base

B Matt Killam, Ryan LaBarre, Robert Ly, David Tedjasatyawira

On-Demand Learning Center

C Hoang Bao, Stephanie Cheng,Rachelle Hom, Ronald Mg Senior Project Center

D - -- not used --

E Albert Chang, Shawn Joseph,Christine Le, Takako Nunomura, David Roth

Multimedia Café

F Joe Eder, Michal Fouquette, Chris Johnson, David Kinghorn

WikiPoly

G Matt Cechini, Mark Gabel, Scott Morrison, Shane Niebergall, John O'Donnell

Brainstorming Software

H Ryan Everhart, Paul Goldberg, Meike Muckenhaupt, Rory Strawther

Course Planning Tool

I Ciera Christopher, Edith Koler, Patricia Lin Quiet Area

54Saturday, March 15, 2008

Page 62: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Franz Kurfess: User-Centered Design 62

Crossfire Firefox Plugin❖ “Smart” Search of Blogs

❖ principle also applies to other reasonably well structured document collections

❖ relies on ontologies for the categorization of documents

❖Firefox Already Supports RSS.❖ RSS Feeds as Live Bookmarks.

❖Crossfire Sidebar for RSS Search.❖ Go Button Triggers Web Spider.❖ Displays a List of RSS Items.

❖Context: Current Page or Entire Web❖Blog Editor and Category WatchLists

62Saturday, March 15, 2008

Page 63: User-Centered Design and Developmentcyras/Kurfess/5-User-Centered-Design.pdf · Franz Kurfess: User-Centered Design Use and Distribution of these Slides These slides are primarily

Franz Kurfess: User-Centered Design 63

MP3D❖Planetary model for

navigating large knowledge spaces❖ MP3 collections as example

❖Children objects orbit parent objects

❖Children objects are smaller than parent objects

❖Recursive relationship❖Top level is a cluster of

objects – “galaxy”

63Saturday, March 15, 2008