HCI PARADIGMS AND USER CENTERED DESIGNUSER CENTERED DESIGNDr. Yan LiuDepartment of Biomedical, Industrial and Human Factors EngineeringWright State UniversityIntroduction Why Study Paradigms Concerns in design of an interactive system How can the interactive system be developed to ensure its usability? How can the usability of the interactive system be demonstrated or measured? Past successful interactive system design provides good paradigms for the development of future productsWe can build interactive systems that are more usable than those built in the past2We can build interactive systems that are more usable than those built in the past There is considerable room for improvement in designing more usable systems in the future The 15 paradigms discussed here represent principal historical advances in interactive designsOur ignorance of history causes us to slander our own timesOur ignorance of history causes us to slander our own timesOur ignorance of history causes us to slander our own timesOur ignorance of history causes us to slander our own times~ Gustave FlaubertBatch-Mode Processing 1950s – 1960s Computers first appeared onto the commercial scene Often run in “batch-mode” Jobs were submitted on punched cards or paper tape to a computer operator who would then run them individually on the computerDifficult to use, cumbersome, and unpredictable3Difficult to use, cumbersome, and unpredictableTime-Sharing Systems Appeared in 1960s e.g. IBM 360, SDS 940, PDP-10 Sharing computing resource among many users Schedule which task may be the one running at any given time via user interrupt Earliest systems that supported truly interactive exchange between operators and computers4operators and computersVideo Display Units (VDU) Originated at the mid- 1950s First developed in military applications Sketchpad Program (Ivan Sutherland, 1962) First realized the capabilities of visual images Allowed a computer operator to use the computer to create, very rapidly, sophisticated visual models on a display screen that resembled a television set5sophisticated visual models on a display screen that resembled a television set Computers could be used to extend the user’s ability by visualizing and manipulating different representations of the same information The importance of a creative mind, coupled with a dogged determination to see the idea through, to the entire history of computingControl the size and potion of the total picture seen on the display 6Sketchpad in Usedisplay Control the drawing functionhttp://www.youtube.com/watch?v=mOZqRJzE8xgProgramming Toolkits Douglas Engelbart’s Augmenting Human Intellect, 1962  The secret to producing computing equipment that aids human problem-solving ability is providing the right toolkit Engelbart and his team developed the set of programming tools they would require in order to build more complex interactive systems (“bootstrapping”)7(“bootstrapping”) Small, well-understood components can be composed to create larger tools Once the larger tools become understood, they can continue to be composed with other tools, and so onPersonal Computing Emergence of computing power aimed at masses in 1970s  LOGO A graphics programming language for children Developed by Seymour Papert and his colleagues at MIT and elsewhere A computer-controlled mechanical turtle that drags a pen along a surface to trace its pathChildren can easily direct the turtle to trace out simple geometric shapes and 8Children can easily direct the turtle to trace out simple geometric shapes and teach the turtle to draw more complicated figures A valuable maxim for interactive system development – a system is more powerful if it is easier to use Alan Kay had a vision of computing dedicated to single users (personal computer)Window Systems and WIMP interface Window A visual area (usually rectangular), containing a user interface which displays output of and allows input for one of several simultaneously running computer processes Enable a single user to be engaged in multiple tasks which are separated physically in one computer screenUsually associated with graphic displays where they can be manipulated with a 9Usually associated with graphic displays where they can be manipulated with a pointing device WIMP “Window, Icon, Menu, Pointing device", denoting a style of interaction using these elements Developed at Xerox PARC in 1973 and appeared in the commercial marketplace in 1981The Metaphor Why Metaphor? Valuable for increasing the usability of a computer application Used to describe the functionality of many interaction widgets (e.g. windows, menus, buttons, and color palette) Xerox Alto Developed at Xerox PARC in 1973, was the first computer to use desktop metaphors and graphical user interface10metaphors and graphical user interface Issues Some of the tasks we perform with a computer do not have real-world equivalents or a single metaphor cannot account for all of them e.g. There is no office equivalent for ejecting a floppy disk, and it is not intuitive to drag the icon of a floppy disk to the wastebasket metaphor in order to eject from the system Interpretation of a metaphor can be affected by culture e.g. Things thrown into a trashcan are recoverable in some countries, but they are gone for good in other countriesDirect Manipulation What is Direct Manipulation? A term coined to describe the appeal of graphics-based interactive systems (Ben Shneiderman, 1982)  Important Features Visibility of the objects of interest e.g. Documents and folders are made visible to the user as icons which represent the underlying files and directories, respectively11underlying files and directories, respectively Incremental action at the interface with rapid feedback on all actions e.g. The operation of moving a file from one directory to another is mirrored as an action on the visible document which is “picked up and dragged” along the desktop from one folder to another  Reversibility of all actions, so that users are encouraged to explore without severe penalties e.g. If the user moves a document to a wrong place, it is relatively easy to detect and recover from the errorDirect Manipulation Important Features (Cont’d) Syntactic correctness of all actions, so