Prelims_HCIN311.pdf

HCIN311 Prelims | BSIT 3-Y1-3 Dacuso, Pinky Guerrero What is Human Computer Interaction Principles of HCI (Usability) Why do we need to understand (HCI) Humans? -...

HCIN311 Prelims | BSIT 3-Y1-3 Dacuso, Pinky Guerrero What is Human Computer Interaction Principles of HCI (Usability) Why do we need to understand (HCI) Humans? - Is characterized as a dialogue or Useful: accomplish what is required - Humans are limited in their capacity to interchange between the human (functional, does things) process information. and the computer. - This has important implications for - Is the study of interaction between Usable: do it easily and naturally without design. people (users) and computers. error. (does the right things) - Interacting with technology is - Is concerned with the design, cognitive. evaluation and implementation of Used: make people want to use it. (be - Human information processing is interactive computing systems. attractive, acceptable to organizations.) referred to as cognition. - Is an interdisciplinary field in which computer scientists, engineers, The Human Input-Output Channels psychologists, social scientists and - A person’s interaction with the outside design professionals play important world occurs through information Human Vision roles. being received and sent. Is a highly complex activity with a range of - In an interaction with a computer the physical and perceptual limitations. 3 Components of HCI user receives information that is output It is the primary source of information for - Human (Analog I/O) by the computer, and responds by the average person. - Computer (Interface) providing input to the computer—the - Interaction (Digital I/O) user’s output becomes the Hearing Is often considered secondary to sight, computer’s input and vice versa. GOAL: is to improve the interaction but we tend to underestimate the amount between users and computers by making of information that we receive through our Model Human Processor computers more user friendly and - Card, Moran, and Newell (1983), ears. receptive to the user’s needs. described the Model Human Processor (MHP). Touch or Haptic Perception Although this sense is often viewed as - A simplified view of the human less important than sight or hearing, processing involved in interaction with imagine life without it. computer systems. S.N.L.A. | 1  Motor Control Human Memory Long-term Memory How the way we move affects our Memory refers to the processes that are - If short-term memory is our working interaction with computers. used to acquire, store, retain, and later memory or ‘scratch-pad’, long-term retrieve information. memory is our main resource. The Ponzo Illusion - Here we store factual information, - The Ponzo illusion is an optical illusion Information is stored in memory experiential knowledge, procedural that was first demonstrated by the rules of behavior –in fact, everything Italian psychologist Mario Ponzo Sensory Memory that we ‘know’. (1882-1960) in 1913. - The sensory memories act as buffers - Unlike working memory there is little - He suggested that the human mind for stimuli received through the senses. decay: long-term recall after minutes is judges an object's size based on its - A sensory memory exists for each the same as that after hours or days. background. sensory channel: iconic memory for - He showed this by drawing two visual stimuli, echoic memory for Input Device identical lines across a pair of aural stimuli and haptic memory for - Input devices are the hardware devices converging lines, similar to railway touch. which take information from the user tracks. - These memories are constantly of the computer system, convert it into overwritten by new information electrical signals and transmit it to the The Muller-Lyer Illusion coming in on these channels. processor. - is a well-known optical illusion in which two lines of the same length appear Short-term (Working) Memory Output Device to be of different lengths. - Short-term memory or working - It is used to present information to the - The illusion was first created by a memory acts as a ‘scratch-pad’ for user from a computer. German psychologist named Franz temporary recall of information. It is - Output devices take data from the Carl Muller-Lyer in 1889. used to store information which is only computer system and convert it to a - Muller-Lyer illusion is that our brains required freely. form that can be read by humans. perceive the depths of the two shafts - Short-term memory can be accessed based upon depth cues. rapidly, in the order of 70 ms. However, Computer Memory - When the fins are pointing in toward it also decays rapidly, meaning that Computer memory is a generic term for all the shaft of the line, we perceive it as information can only be held there of the different types of data storage sloping away much like the corner of a temporarily, in the order of 200 ms. technology that a computer may use, building. including RAM, ROM, and flash memory. - S.N.L.A. | 2  Menu Interface Short Term Memory Optical Drive - Set of options displayed on the screen - is a storage device that uses lasers to - less recall - easier to use Random Access Memory (RAM) read data on the optical media. - rely on recognition so names should be - Random Access Memory is your meaningful system's short-term data storage; it Read Only Memory: pre-recorded - Selection by: numbers, letters, arrow stores the information your computer Recordable: recorded once keys, mouse combination is actively using so that it can be Rewritable: recorded, erased, and - Often (frequent) options hierarchically accessed quickly. recorded. grouped - The more programs your system is - Restricted form of full WIMP system running, the more memory you'll need. The Interaction - Interaction models help us to Natural Language Long Term Memory understand what is going on in the - Familiar to user interaction between user and system. - Speech recognition or typed natural Read-Only Memory (ROM) - They address the translation between language - It refers to computer memory chips what the user wants and what the - Problems: vague · ambiguous · hard to containing permanent or system does. do well. semi-permanent data. - Solutions: try to understand a subset, - Used to store the start-up instructions Types of User Interfaces pick on keywords for a computer, also known as the firmware. Command Line Interface (CLI) Query Interface - ROM is non-volatile; even after you - Expressing instructions to the turn off your computer, the contents of computer directly. - Question/answer interfaces ROM will remain. ROM is mostly used - Use function keys, single characters, - the user led through interaction for firmware updates. short abbreviations, whole words, or a via a series of questions. combination. - suitable for novice users but Hard Disk Drive (HDD) - Suitable for repetitive tasks. restricted functionality. - Hard disk drive is a magnetic storage - Better for expert users than novices. - often used in information systems. device that is installed inside the - Offers direct access to system computer functionality. - Query languages (e.g. SQL) - Command abbreviations should be - used to retrieve information from Solid-State Drive (SSD) meaningful. a database. - Uses integrated circuit assemblies to - requires understanding of store data persistently, typically using database structure and language. flash memory, - syntax, hence requires some expertise. S.N.L.A. | 3  Point and Click Interface Understanding Users’ Needs Form-Fills Interface - Used in: - Need to take into account what people - Primarily for data entry or data - Multimedia, web browsers and are good and bad at. retrieval. hypertext - Consider what might help people in - Screen like paper form. - Minimal typing the way they currently do things - Data put in relevant places. - Use in ATM’s - Listen to what people want and get - Requires: good design, obvious them involved correction facilities. Three Dimensional Interfaces - Use tried and tested user-based - Virtual reality methods Spreadsheets Interface - ‘ordinary’ window systems - First spreadsheet VISICALC, followed - highlighting visual What is Interaction Design by Lotus 1-2-3. - 3D workspaces - Designing interactive products to - MS Excel is most common today. - use for extra virtual space support people in their everyday and - Sophisticated variation of form-filling. - light and occlusion give depth working lives. (Sharp, Rogers and - grid of cells contain a value or a - distance effects Preece (2002)) formula - The design of spaces for human - formulas can involve values of What is Design communication and interaction. other cells (e.g. sum of all cells in - Generally speaking, it is the process of (Winograd (1997)) this column) envisioning and planning the creation - Interaction design is about creating - user can enter and alter data of objects, interactive systems, interventions in often complex - spreadsheet maintains buildings, vehicles, etc. situations using technology of many consistency - It is user-centered, users are at the kinds including PC software, the web heart of the design thinking approach. and physical devices. WIMP Interface - Windows, Icon, Mice, and Pointer What to Design Goals of Interaction Design - or windows, icons, mice, and pull-down - Usable menus! Need to take into account: - Easy to learn - default style for majority of interactive - Who are the users? - Effective computer - What activities are being carried out? - Enjoyable Experience - systems, especially PCs and desktop - Where is the interaction taking place? - Involved User machines Need to optimize the interactions users have with a product - Match the users activities and needs. - S.N.L.A. | 4  Interaction Design in Business USABILITY ENGINEERS Usability Goals People who focus on evaluating products, - Effective to use NIELSEN NORMAN GROUP using usability methods and principles. - Efficient to use - The Nielsen Norman Group is an - Safe to use American computer user interface and WEB DESIGNERS - Have good utility user experience consulting firm. People who develop and create the visual - Easy to learn - Founded in 1998 by Jakob Nielsen design of websites, such as layouts. - Easy to use and Don Norman. - “help companies enter the age of the INFORMATION ARCHITECTS User Experience Goals consumer, designing human-centered people who come up with ideas of how to - Satisfying products and services”. plan and structure interactive products. - Fun USER EXPERIENCE DESIGNERS - Enjoyable SWIM INTERACTIONS people who do all the above but who may - Entertaining - Swim is a San Francisco-based design also carry out field studies to inform the - Helpful consultancy. design of products. - Motivating - Founded by Gitta Salomon in 1996. - Aesthetically pleasing - “provides a wide range of design What is involved in the process of services, in each case targeted to interaction design? Design Principles address the product development - Identify needs and establish - Generalizable concepts for thinking needs at hand”. requirements. about different features of design. - Develop alternative designs. - The do’s and don’ts of interaction IDEO-DESIGN COMPANY - Build interactive prototypes that can design. - IDEO is a design and consulting firm be communicated and assessed. - What to provide and what not to with offices in the U.S., England, - Evaluate what is being built provide at the interface. Germany, Japan, and China. throughout the process. - Derived from a mix of theory-based - It was founded in Palo Alto, knowledge, experience and California, in 1991. Core Characteristics of Interaction common-sense. - The company uses the design thinking Design - Users should be involved through the Important Interaction Design Principles approach to design products, services, development of the project. environments, and digital experiences. - Specific usability and user experience Visibility goals need to be identified, clearly - Make relevant parts visible. What do professionals do in the ID documented and agreed at the - Make what has to be done obvious. business? beginning of the project. INTERACTION DESIGNERS - Iteration is needed through the core People involved in the design of all the activities. interactive aspects of a product. S.N.L.A. | 5  Feedback Affordances External Consistency - Sending information back to the user - Refers to an attribute of an object that - refers to designing operations, about what has been done allows people to know how to use it. interfaces, etc., to be the same across - Includes sound, highlighting, - Norman (1988) used the term to applications and devices. animation and combinations of these discuss the design of everyday objects. - Very rarely the case, based on different - Since has been much popularized in designer’s preference Constraints interaction design to discuss how to - External consistency means having the - Restricting the possible actions that design interface objects. same aesthetic design or performance can be performed across multiple systems. - Helps prevent user from selecting Mapping incorrect options - Relationship between controls and Assumption - Three main types (Norman, 1999) their movements and the results in the - An assumption is something that you world assume to be the case, even without Physical Constraints proof. - Refer to the way physical objects Consistency - Taking something for granted when it restrict the movement of things. - Design interfaces to have similar needs further investigation. operations and use similar elements Logical Constraints for similar tasks. Claim - Exploits people’s everyday common - For example: - State or declare that something is the sense reasoning about the way the - always use ctrl key plus first initial case, typically without providing world works. of the command for an operation – evidence or proof. ctrl+C, ctrl+S, ctrl+O - Stating something to be true when it is Cultural Constraints - Main benefits of consistent interfaces still open to question - A mechanism for putting knowledge in are easier to learn and use. the world by adhering to a known Benefits of Conceptualizing convention. Internal Consistency - Enables design teams to ask specific - Cultural constraints rely on learned - refers to designing operations to questions about how the conceptual convention constraints. behave the same within an model will be understood. - Specific Cultural Constraints application. - Prevents design teams from becoming - Precise detail - Difficult to achieve with complex narrowly focused early on. - Universal Cultural Constraints interfaces - Allows design teams to establish a set - Once accepted by more than one - Internal consistency refers to of commonly agreed terms. cultural group, they become consistency with other elements in the universally accepted conventions. system. - They cannot be change easily - S.N.L.A. | 6  Interface Metaphors Conversing - Physical actions and button pressing - An interface metaphor in user - interacting with a system as if having instead of issuing commands with interface design is a collection of a conversation. complex syntax. graphics, behavior and processes of - Where users Underlying model of - Rapid reversible actions with the user interface that leverage basic having a conversation with another immediate feedback on objects of information that users already have of human. interest. other domains. - Range from simple voice recognition - Interface designed to be similar to a menu-driven systems to more complex Exploring physical entity but also has its own ‘natural language’ dialogs. - moving through a virtual environment properties. - Also virtual agents, toys and pet robots or a physical space. - Can be based on activity, object or a designed to converse with you. - Involves users moving through virtual combination of both. - a system and tell it what to do. or physical environments. - Physical environments with embedded Benefits Manipulating sensor technologies. - Makes learning new systems easier. - interacting with objects in a virtual or - Helps users understand the underlying physical space by manipulating them. Which Conceptual model is best? conceptual model. - Involves dragging, selecting, opening, - Direct manipulation is good for ‘doing’ - Can be very innovative and enable the closing and zooming actions on virtual types of tasks. realm of computers and their objects. - Issuing instructions is good for applications to be made more - Exploit’s users’ knowledge of how they repetitive tasks. accessible to a greater diversity of move and manipulate in the physical - Having a conversation is good for users. world. children, computer-phobic, disabled - Can involve actions using physical users and specialized applications. Interaction Types controllers. - Hybrid conceptual models are often - Tagged physical objects (e.g. balls) that employed, where different ways of Instructing are manipulated in a physical world carrying out the same actions are - issuing commands and selecting result in physical/digital events (e.g. supported at the interface—but can options. animation). take longer to learn. - Where users instruct a system and tell it what to do. Direct Manipulation Conceptual Models - Very common conceptual model, - Shneiderman-(1983) coined the term underlying a diversity of devices and DM, came from his fascination with Interaction type: what the user is doing systems. computer games at the time. when interacting with a system. - Main benefit is that instruction - Continuous representation of objects supports quick and efficient and actions of interest. Interface type: the kind of interface used interaction. to support the mode. - good for repetitive kinds of action. S.N.L.A. | 7  Paradigm Augmented Reality Attention - In science and philosophy, a paradigm - In computer programming, a process - The behavioral and cognitive is a distinct set of concepts or thought of combining or “augmenting” video or phenomenon of reflecting selectively patterns, including theories, research photographic displays by overlaying on a particular aspect of knowledge, methods, postulates, and standards for the images with useful whether considered personal or logical, what constitutes legitimate computer-generated data. while avoiding other noticeable contributions to a field. - Faster computer processors have made information, is attention. it feasible to combine such data Examples of Paradigms displays with real-time video. Design Implications for Attention: - Make information significant when it Pervasive Computing Theory needs attending to - Also called ubiquitous computing, is - A theory is an abstract or generalizing - Use techniques that make things the growing trend of embedding form of meditative and logical thought stand out like color, ordering, spacing, computational capability (generally in about a phenomenon, or the underlining, sequencing and the form of microprocessors) into consequences of such thinking. animation everyday objects to make them - Contemplative and logical thought - Avoid cluttering the interface with too effectively communicate and perform processes are also correlated with much information useful tasks in a way that minimizes such techniques as observational - Search engines and form fill-ins that the end user's need to interact with study, research, etc. have simple and clean interfaces are computers. easier to use Cognition Wearable Computing - Cognition refers to "the mental action Perception - building, or using miniature or process of obtaining knowledge - Perception is the organization, body-borne computational and through experience, observation, and recognition and interpretation of sensory devices. the senses" sensory input in order to represent and - Wearable computers may be worn comprehend the information or under, over, or in clothing, or may also Cognitive Processes environment provided. be themselves clothes (i.e. "Smart - It is important to note that many of Clothing" (Mann, 1996a)). these cognitive processes are Design Implication for Perception: interdependent: several may be - Icons should enable users to readily involved for a given activity distinguish their meaning. - Bordering and spacing are effective visual ways of grouping information. - Sounds should be audible and distinguishable. - S.N.L.A. | 8  - Speech output should enable users to - Expecting to have internet access - they are harder to understand than distinguish between the set of spoken reduces the need and extent to which human voices words. we remember. - Provide opportunities for making text - Text should be legible and - Also enhances our memory for large on a screen distinguishable from the background. knowing where to find it online - Tactile feedback should allow users to (Sparrow et al,2011). Problem-Solving, Planning, Reasoning, & recognize and distinguish different - What are the implications for Decision-Making meanings. designing technologies to support how - All involve reflective cognition. people will learn, and what they learn? - Often involves conscious processes, Memory discussion with others (or oneself), and - Memory is the brain faculty that Design Implications for Learning: the use of artifacts. encodes, stores, and retrieves data or - Design interfaces that encourage - May involve working through different information as needed. That is the exploration. scenarios and deciding which is the basis for learning over time in order to - Design interfaces that constrain and best option. affect future action. guide learners. - Dynamically linking concepts and Design Implications for PS.P.R.DM: Design Implication for Memory: representations that can facilitate the - Provide additional - Don’t overload users’ memories with learning of complex material. information/functions for users who complicated procedures for carrying wish to understand more about how to out tasks. Reading, Speaking, & Listening carry out an activity more effectively - Design interfaces that promote - The ease with which people can read, - Use simple computational aids to recognition rather than recall. listen, or speak differs. support rapid decision-making and - Provide users with various ways of - Many prefer listening to reading. planning for users on the move encoding information to help them - Reading can be quicker than speaking remember. or listening. Externalizing to reduce Memory Load - Listening requires less cognitive effort - notes, shopping lists, to-do lists: Learning than reading or speaking written to remind us of what to do - Learning is a method of developing - Dyslexics have difficulties - Post-its, piles, marked emails: where new insight, experience, behavior, understanding and recognizing placed indicates priority of what to do talents, beliefs, attitudes and desires. written words. - External representations: - Remind us that we need to do Cognitive Prosthetic Devices Design Implications for R.S.L: something (e.g. to buy something - We rely more and more on the internet - Speech-based menus and instructions for mother’s day) and smartphones to look things up. should be short - Remind us of what to do (e.g. buy a - Cognitive resource of extended mind. - Accentuate the intonation of card) artificially generated speech voices - Remind us when to do something (e.g. send a card by a certain date) S.N.L.A. | 9 Design Implications for ERML: 2. Back Channel Co-presence - Provide external representations at the - Back channeling is the feedback - The simultaneous presence of interface that reduce memory load which a listener gives to a speaker individuals in the same physical/virtual and facilitate computational offloading to show that (s)he is following, or location, not necessarily engaged in understands what the speaker is face-to-face interaction with each Social Interaction saying. other. - A social interaction is an exchange 3. Farewell Rituals - Technologies that enable co-located between two or more individuals and - Rituals and ceremonies help to groups to collaborate more effectively. is a building block of society. Social give meaning to an event. In the interaction can be studied between case of a farewell ritual, it is the groups of two (dyads), three (triads) or fact of separating from someone. larger social groups. 4.Implicit & Explicit Rules Being Social - When talking about writing, - The word social comes from the Latin “explicit” means something that is socius meaning "friend." When you're stated plainly, while “implicit” being social, you're everyone's friend. refers to something that is implied Go to a social, or mixer, and you might and not stated directly. make a lot of new friends. Remote Conversation Conversational Rules - It's a means of communicating at a distance via electronic tools that let 1. Turn Talking you correspond with people outside of - Turn-taking occurs in a face-to-face communication. It's also conversation when one person referred to as virtual communication, listens while the other person and it's become a quintessential part of speaks. As a conversation the business world. progresses, the listener and speaker roles are exchanged back Tele-presence and forth (a circle of discussion). - Telepresence refers to a set of technologies which allow a person to feel as if they were present, to give the appearance of being present, or to have an effect, via telerobotics, at a place other than their true location. - S.N.L.A. | 10