INTERACTION DESIGNHUMAN-COMPUTER INTERACTIONJMA 464/564MWF 12:00 12:50College Hall 205

JMA 464/545 - InstructorDr. Bill Gibbs Associate Professor in Journalism & Multimedia Arts. Ph.D. in Instructional Systems from The Pennsylvania State University. Office 341 College HallOffice hours Mon., Wed. and Fri. 10:3012:00 and 1:00-2:00 and by appointmentPhone 412 - 396-1310E-mail gibbsw@duq.edu

JMA 464/545 - PurposeCourse about IxD & HCI Overview of IxD, HCI, UxD, and usability

Review IxD, HCI, UxD methods and issues

JMA 464/545 Course goalsDevelop understanding of IxD, human computer-interaction (HCI) and user-centered design & development.

Develop understanding of UxD, user-experience design.

Discuss development processes and tools.

JMA 464/545 Course goalsExplain methods for IxD research & development.

Demonstrate general principles underlying effective interaction design and navigation control.

Use equipment and software to observe interaction.

JMA 464/545 Applications & ToolsThe course focuses on:Interaction/HCIUser observation

JMA 464/545 Applications & Tools In class we use a variety of tools to prototype interactions.

JMA 464/545 Applications & ToolsFor observations, we will use: Observer XT Arrington Research Eye-tracker TechSmith Morae Human Factors Facility

BEGIN TO OBSERVE EVERYDAY THINGShow might you improve them?

What might happen?

What might happen?Pull hood latch

Proximity

What might happen?

What might happen?

Is the coffee maker on or off?

How do you fix it?

Returns Web-wide results, which confuses users

CNN now implements search in this way.

Mapping. Good or Bad?

ABCD

Is this a better design?

Mapping example digital interfaceYouve been asked to develop App that controls electrical outlets in a home or building.Could organize like this- Menu drivenCould organize spatially direct relationship between outlet location and interface

Mapping direct relationship between the device design and how it functions.

Poor designs?Which bottle ?- Insulin

Not sure what these mean? Cadillac carWhat do you think happens?Source: http://www.baddesigns.com/

People often take the path of least resistance.

Try to figure out what the least resistant paths are before pouring concrete. Source: http://www.baddesigns.com/

People often take the path of least resistance. In a similar way, Amazon makes it easy to buy additional items.

Physical constraint

Physical constraintWhat happens here?Source: http://www.baddesigns.com/

Physical constraint not visibleWhat happens here?Source: http://www.baddesigns.com/

Logical constraint

Task: Return movie (DVD) to RedboxI think similar toConceptual model

Task: Return movie (DVD) to RedboxOk, drop it in but

Task: Return movie (DVD) to RedboxMust press Return A DVD firstWhat might be a better approach?

Task: Return movie (DVD) to RedboxWhy not a physical constraint instead of this? Return a DVD is activated when inserting DVD.

What might happen here?Source: http://goodexperience.com/tib/b/product_design/

Labels???If the switch is pointing to "Off", it's really "On", and vice versa. Source: http://goodexperience.com/tib/b/product_design/

Labels???The arrows relate to direction or how to use switch, not the final state of the switch.

The words ON/OFF suggest the final state but they are positioned inversely to switch function.Source: http://goodexperience.com/tib/b/product_design/

Labels???A simpler design is better.

The switch affords/suggests how to use it.

Additional labels may add confusing information.

How do we design for different devices?By looking at examples in the physical world, we can become informed about how to design for:WebMobile devicesEtc.

Were use to this

What about this

What about this

What do these controls mean?And the controls

Design and use | QuestionsHow do people use different devices?What can observing their use tell us about how we should design and develop?How do different devices influence behavior?

Design and use | QuestionsHow do we design for the initial User Experience (UX)?How do we design for the entire User Experience (UX)?

Observe human-computer interactions

Example 1: ObserverExample 2: ObserverExample 3: MoraeExample 5: EyeTrackExample 4:PostExample 6: CNN - EyeTrackExample 7: Student EyeTracks

Example 8: ViewPoint Analysis

JMA 464/545 ReadingsInteraction Design: Beyond Human Computer Interaction by Rogers, Sharp, and Preece. Publisher: John Wiley & Sons; 3rd Edition (2011) ISBN 978-0-470-66576-3

Additional readings will be assigned throughout the semester and will include: Journals articles Web articles Book chapters

JMA 464/545 - AssignmentsPractice assignmentsInteraction design activitiesGroup critique & re-design of deviceProficiency tasks: Eye-tracking, Morae, Observer XT (Fisheye)Mini-application design, implementation, evaluationExamIxD Investigation (Graduate students only)

JMA 464/545 E-mailingE-mailing assignments/attachments. Must have your name E-mail address Title of assignment Label subject of e-mail

JMA 464/545 Class web site: http://www.jma.duq.edu/classes/gibbs/jma464-01/ Media site Rooms 205 & 345 Access

JMA 464/545 Before you goLog into computer

User Name and PasswordTo connect to our servers from within either of our two labs (205 or 345):Ctrl-Alt-DeleteUsername: Dori usernamePW: Dori password

User Name and PasswordLabs (205, 345) - login with your DORI username and password (i.e. the email part, up to the @ symbol).

If you don't know your password, need to go to the computer help desk in the union.

OR simply go to the "forgot your password" screen on DORI from any logged-in computer. (Here's the link:https://apps.duq.edu/webapps/multipass/).

*