CSE213 Introduction to Interaction Design - MUC UNIVERSITY Fall 2024 PDF

CSE213 Introduction to Dr. Manal Ahmed [email protected] Computer Engineering Program Faculty of Engineering MUC UNIVERSITY Fall 2024  Textbook “Interaction desig...

CSE213 Introduction to Dr. Manal Ahmed [email protected] Computer Engineering Program Faculty of Engineering MUC UNIVERSITY Fall 2024  Textbook “Interaction design - beyond human- computer interaction” 5th ed., 2019 Authors: Helen Sharp, Yvonne Rogers, and Jennifer Preece Book web site: https://id-book.pages.dev/ 2 Evaluation Procedures: Total 100 points 3 Lecture Protocol: Attendance: is very important and will be recorded in lectures & tutorials Feel free to interrupt and ask ME DON’T ask/talk to your colleagues. Your Mobile is Silent. Cheating: Cheating will not be tolerated. All work you submitted must be your own. Large similarities between students' work will be recorded and it will be punished. The penalty for any student found cheating will be to receive a 0 for the item in question and dropping your final course grade. 4 Course Objectives: The objective of the course is to present an introduction to Interaction design that requires an understanding of the capabilities and desires of people and the kinds of technology that are available. Interaction designers use this knowledge to discover requirements and develop and manage them to produce a design. 5 Course Content: Interaction design lifecycle User interface pattern Problem space Conceptual model Prototyping User requirements, user experience and accessibility 6 Introduction to Interaction Design Lecture 01 What is Interaction Design? 7  Interactive products How many interactive products are there in everyday use? Ex: a smartphone, tablet, computer, laptop, remote control, coffee machine, ticket machine,... the list is end What do you think about their usability? Why there is a difference? Usability vs Functionality Goal: “Design products that are easy, effective, and pleasurable to use” 8 Good & Poor Designs A central concern of interaction design is to develop interactive products that are usable. By this we mean products that are generally easy to learn, effective to use, and provide an enjoyable user experience. To start thinking about how to design usable interactive products is to compare examples of well-designed and poorly designed ones. 9 Good & Poor Designs 1- Voice mail example http://vimeo.com/19930744 VS. 10 Good & Poor Designs 1- Voice mail example  What is problematic with this voice-mail system? It is infuriating. It is confusing. It is inefficient, requiring you to carry out a number of steps for basic tasks. It is difficult to use. It has no means of letting you know at a glance whether any messages have been left or how many there are. You have to pick up the handset to find out and then go through a series of steps to listen to them. It is not obvious what to do: the instructions are provided partially by the system and partially by a card beside the phone. If you put an instruction beside the machine it is not a good design 11 Good & Poor Designs 2- Remote Control example 1 2 3 4 5 6 7 12 What to Design Designing usable interactive products thus requires considering who is going to be using them, how they are going to be used, and where they are going to be used. Another key concern is understanding the kind of activities people are doing when interacting with the products. How have these devices been designed to take into account (a) the kind of users, (b) type of activity being supported, and (c) context of use 13 What Is Interaction Design? “Designing interactive products to support the way people communicate and interact in their everyday and working lives” creating user experiences that enhance and augment the way people work, communicate, and interact. “designing spaces for human communication and interaction” Terry Winograd, 1997 “the why as well as the how of our daily interactions using computers” John Thackara, 2001 “the art of facilitating interactions between humans through products and services” Dan Saffer, 2010 14 What Is Interaction Design? Who is going to be using? How they are going to be used? Where they are going to be used? Goal: “Optimize the users’ interactions with a system, environment, or product, so that they support and extend the users’ activities in effective, pleasurable, useful, and usable ways” 15 Interaction Design Why? Transforming human–human transactions into solely interface- based ones Examples: Self-checkouts at grocery stores, airports, and libraries Extend the users’ activities in effective, pleasurable, useful, and usable ways Examples: cameras, microwave ovens, and washing machines 16 Who is involved? Fields concerned with interaction design 17  Who is involved? Fields concerned with interaction design Academic Disciplines, Design Practices, and other interdisciplinary Fields (Two way arrows) 18 Who is involved? 19  Benefits of bringing together people with different backgrounds and training is the potential of many more ideas being generated, new methods developed, and more creative and original designs being produced. However, the downside is the costs involved. The more people there are with different backgrounds in a design team, the more difficult it can be to communicate and make progress with the designs being generated. Why? People with different backgrounds have different perspectives and ways of seeing and talking about the world. 20 Activity 1 In practice, the makeup of a given design team depends on the kind of interactive product being built. Who do you think should be involved in developing A public kiosk providing information about the exhibits available in a science museum? An interactive educational website to accompany a TV series? 21 Is Interaction Design Beyond HCI? the main difference between interaction design (ID) and human- computer interaction (HCI) as one of scope. Historically, HCI had a narrow focus on the design and usability of computing systems, while ID was seen as being broader, concerned with the theory, research, and practice of designing user experiences for all manner of technologies, systems, and products.  nowadays, HCI has greatly expanded in its scope, so much so that it overlaps much more with ID. 22 23 24 Accessibility and Inclusiveness (1) Accessibility refers to the extent to which an interactive product is accessible by as many people as possible. Google and Apple provide tools for their developers to promote this. The focus is on people with disabilities. For example, Android OS provides a range of tools for those with disabilities, such as hearing aid compatibility to a built-in screen reader, Apple VoiceOver lets the user know what’s happening on its devices, so they can easily navigate and even know who is in a selfie just taken, by listening to the phone. 25 Accessibility and Inclusiveness (2) Inclusive design is an overarching approach where designers strive to make their products and services accommodate the widest possible number of people. An example is ensuring that smartphones are being designed for all and made available to everyone— regardless of their disability, education, age, or income 26 Accessibility and Inclusiveness (3) Accessibility can be achieved in two ways: first, through the inclusive design of technology, and second, through the design of assistive technology. When designing for accessibility, it is essential to understand the types of impairments that can lead to disability as they come in many forms. They are often classified by the type of impairment, for example: Sensory impairment (such as loss of vision or hearing) Physical impairment (having loss of functions to one or more parts of the body, for example, after a stroke or spinal cord injury) Cognitive (for instance, learning impairment or loss of memory/cognitive function due to old age or a condition such as Alzheimer’s disease) 27 30 31 32 33 34 35 36 37 38 39 40 User Experience Goals 42 43 44 45 46 47 48 49 50 51 52 Homework Reading Chapter 1, “Interaction design - beyond human-computer interaction” Exercise : 1- Visit http://www.baddesigns.com/examples.html and pick any example and demonstrate it in the next lecture 2- research assignment : What is Emotional Design (ED)? 53