Lecture 2: HCI Interaction PDF

Lecture 2: Interaction  1. Human 2. Computer A person who tries to Runs Applications accomplish goal 3. Interaction A "dialogue" between humans and computers ...

Lecture 2: Interaction  1. Human 2. Computer A person who tries to Runs Applications accomplish goal 3. Interaction A "dialogue" between humans and computers  The terms of interaction The purpose of an interactive system is to aid a user in accomplishing goals from some application domain A domain defines an area of expertise and knowledge in some real-world activity Tasks are operations to manipulate the concepts of a domain. A goal is the desired output from a performed task  MODELS OF INTERACTION ❑ Interaction involves at least two participants: the user and the system. ❑ Both are complex, as we have seen, and are very different from each other in the way that they communicate and view the domain and the task.  The interaction framework ❑ The interaction framework breaks into four main components ❑ Each component has its own language. In addition to the User’s task language and the System’s core language ❑ Input and Output together form the Interface. The general interaction framework  The interaction framework As the interface sits between the User and the System, there are four steps in the interactive cycle, each corresponding to a translation from one component to Another The only way the user can manipulate the machine is through the Input, and so the task must be articulated within the input language Translations between components  The interaction framework The four translations involved in the interaction framework are ❑ articulation - the user articulates the task in the input language ❑ performance - the interface translates the input language into stimuli for the system ❑ presentation - the system presents the results in the output language ❑ observation - the user translates the output language into personal understanding  Ergonomics ❑ Ergonomics in HCI refers to the study of designing computer systems and interfaces to optimize user comfort, efficiency, and safety. ❑ It focuses on creating user-friendly designs that consider human capabilities, limitations, and preferences, ultimately enhancing the overall user experience1  Interaction Styles ❑ command line interface ❑ menus ❑ natural language ❑ question/answer and query dialog ❑ form-fills and spreadsheets ❑ WIMP ❑ point and click ❑ three-dimensional interfaces.  point and click where users issue instructions to a system. (e.g., ❑ selecting menus, ❑ pressing buttons, ❑ function keys.  three-dimensional interfaces where users move through a virtual environment or a physical space. (e.g., virtual environments, 3D worlds, augmented and virtual reality, smart home)  Interaction Styles Command based (CLI) A command-line interface (CLI) is a means of interacting with a computer program by inputting lines of text called command-lines Interaction Styles (WIMP) Elements Of The Wimp Interface (Window) Elements of The Wimp Interface ELEMENTS OF THE WIMP INTERFACE (ICONS) Flat Icon Design 3D Icon Design Menu  cascading menu a secondary menu that appears while you are holding the cursor over an item on the primary menu zigzag cascading Cascading Menu in small window Container Menu  Elements of The Wimp Interface (Pointers) The pointer is an important component of the WIMP interface, since the interaction style required by WIMP relies very much on pointing and selecting things such as icons.  Question/answer and query dialog where users have a dialog with a system. (e.g, users speak or type in questions to which the system replies via text or speech output) Form-fills and spreadsheets  Mulimedia Interactive multimedia allows the user to control, combine, and manipulate a variety of media types, such as text, computer graphics, audio and video materials, as well as animation. Responsive Web Design is about using HTML and CSS to automatically resize, hide, shrink, or enlarge, a website, to make it look good on all devices (desktops, tablets, and phones)  Consumer Electronics ❑ consists of devices inclusive of TVs, VCRs, radios, walkie-talkies, hi-fi stereo, home theater, handheld, and software program-based, such as video game consoles, smartphones, tablets, and smartwatches ❑ Get something specific done in a short period of time  Pen-based interaction Pen-based interaction allows users to register information using a variety of devices such as PDAs, Tablet PCs or electronic whiteboards.  Air-based gesture ❑ Air gestures (non-touch gestures) are a new manner of interaction between a person and a device. ❑ They allow a user to conveniently interact with devices without holding or touching them.  Common Air Gestures Swiping left or right Performing an operation Mute Dragging up or down Dragging left or right  Haptic interaction ❑ Haptics is an emerging technology that allows touch‐enabled interaction with virtual objects. ❑ Haptic interfaces enable people to interact with computers using force feedback and vibrations to simulate tactile sensations like texture and movement.  Multimodal Multimodal Interaction is a situation where the user is provided with multiple modes for interacting with the system at the same time For Example Speech and gesture Pen input and speech Speech and vision  Shareable Interaction ❑ Shareable interfaces are designed for more than one person to use ❑ tabletops where small groups interact with information using their fingertips Diamond Touch Tabletop  Tangible interfaces (TUI) Type of sensor-based interaction, where physical objects, e.g., bricks, are coupled with digital representations  Wearable interfaces ❑ First developments was head- and eyewear-mounted cameras that enabled user to record what seen and to access digital information ❑ Since, jewellery, head-mounted caps, smart fabrics, glasses, shoes, and jackets have all been used ❑ provide the user with a means of interacting with digital information while on the move  Brain–computer interaction (BCI) A brain–computer interface (BCI), sometimes called a brain–machine interface (BMI) or smartbrain, is a direct communication pathway between the brain's electrical activity and an external device, most commonly a computer or robotic limb  Virtual reality virtual reality (VR), the use of computer modeling and simulation that enables a person to interact with an artificial three-dimensional (3-D) visual or other sensory environment. VR applications immerse the user in a computer-generated environment that simulates reality through the use of interactive devices, which send and receive information and are worn as goggles, headsets, gloves, or body suits.  The Benefits of Implementing HCI ❑ It helps improve user experience (UX) ❑ It helps improve efficiency and productivity within the production teams ❑ It helps reduce the costs of training and support ❑ It helps reduce risks Needfinding  Needfinding ❑ Needfinding is the process of identifying and understanding the needs, pain points, and desires of a specific group of people or customers. ❑ It involves gathering and analyzing data and insights about the needs and behaviors of the target market and using it to inform the design and development of products, services, and solutions that will meet those needs. Human-Centered Design Process Main Needfinding questions Know Your Users  Design Principles How do you ensure that all these users have a great experience with your design? ❑ Visibility ❑ Feedback ❑ Constraints ❑ Mapping ❑ Consistency ❑ Affordance  1) Visibility The user discovers the interface functions by the simple fact that they are visible for interaction. In other words, the more visible a function is, the more the users will notice and use it.  Hamburger icon It represents the function menu on many websites. It's so common that the user already understands that this icon represents a deep dive of the tasks.  2) Feedback ❑ Feedback is the response that the user should receive after performing some action on the interface. ❑ classify feedback into two categories: Activation Feedback Behavioral Feedback Activation Feedback: when the response to an action is sensorial, such as a visual or sound effect. For example: when you click on a button, it changes color or emits a sound, confirming that it has been activated  Behavioral Feedback: when the response indicates that the action had some effect within the system. For example: when you click on a button to finalize your online purchase, a message appears confirming that your action was successfully performed.  3) Constraints ❑ An interesting example is the action buttons in any computer program. ❑ When an action is restricted to the user, the button usually appears gray and opaque, making it clear that the function is not available at that moment.  3) Constraints This kind of restriction is also common on online forms, where the "submit" button is inactive until the entire form is filled out correctly.  4) Mapping ❑ it is important to have a connection between the design and the function linked to it. ❑ This connection, within Interaction Design, is called Mapping.