Welcome back, in this lecture and next, we'll be discussing some of the key concepts that guide the design process and the prototyping process. And the first of these is the notion of affordance. Affordances refer to perceived action possibilities of an object or an interface that, by their appearance, tell the user what they're able to do with them. The notion of an affordance was first developed in 1970s in Psychology of Perception by Gibson but was introduced into the world of design in the early 90s by Don Norman in his book, Design of Everyday Things. And has since then become one of the guiding concepts of how designers think about how interfaces are supposed to work and how to help people accomplish their work through the digital technologies. One of the main pushes for graphical user interfaces was, in fact, to increase the affordances of the computing equipment. What you see on the screen are the screenshot of a terminal that was how computers used to work in the beginning, where the individuals would have to put in explicit commands to make the computer do anything. Versus a graphical user interface, in this case, defined to run the file system of the Macintosh. That just by the look of it and the little triangles that allow Individuals to click on them and expand the content of the folders provide some guidance of what the person is able to do with the interface. So this notion of affordance really refers to the ability of the interface to tell the user what it's capable of and how to interact with it. A lot of the modern user interfaces really push this notion of affordance even further to make the interface itself very obvious to use. So sliders, which look like something that can be pulled left and right, switches that can be turned on and off, all of these interface elements have really been developed to increase the affordance of the computing equipment. Bad affordances often use tools to confusion and user frustration. Here are two images of a card reader at our local university, one of which on the left is relatively clear about needing to press a card against it. While the other one looks like something in which the card could actually be slid through. But in fact, it's impossible to slide the card through it. You're still supposed to just push the card against it. Although, by it's appearance, it's actually inviting a person to push the card through the device. Another example of a bad affordance is this particular water fountain, which when you first approach it, provides no clues on how to turn the water on. And because the switch for turning the water on is completely under the fountain, that big thing that is below the fountain. And if you don't notice it, an individual is clueless about how to make the fountain work. And I've seen many people on campus approach this thing initially and just to look around and try to figure out what to do with it. So the affordances are really key for directing how individuals interact with the system and by making the system functionality apparent and guiding the user action towards correct interaction. And when those things fail, you end up with really frustrating user experience. The second key concept is the notion of a mental model. And mental models are really referring to representations or understandings that the individuals develop over time as they interact with the technology that tell them how they should be using an object or a technology. In other words, the representations of a person's knowledge about how the interaction works and what kind of effects they can expect from it. Mental models are acquired over time with the experience with using an object. But the goal of design is to really make the design in such a way that individuals can quickly discover and learn the mental model that allow them to effectively use a object or piece of technology. So let's take a look at, as an example, just a regular automobile. And really, the main mental model that the person needs to have, in order to operate a car, is that if they turn the wheel, the car goes left or right. If they press the gas pedal, the car accelerates. If you press the brake pedal, the car slows down. The user does not need to know how the engine works. They don't need to know what's involved in making the gas pedal accelerate a car. All they need to know in order to operate the car effectively is just that gas accelerates the car, the brake slows it down, and turning the wheels turns the car in one direction or another. So this distinction between a mental model, which is just the operational understanding of how to interact with a system, and the mechanics of what makes something work is really, really important. And so you can get really sophisticated technologies that can be operated with the relatively simple mental model, and that's, in fact, what we're trying to move to with interaction design. That sometimes fails though. So here's an example of two thermostats, a conventional thermostat on the left, which, basically, is relatively easy to understand and create an effective mental model of how to use this thing. You have a switch that moves the temperature gauge, and when the temperature gauge is at a temperature that you want to keep, the thermostat will just keep that temperature. On the right side, we have a thermostat that uses artificial intelligence to try to predict what temperature you want to have in the house. Increasing the temperature on the thermostat manually will increase it, but sometimes the thermostat will start to decrease the temperature on its own. And getting a really accurate understanding of how this thing works over time, why it sometimes makes the house warmer, why it sometimes makes the house colder, has turned out to be a challenge for a lot of users of these thermostats. If we go back to this notion of mental models, really the problem here is that it's really hard, given the behavior of the thermostat, to develop an effective mental model for how to operate the system. And that's a challenge that the designers of these systems are trying to overcome. In particular, when it comes to systems that have sophisticated artificial intelligence on the back end, providing individuals with some way to understand how to use these systems effectively becomes a really interesting and a really challenging task that you as designers have in front of them. Finally, the notions of gulf of execution and gulf of evaluation are really key to interaction design. These notions refer to the ability of user to bridge the gap between what they're trying to do and the interface that the technology provides for them to accomplish that action. And then being able to understand whether the directions had the intended effect. Gulf of execution refers with the gap between the user's intention, what they want to do with the particular interface, and what they are able to do through it. Gulf of evaluation, on the other hand, is the gulf between doing something within the technology and then trying to understand whether your actions had the intended effect. Usually through the feedback that the technology itself is providing to you. So let's take a very simple example of an alarm clock. Here, if you're trying to turn on the alarm clock, the gulf of execution is relatively small. You have a little switch that can be put into an on position or it can be put in an off position. And it's very easy to understand what you're supposed to do to turn on the alarm clock. Setting the time is a little bit more complicated because it involves actually holding one button and manipulating two other buttons at the same time. So there the gap might be larger. But, in both of these cases, the gap is probably substantially lower than having a bunch of functions hidden in menus with an interactive application. To see if an alarm is on, in terms of gulf of evaluation, you just look at the switch, right? And that's all it takes in this particular case to try to understand whether the alarm is on and off. Technologies that don't provide that kind of immediate feedback tend to be more difficult to use and more frustrating for users to interact with. What is interesting, though, is that sometimes this notion of gulf of execution and evaluation, and the notion of an affordance, are not completely cleanly aligned. Here we have screenshots of two different interfaces for creating a calendar appointment. On the right is a traditional interface that is used in most desktop applications, and mobile equivalents look very similarly. Where the affordances of the interface are very, very clear. There is a line for each type of the information that the user is supposed to enter, so the subject of the appointment, the start time when the appointment is going to begin, end time, the location and so on. And everything is entered with one piece of information at a time in a very clear, straightforward way. So the gulf of execution and evaluation here are relatively narrow in the sense that the interface itself allows the individual to know what they're supposed to do and then walk through those steps. And the affordances are very clear. On the other hand, the interface on the left allows the person to just type a sentence, and the system automatically translates that sentence into an appointment. In this case, I can just write, Dinner with John on Thursday at 7 o'clock or 8 o'clock. And those pieces of information are automatically populated in the interface below, and the calendar appointment is created. What's interesting here is that the affordance of this interface is less clear initially, until you've done a single one of these appointments. And after that, the gulf of execution narrows extremely. The gulf of execution between opening the interface and setting an appointment is smaller in the interface on the left than on the one on the right. Even though the affordances on the one on the right are, at least initially, a little bit clearer. So these trade-offs are things that designers struggle with every day, where certain kinds of interfaces end up, once they are learned, becoming a lot faster to use so that the gulf of execution is much smaller. But they need to be learned. While clear affordances can provide an interfacee that is very easy and clear to use from the beginning, but it ends up being clunky when it needs to be used time and time again. So these are the kinds of trade-offs that designers have to manage as they're developing interfaces and interactive elements of their systems. So just to summarize, the job of the designer is to create interfaces that users can easily learn and discover. So they need to be able to approach a system and relatively quickly acquire an effective mental model of how that interface works and what it allows them to do. Mental models that are difficult to acquire or that are incorrect, lack of discoverability, and lack of feedback that allows individuals to know whether their actions are having intended effect all lead to poor user experience and user frustration. So that one of the main challenges that designers have in front of them is to really develop effective interfaces that have thoughtful trade-offs of affordances and discoverability and gulf of execution and evaluation. So that individuals can both approach those interfaces and learn them relatively quickly but then also have an effective interface that allows them to complete their work in an efficient way as they use that interface over time. Thank you for watching and see you next time.
