ITIS 6400/8400 Principles of Human Computer Interaction

1. ITIS 6400/8400Principles of Human Computer Interaction Dr. Heather Richter Lipford Heather.Lipford@uncc.edu

2. Agenda • Course Info & Syllabus • Course Overview • Introductions • HCI Overview • IDEO Video • Some history

3. Course Information • Books • Human Computer Interaction, 3rd edition, by Dix, Finlay, Abowd, Beale. (DFAB) • The Design of Everyday Things, by Donald Norman, 2002. (DOET) • Web • http://www.sis.uncc.edu/~richter/classes/2008/6400/index.html • Overview • Grading and Policies • Syllabus and Lectures • Assignments • Wiki: http://hci.sis.uncc.edu:8080/itis6400-spring08/

4. Course Information • Grading for 6400 • 10 points Participation • 10 points Assignments • 50 points Project • More details to come… • 15 points Midterm • 15 points Final

5. Course Information • Grading for 8400 • 10 points Participation • 20 points Assignments • 50 points Project • More details to come… • 15 points Midterm • 15 points Final

6. Assignments • Design critique and advice • Evaluation analysis • 8400: additional topic research and presentation

7. 8400 Assignment • Additional reading on a more focused theory or research topic • Teach or present the topic – 30 minutes in class • At least 20 minutes of presentation • 2 page (or so) summary and study guide posted to the Swiki • See web pages for suggestions

8. Group project • 3-4 people per group, graded as a group • 3 parts: requirements, design, evaluation • Original interface design and evaluation • Each part due by class time on the due date • Project notebook on Swiki with each write up • Theme: The environment and sustainability

9. Course Aims • Consciousness raising • Make you aware of HCI issues • Design critic • Question bad HCI design - of existing or proposed • Learn Design Process • Software interfaces and beyond • Improve your HCI design & evaluation skills • Go forth and do good work! • Introduction to theory and research topics in HCI

10. Course Overview • Requirements Gathering • How do you know what to build? • Human abilities • Design • How do you build the best UI you can? • Evaluation • How do you make sure people can use it? Also cognitive and contextual models, interface paradigms, design guidelines, web and visual design, and advanced topics

11. How to do well • Time and effort • Do the reading and prepare for class • Attend class and participate • Spend time on project • Attention to detail • Communication • Tell me what you learned and why you made decisions

12. Introductions –Dr. Heather Richter Lipford • Ph.D. in C.S. from Georgia Tech in May 2005 • HCI, Ubiquitous Computing, and Software Engineering focus • Contact info: • Email preferred, put 6400 or 8400 in title • Office: 305E Woodward • Office Hours: • Wednesday 5:30-6:30pm, • Thursday 11am-12pm • By appointment

13. TA- Sahiba Dugal • Current Masters student in Computer Science • Computer Engineering undergraduate degree • Office hours – by appointment • Email: sdugal@uncc.edu • Office: 330A Woodward

14. Introductions – Your Turn • Name, student status, specialization • Previous HCI/interface experience? • A product/device/application you • Love to use and why • Hate to use and why

15. Now let’s get started What is Human-Computer Interaction?

16. HCI • The interaction and interface between a human and a computer performing a task • Tasks might be work, play, learning, communicating, etc. etc. • Write a document, calculate monthly budget, learn about places to live in Charlotte, drive home… • …not just desktop computers!

17. Why do we care? • Computers (in one way or another) now affect every person in our society • Tonight - count how many in your home/apt/room • We are surrounded by unusable and ineffective systems! • Its not the user’s fault!! • Product success may depend on ease of use, not necessarily power • You will likely create an interface for someone at some point • Even if its just your personal web page

18. Goals of HCI • Allow users to carry out tasks • Safely • Effectively • Efficiently • Enjoyably

19. Usability • Combination of • Ease of learning • High speed of user task performance • Low user error rate • Subjective user satisfaction • User retention over time

20. Design Evaluation • Both subjective and objective metrics • Some things we can measure • Time to perform a task • Improvement of performance over time • Rate of errors by user • Retention over time • Subjective satisfaction

21. UI Design / Develop Process • User-Centered Design • Analyze user’s goals & tasks • Create design alternatives • Evaluate options • Implement prototype • Test • Refine • IMPLEMENT

22. Know Thy Users! • Physical & cognitive abilities (& special needs) • Personality & culture • Knowledge & skills • Motivation • Two Fatal Mistakes: • Assume all users are alike • Assume all users are like the designer

23. Design is HARD! • “It is easy to make things hard. It is hard to make things easy.” – Al Chapanis, 1982 • Its more difficult than you think • Real world constraints make this even harder

24. Some inspiration: IDEO http://www.ideo.com/

25. A brief history Vannevar Bush, As We May Think, 1945

26. Innovator: Vannevar Bush • Faculty at MIT • Director of Office of Scientific Research & Development • Coordinate WWII effort with 6,000 scientists • “As We May Think” - 1945 Atlantic Monthly • Postulated Memex device • Stores all records/articles/communications • Items retrieved by indexing, keywords, cross references (now called hyperlinks) • (Envisioned as microfilm, not computer) • http://www.theatlantic.com/unbound/flashbks/computer/bushf.htm

27. Paradigms • Predominant theoretical frameworks or scientific world views • e.g., Aristotelian, Newtonian, Einsteinian (relativistic) paradigms in physics • HCI paradigm shifts • Which are true shifts? • What are the future paradigms?

28. The basic timeline… ? WIMP (Windows) User Productivity Command Line Batch ? 1980s - Present 1960s – 1970s 1940s – 1950s Time

29. In the Beginning –Computing in 1945 • Harvard Mark I • Picture from http://piano.dsi.uminho.pt/museuv/indexmark.htm • 55 feet long, 8 feet high, 5 tons Jason Hong / James Landay, UC Berkeley, Picture from http://piano.dsi.uminho.pt/museuv/indexmark.htm

30. Batch processing • Computer had one task, performed sequentially • No “interaction” between operator and computer after starting the run • Punch cards, tapes for input • Serial operations

31. Paradigm: Networks & time-sharing (1960’s)  Command line  teletype • increased accessibility • interactive systems, not jobs • text processing, editing • email, shared file system • Need for HCI in the design of programming languages

32. The Ubiquitous Glass Teletype • 24 x 80 characters • Up to 19,200 bps (Wow - was big stuff!) Source:http://www.columbia.edu/acis/history/vt100.html

33. Innovator: Ivan Sutherland • Technological advance: Video display units • SketchPad - 1963 PhD thesis at MIT • Hierarchy - pictures & subpictures • Constraints • Icons • Copying • Light pen input device • Recursive operations

34. Innovator: Douglas Englebart • Landmark system/demo: • hierarchical hypertext, multimedia, mouse, high-res display, windows, shared files, electronic messaging, groupware, teleconferencing, ... • Invented the mouse http://sloan.stanford.edu/MouseSite/1968Demo.html

35. Paradigm: Personal Computer • Small, powerful machine dedicated to an individual • Importance of networks and time-sharing • Also: • Laser printer (1971, Gary Starkweather) • Ethernet (1973, Bob Metcalfe)

36. Paradigm: WIMP / GUI • Windows, Icons, Menus, Pointers • Graphical User Interface • Multitasking – can do several things simultaneously • Has become the familiar GUI interface • Computer as a “dialogue partner” • Xerox Alto, Star; early Apples

37. PCs with GUIs • Xerox PARC - mid 1970’s • Alto • local processor, bitmap display, mouse • Precursor to modern GUI,windows, menus, scrollbars • LAN - Ethernet

38. Xerox Star - 1981 • First commercial PC designed for “business professionals” • desktop metaphor, pointing, WYSIWYG, high degree of consistency and simplicity • First system based on usability engineering • Paper prototyping and analysis • Usability testing and iterative refinement

39. Xerox Star - 1981 • Commercial flop • $15k cost • closed architecture • lacking key functionality(spreadsheet)

40. Apple Macintosh - 1984 “The computer for the rest of us” • Aggressive pricing - $2500 • Not trailblazer, smart copier • Good interface guidelines • 3rd party applications • High quality graphics and laser printer

41. Paradigm: Hypertext • Think of information not as linear flow but as interconnected nodes • Non-linear browsingstructure • Around since the 1960’s

42. Paradigm: WWW • Two Key Components • URL • Browser • Tim Brenners-Lee did both1991 first text-based browser • Marc Andreesen created Mosaic (first graphic browser, 1993)

43. (Some of the) key technological advances / paradigm shifts • Time-sharing & networks • Video display units • Programming toolkits • Personal computing • Windows • Metaphors • Direct manipulation • Language vs. action (agents) • Hypertext / WWW • Multi-modality • Ubiquitous computing • Sensor-based & context-aware computing

44. (Some of the) key people & events • People • Vannevar Bush • Douglas Engelbart • Ivan Sutherland • J.C.R. Licklider • Alan Kay • Ted Nelson • Mark Weiser • Events • Founding of Xerox PARC • Lisa / Macintosh

45. What Next? • What are the next paradigm shifts? • What are the next technical innovations? • Who knows? • Maybe you do

46. Paradigm?: Mobile Computing • Devices used in a variety of contexts • Laptop, cell phones, PDAs • How do devices communicate? • How to get information to each device when needed? • How to take advantage of context?

47. Paradigm?: VR & 3D Interaction • Create immersion by • Realistic appearance, interaction, behavior • Draw on spatial memory, two-handed interaction

48. Paradigm?: Ubiquitous Computing • Person is an occupant of a computationally-rich environment • Computers with ourselves, on our walls, in our appliances, etc. • How to do the “right” thing for the people in the environment? Can no longer neglect macro-social aspects

49. Course ReCap • To make you notice interfaces, good and bad • You’ll never look at doors the same way again • To help you realize no one gets an interface right on the first try • Yes, even the experts • Design is HARD • To teach you tools and techniques to help you iteratively improve your designs • Because you can eventually get it right

50. Next time • Skim Chapter 4 in DFAB for paradigm info • Design process and project information • Read DFAB 5.1-5.4 and chapter 6 • Come prepared to do project brainstorming