cs 615 user interface design - overview

28
CS 615 User Interface Design - Overview 1 Gabriel Spitz Lecture # 1

Upload: strom

Post on 15-Feb-2016

51 views

Category:

Documents


0 download

DESCRIPTION

CS 615 User Interface Design - Overview. Lecture # 1. Lecture Objectives. Instructor Course objectives Course outline. Before we start. Please send me an email to [email protected] Include your personal information Your name (First name, last name) Student ID - PowerPoint PPT Presentation

TRANSCRIPT

Page 1: CS 615 User Interface  Design - Overview

1Gabriel Spitz

CS 615 User Interface Design - Overview

Lecture # 1

Page 2: CS 615 User Interface  Design - Overview

Gabriel Spitz 2

Lecture Objectives

• Instructor• Course objectives• Course outline

Page 3: CS 615 User Interface  Design - Overview

Gabriel Spitz 3

Before we start

• Please send me an email to [email protected]• Include your personal information

o Your name (First name, last name)o Student IDo Email address that you could be reached before class for class cancelation

informationo If you prefer add a phone number for text message

Page 4: CS 615 User Interface  Design - Overview

Gabriel Spitz 4

Who Am I

• Gabriel Spitz• BA, Psychology, NYU• MSIE, SUNY Buffalo• Sc.D, Behavioral Sciences, Technion, Israel• Principal Human Factors @ Akamai, Inc

o UX Design, Customer Experience, Research, • Previously, LiveData, Aptima, Wang, BBN, MITRE• I am Human Factors Engineer & User Interface

Designer (UX)

Page 5: CS 615 User Interface  Design - Overview

Gabriel Spitz 5

Contact Information

• Emailo [email protected]

• Phoneo 781-572-7695

• Office hourso By appointmento If needed M W 7:45-8:15 pm in class

• Lectures’ Websiteo http://www.blackgecko.com/gspitz/CS615/

Page 6: CS 615 User Interface  Design - Overview

Gabriel Spitz 6

Frequently Used Names

• Human Factors Engineer• Interface Designer• Interaction Designer/Engineer• Graphical Designer• Usability Engineer• Information Architect• Technical Writer• More…

Page 7: CS 615 User Interface  Design - Overview

Gabriel Spitz 7

Course Objectives – Understand (1/3)

• Course objectives are to:o Understando Practiceo Create

• Understand the goals and criteria of a good user-interface (UI)

• Understand the UI design process• Become familiar with issues in UI design• Become familiar with the underlying drivers

of UI design

Page 8: CS 615 User Interface  Design - Overview

Gabriel Spitz 8

Course Objective – Practice (2/3)

• Learn and practiceo Performing user and task analysiso Designing UI using user centered approach o Evaluating user interface

Page 9: CS 615 User Interface  Design - Overview

Gabriel Spitz 9

Course Objective – Create (3/3)

• Gain experience with real-world skillso Create user and stakeholders’ personaso Evaluate everyday interfaceso Create reports and presentation

• No implementationo You learn that in other courses

Page 10: CS 615 User Interface  Design - Overview

Gabriel Spitz 10

Course Outline (1/3)

• Establishing Objectives• Approaching the Design• Designing• Evaluation

• Establishing Objectiveso What is UI and why worry about ito Goal of UI design & how to evaluate it

Page 11: CS 615 User Interface  Design - Overview

Gabriel Spitz 11

Course Outline (2/3)

• Approaching the Designo Action Model - Normano UI design Processo Understanding needso Getting ready for designo Persona & Scenarioo Task Analysis

Page 12: CS 615 User Interface  Design - Overview

Gabriel Spitz 12

Course Outline (3/3)

• Designingo User Experience Modelo Scopeo Conceptual Modelo Activity flowo Representationo Presentation

• Evaluationo Evaluation

Page 13: CS 615 User Interface  Design - Overview

Gabriel Spitz 13

Why Take This Course?

• A very important areao Proliferation of technologyo Greater diversity of userso Ubiquity of computing

• User-Centered Design (UCD) is more important than evero New technology does not make UCD irrelevant it just raises new issues

Page 14: CS 615 User Interface  Design - Overview

Gabriel Spitz 14

Why Take This Course?

• Software is everywhere• More individuals use software to do their work• Individuals use software for longer and longer

portions of their day• User Interface therefore impacts individuals:

o Moodo Productivityo Safety

Page 15: CS 615 User Interface  Design - Overview

Gabriel Spitz 15

My Design Objectives – Beyond Usability

• Create a positive and rewarding user experience when using technology

• Design technology with users’ work activity in mind

• focus on designs that will enable individuals to be:o Productive - Do the work they need to do and beyondo Efficient – Do it in a way that will save them time and efforto Effective – Do it with minimal or no errorso Safe – Do it with no harmo Happy -

Page 16: CS 615 User Interface  Design - Overview

Gabriel Spitz 16

Task vs. Activity Centered Design

User Task – Get a Boarding Passfor my flight

User Activity – Get home fast andcomfortablyIs there an earlierflightIs there a better seatCheck in luggageGet a Boarding Passfor my flight

Page 17: CS 615 User Interface  Design - Overview

Gabriel Spitz 17

Task vs. Activity Centered Design

User Task – Register as a member

User Activity – Get membershipcardRegisterObtain card

Page 18: CS 615 User Interface  Design - Overview

Gabriel Spitz 18

Types of Projects Performed by UX (Me)

• Device interface designo Stylus design - (comfort)o Head mounted cursor control device - (easy target acquisition)

• Software user-interface designo Cable Modem Management system - (fast exploration of problem

space)o UI for Automatic Target Identification System – (accurate decision) o Communication logging application – (rapid data entry)

• Macro-Ergonomic analysiso Work analysis of Customer Care Engineers– (work efficiency)

Page 19: CS 615 User Interface  Design - Overview

Gabriel Spitz 19

Some Unique Work Examples

• Tool to Automatically Classify Usability Problem Reports

• Evaluation of Runway Status Lights• Common display for OR clinical teams• Surgical Safety Check Management tool• Surgical AV Control Panel• Tool to analyze the wellness of video-streaming• Many more…

Page 20: CS 615 User Interface  Design - Overview

Gabriel Spitz 20

Whiteboards in the Operating Room - Team

Display

• White boards are used to remind the surgical team of important information

Key to effective UI – Optimal Info. & logical layout

Page 21: CS 615 User Interface  Design - Overview

Gabriel Spitz 21

I solation status of the patient

General context of the case

General information about the patient

Progress Logof what has been done so far

Staff members participating in this case

Critical I nfo & Allergies of this patient

Daily schedule of the current OR

Planned procedures for this case

Workflow tabs and relevant case stage info.

OR-Dashboard

Page 22: CS 615 User Interface  Design - Overview

Gabriel Spitz 22

Common Surgical Time Out Form• Surgical Time Out

o A verification procedure aimed at ensuring awareness

• Issueso Focus on topic not datao Does not facilitate team

awarenesso Is not conducive to detecting

and/or reporting errors

Key to effective UI – Encourage optimal behavior

Page 23: CS 615 User Interface  Design - Overview

Gabriel Spitz 23

Surgical Safety Check Management Tool

Challenge

Cross Checked

Information

Challenge Category

Checklist Topics

Option Selector

Checklist Panel

Page 24: CS 615 User Interface  Design - Overview

Gabriel Spitz 24

Surgical AV Control Panel

Key to effective UI – Optimal layout

Page 25: CS 615 User Interface  Design - Overview

Gabriel Spitz 25

If the user can’t use it

… it doesn’t work

- Susan Dray

Course Motto

Page 26: CS 615 User Interface  Design - Overview

Gabriel Spitz 26

Course Requirements

• Two interface evaluation projects (30%)o Device or software interface evaluation – End of Feb. 2011o Website interface evaluation – Beginning of March

• A Group project - interface design project –Mid May(40%)

• A short midterm (20%)• Class attendance and participation (10%)

Page 27: CS 615 User Interface  Design - Overview

Gabriel Spitz 27

• Course book• Recommended

o Garett, J, J., 2003, The Elements of User Experience, User Centered Design for the Web, New Riders publication(Paperback)

o Norman, D.A., 1989, The Design Of Everyday Things. New York, NY, Doubleday 1989

• Web siteo http://www.blackgecko.com/gspitz/CS615/

Course Books

Page 28: CS 615 User Interface  Design - Overview

Gabriel Spitz 28

Homework

• Visit http://web.mit.edu/outreach/ and check out their MIT Outreach Database

• Pretend that you are a typical user of this site and you are trying to find a specific program

• Identify 5-8 issues with this site that if corrected will improve the use of the site