1. History & Paradigms Where have we come from? Where are we going?

2. Why study HCI’s history? Understanding where you’ve come - repeat positive lessons “Those who don’t know history are doomed to repeat it” - avoid negative lessons Appreciation and knowledge of evolution of interaction

3. Howard Rheingold – Tools for Thought History of interactive breakthroughs On-line at http://www.rheingold.com/texts/tft/ http://www.rheingold.com/texts/tft/ One of several good sources

4. 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?

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

6. (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

7. (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

8. 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/m useuv/indexmark.htm

9. 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

10. Innovator: J.C.R. Licklider 1960 - Postulated “man- computer symbiosis” Couple human brains and computing machines tightly to revolutionize information handling 1968 – “The Computer as a Communication Device”

11. 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

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

13. Innovator: Ivan Sutherland Technological advance: Video display units Start of Direct Manipulation SketchPad - 1963 PhD thesis at MIT Hierarchy - pictures & subpictures Master picture with instances (i.e., OOP) Constraints Icons Copying Light pen input device Recursive operations

14. Innovator: Douglas Englebart Landmark system/demo: hierarchical hypertext, multimedia, mouse, high-res display, windows, shared files, electronic messaging, CSCW, teleconferencing,... Invented the mouse All this took place before Unix and C (1970s) ARPAnet (1969) & later Internet http://sloan.stanford.edu/MouseSite/1968Demo.html

15. The dawn of the desktop – Xerox PARC Established 1970 Bob Taylor heads CSL - Computer Systems Lab 1971 Laser printer (Gary Starkweather) 1973 Ethernet (Bob Metcalfe) Alto personal computer (Chuck Thacker)

16. Paradigm: Personal Computer System is more powerful if it’s easier to use Small, powerful machine dedicated to individual Importance of networks and time- sharing Kay’s Dynabook, IBM PC

17. Personal Computers 1974 IBM 5100 1981 Databaster 1981 IBM XT/AT Text and command-based Sold lots Performed lots of tasks the general public wanted done A good basic toolkit 1978 VisiCalc

18. 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

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

20. 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

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

22. Apple Lisa - 1982 Based on ideas of Star More personal rather than office tool Still $$$ - $10K to $12K Failure

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

24. Paradigm: Metaphors LOGO’s turtle Office desktop Mapping new interactions to existing, familiar concepts Others?

25. Paradigm: Direct Manipulation ‘82 Shneiderman describes appeal of rapidly-developing graphically-based interaction object visibility incremental action and rapid feedback reversibility encourages exploration replace language with action syntactic correctness of all actions WYSIWYG, Apple Mac

26. Paradigm: Hypertext Think of information not as linear flow but as interconnected nodes Bush’s MEMEX & Nelson’s hypertext Non-linear browsing structure Hypermedia WWW in ’93 was the real launch

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

28. Paradigm/Technology – Person-to-Person Communications Enabled by several technologies Ethernet and TCP/IP protocol Personal computer Telephone network and modems And by killer-app software Email, Instant Messaging, Chat, Bulletin Boards CSCW - conferencing, shared white boards Not quite yet a killer-app Micro-sociological phenomenon are central to successes (and failures)

29. The WIMP Plateau Time User Productivity Batch Command Line WIMP (Windows) 1940s – 1950s 1980s - Present 1960s – 1970s ? ?

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

31. Paradigm: Multi-modality Mode is a human communication channel Not just the senses e.g. speech and non-speech audio are two modes Emphasis on simultaneous use of multiple channels for I/O

32. Paradigm: VR & 3D Interaction Create immersion by Realistic appearance, interaction, behavior Draw on spatial memory, proprioception, kinesthesis, two- handed interaction

33. Innovator: Mark Weiser Introduced notion of Ubiquitous Computing and Calm Technology It’s everywhere, but recedes quietly into background Was CTO of Xerox PARC

34. 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

35. 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?

36. Paradigm: Mobile Computing Devices such as PDAs, Cell Phones, GPSs, etc.. Used in a variety of contexts. Wireless communication between devices and environment How to get information to each device when needed? How to take advantage of context?

37. Paradigm?: Sensor-based and context computing Commanding a system  implicit interaction Data used to make inferences about a situation Controversial & still problematic

38. 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

39. Memex Picture from http://www.dynamicdiagrams.com/design/memex/model.htm#download

40. As We May Think Futuristic inventions / trends Wearable cameras for photographic records

41. As We May Think Automatic transcripts of speech

42. As We May Think Not so much predicting future as "inventing it" by publishing article hypertext wearable memory aid Use technology to augment human intellectual abilities New kinds of technology lead to new kinds of human/machine & human/human interaction Be aware that science/engineering can impact society

43. As We May Think Other visions Encyclopedia Brittanica for 5 cents Direct capture of nerve impulses Some have come true Increased specialization Flood of information Faster / Cheaper / Smaller / More reliable Some he missed or we are still waiting Microphotography? Memex?

44. Fulfilling the vision? ACM Multimedia, 2002

45. Augmenting Human Intellect So what did we just see? In terms of devices, interactions, and apps

46. Switching gears… 10 minute break! Use this time to meet each other and start to form groups.

47. Project Structure Group project – 4 or 5 people Design and evaluate an interface 0 - Team formation & topic choice 1 - Understand the problem 2 - Design alternatives 3 - Prototype & evaluation plan 4 - Evaluation

48. Project topics Group-oriented picture frame http://hci.sis.uncc.edu:8080/richter/12 Microsoft Interface Design Imagine Cup http://thespoke.net/ViewContent.aspx?PostID=807760 Problem of your choice

49. Programming requirements Leverage team expertise Full functionality is NOT intention But good evaluation requires authentic experience

50. Project Details Part 0 - Topic definition – Due Jan 26 Identify team & topic, create web notebook IRB certification Part 1 - Understanding the problem – Due Feb 16 Describe tasks, users, environment, social context Any existing systems in place

51. Project Details Part 2 - Design alternatives – Due March 16 Storyboards, mock-ups for multiple different designs Explain decisions Poster session in class on March 2 Part 3 - System prototype & eval plan - Due April 6 Semi-working interface functionality - enough to evaluate Plan for conducting evaluation Demo prototype

52. Project Details Part 4 – Evaluation – Due April 27 Conduct evaluation with example users Characterize pros and cons of the UI Fix the easy to fix UI problems Present results to class on April 27

53. Project Presentations Informal poster session Feedback on ideas March 2 Other students and “expert” gallery Formal project presentation Final class 20 minute summary of entire project

54. Project Groups 4 people You decide Diverse is best! Consider schedules Cool name

55. Project themes: Think Think of someone else Avoid being biased by your intuitions Think off the desktop! Mobile, handheld, environmental Think everyday Home Think about people first, then technology

56. What Makes a Good Project Access to domain experts & users “Real” clients Interesting human issues Rich domain for design

57. Some ideas in the home Home security Social communication Everyday, reunions Sharing Family memories Especially digital video and photos Supporting everyday activities Reminders, finding lost objects, time management/scheduling Entertainment for all ages Support for informal caregivers

58. Your turn Brainstorm ideas for your group Choose a couple and elaborate Pause to share ideas with everyone…

59. For next time… Read about project parts, get started early! PhD students – think about your assignment topic Due: Part 0 – name your group, create your web page on the Swiki Read DFAB 5, 6