Ep 222| Science behind Affordance in Interaction Design - DNA for designers
10 Jun 2024 · 10 min
Jagadeesh P explains affordance, the design principle that makes interfaces feel intuitive. He covers the psychology and neuroscience behind why certain shapes, colors, and placements signal what users can do, drawing on research to show how affordance is foundational to good interaction design.
Welcome. Why certain products are not interactable There are a lot of science behind this. Understanding human psychology. Let's make it very simple. There is a concept called affordance. Many of you might not know it. If you're still wondering how to make your product more accessible, more usable, then this video is exactly for you. If I interact with this, with this headphones, the way in which you see and take it out is what is called making it affordable. Okay, if the form factor is not good, maybe if that understanding of the products shape and the interface, how it has been designed, I'm taking a physical product, but it's applicable for digital as well. The way in which it is not inviting you, you won't be able to interface with it. Okay, so what are the science behind it? What are the small understanding behind it? Let's go and see this. This term was first coined by psychologist James J. Gibson. And this person was responsible for this, even though it was polished later by don Norman in 1890s in behavioral lab at Apple. But this was the first psychologist who actually formed this term. Okay, so what is this? Affordance refers to a quality or a properties of an object that indicates how it can be used. I told you, right? How it can be used, Maybe how it can be interfaced, how it can be closed. That's the first thing. And also there are three ways in which we can see this.
Okay?
One is the physical way, like the door handles, the scissors, whatever possible is near you, you can just take it out the way in which it is afforded.
Okay?
Think when nobody has taught you how to open this, will you be able to do it?
Right?
You will not be able to do it. Second, if somebody is teaching you this how to do, but the form is not telling you, maybe the product is not making you tell that this should be opened this way. Maybe I would be figuring out this way. Where is the opening. There is something called form, texture, color. We are going to the science behind it, but just hold on. This is the way in which a natural indication is being done. Second, buttons, sliders, like let's say when you take a user interface, sometimes you'll feel like touching, sometimes you will not feel like touching. This creates some kind of a confusion. A better affordance should be designed in a way to enable the people to go and touch it out. Like let's say the color, shape, indication, whatever is there, it could be done. There is a third interesting guy which is called false affordance. When people are tricked. How many of you really felt this problem of frustration when you when you go and click on an interface, it will not be clickable, it will not be searchable like you'll be again and again doing it. And the system hangs in and you get into a frustration. These are all the things which a designer needs to understand. Let me tell you the fact guys. There was a research did by McKinsey at 2008. They said companies that focuses on the interface part of it very detailedly. I'm not talking about only the affordance, the interface and engagement part of it. They outperform their competitors with the great revenue growth and shares this contributes to a better design. There is no need to make a competitor analysis even if you work on this small psychological aspect. This proves that, okay, McKinsey is doing a lot of research with the industries and they have all the data. And there is another research by Forrester also 2016. Positive user interface leads to higher engagement. See, everything what we're doing is to engage the user, right? Maybe it increases the profit directly. I'll tell you why. The more you call interface with that particular product, the engagement rate is high. More people will come to advertise their product and service. More people will upgrade for the premium products of them in order to make the revenue growth happen. See how a small affordance is making the business growth grow in a very tangible way. So product with a well designed affordance are most likely to succeed in the market. This is the fact behind it. Okay, there are two types of affordances, guys. One is the perceived affordance, one is actual affordance. See, sometimes you'll be tricked. Like for me this looks like a little groove in it. Maybe I'll be perceived if I have to slide this up. But that's not the case. The real way in which it used to be open is this way. So you may get really confused. That's called perceived affordance and actual affordance. Okay, which could be actually possible. See, you can trick the users also sometimes which is needed in a product design and developer. And then we'll go to the science behind it. My favorite part in this because many times people don't know how it is happening. People don't know why we are doing what we are doing. This is the only way to make you explain guys, very carefully. I'm not going very scientifically, but I'll give you some basic facts. There is something called visual perception we get in mind when we see an object. Let's say like. Let's say when we see this cover, our neural mechanisms will go and work inside it. And Hubel and Wiesel in 1960, they have found something called visual cortex. This formed a very significant growth in which the people in the later 1980s and 90s connected these dots. You know what they said? They said how the brain process visual information is by identifying it. So how does it exactly happen? By understanding the shape, the form, the edges, the movements. This is very, very interesting, guys. So these people have said our visual cortex is what is the brain which makes them process it. Like, okay, this is a edge, this is a form. We form some connections inside it. And this was the very, very foundational research how we perceive design interfaces, thanks to these people. Or else we would be still figuring out with the old computers and interfaces which will not be very user friendly available right now. The next is Gestalt. This guy is more interesting. This guy has not framed a scientific background of it, but he found out something called grouping of visual elements. A Gestalt law of psychology. How people form these perceptions, like let's say proximity. There is something called grouping. There is something called ungrouping. How you perceive. That is what is called formations in patterns, clusters. So these are all the visual elements which people really think about. It's actually found by Gestalt law of psychology. And this guy has actually put this into a format. There is a deep study on gestoid law of psychology. You can go and check it out. Ideally speaking, this is how the psychology is being derived. Okay, See how the dots are connecting for the small word affordance. Okay, now let's come to the interesting part. How certain products are marketed to you. How certain products are becoming more natural to you and you're using it every single day. Have you ever wondered this term called neurochemistry? Maybe if you're hearing this for the first time or second, third time. This is important when you're starting your design career from now, okay. There is something called motor response and action which happens inside our brain. So some people say, right, hey, I used to see people interact. What is the reason for it? It's called mirroring.
Okay.
We use something called a mirror neurons inside our brain. So mirror neurons demonstrate how these neurons fire inside and performing an action. When we observe the pattern from others. This is what is called exactly habits. This finding supports the concepts that object supportance can trigger a motor response, aiding intuitive interaction. Over the time, it becomes a habit. How many of you think this is light bulb? Type out in this video, light bulb. Because understanding of this fact can significantly improve your design, you will try to understand what's your target market Your user Persona is requiring. And then you will understand what are they learned practice and habit. And then you will bring it in your interface. What happens the moment if you do it? People will start using your interface from day one. There is no learning curve for them. Right. All of the interfaces are required to be designed in that way. Now we are living in that kind of a era to understand. So Resolati and Crygiro have actually brought this in. So what happens inside observing and performing action? Like let's say there is a studies on prefrontal context. Okay. Which is. Which is the most creative part of our brain. Miller and Cohen have illustrated that how brain regions is involving in planning and execution. This is called execution center. When cleared affordances are put in a design, this helps them streamline their creativity and innovation and connect the top chip.
Okay.
This helps them streamline their processing by reducing their mental load. I worked in a medical product design. The more interface you design for a doctor and a ventilator, the confusion it is for him. The more visuals you add. It's really, really bad for that person to really go and understand it. Okay, so this is the psychology behind it. This is the motor response behind it. This is the neurochemistry behind all these things. We are doing this to create a dopamine hit. People have to engage and get the reward, right? Once if they get the reward, then they start using this product. We are designing a very clear user engagement. It's all of the point leads to one thing. To make the user get dopamine heat to make the user get a reward, to make the user engage in a long time. That's what was designed by SKU. That's what was invented by Skills in 1998, which is called dopamine hit.
Okay.
But the thing is many times when you design overload, when you take too much of screens and everything, stress impacts their cognitive function. That's why it's very important to consider Law of three is very important in screens. When you Design something like 3, 4, 5, people don't care. People really miss out that flow.
Okay.
So it's actually formed in 1994 by Jacob Nielsen to understand this as a heuristic evaluation. Also he considered this as an evaluation factor. When you take a medical standard, when you take consumer electronics, when you take electronic products, everything. This is becoming evolution evaluation factor For a user interface to be qualified that this is okay, people can able to understand this. This is affordable.
Okay?
The law of affordance is very, very significant because of this evaluation factor which was sent by this guy. Then you know about Don Norman. He formed in 1988 in Apple behavioral lab called Perceived Affordance. You can read a book called Design of Everyday Things. You can find more detail about this with pictures.
Okay.
And when you go to inclu. Accessibility and inclusivity. So there is something called center for Inclusive Design and Environmental Access. These people have formed this. These people have understood why this design principle should be formed in order to make it as a standard itself. Some designers will not. So that's the very reason they have. They have created a rule and a law and a guidelines for it. It developed into a website also website content accessibility guidelines WCAG they call identified and operatable element. Starting from the basics of how the psychology, the definition, the history is the types is and how the neuroscience behind it. When you're able to do it, you will have a much more clarity on how to design an affordance next time. I hope this has gone long, but I'm sure this would have made a lot of sense for you. Because when you touch designing a button or an interface or a physical product, these things need to come into your mind. Let me know what is your difference in opinion in affordance? Maybe you would have a different perception when you start thinking about accordance being a product designer. Let me know in this video. Thanks.