Ep 228| Mapping in UI Design - The Impact it can create ?

Mapping is one of the very interesting thing in product design and UI UX design. Many people intuitively think and do whatever they think it is correct. And also sometimes they are taught they are learning in their old habits and then they are doing it. But as a designer, how you can break this pattern for a user and create a meaningful interaction, meaningful mapping so that it can make a big difference in their screens and their task completion rate goes up, their user engagement goes up, error comes down. What is this mapping? What do I really wanted to say? I'm going to break this in this video. A case study and an example. Also the neuroscience backing and a very good interesting activity for you as well. Okay, let's jump in. When you take mapping, what does this mean by mapping? Okay, so before explaining the concept, I'll ask you to do one thing first. You can take a product which is near you and try to see how you are getting the output. Like let's say if I'm having this, rims are placed in certain ways and then I'm pressing it down, brightness is coming down and I'm increasing this brightness is going up. Try to do an action. Pause this video and do it. I hope you would have did that because if you're not doing that, then what I'm going to tell you now is not going to go inside you. You'll just see it as a theory, which is what schools and colleges are pretty much. If you did that, you would have understood something like the buttons are arranged in a certain way so that you can easily interface and take the decision and the expected outcome is coming. The arrangement and the pattern in which it is placed is called mapping. Let's say if it is mapped ulta upside down. Okay, the button is there in the back. How will you go and interact with that? It's a poor mapping, right? Yeah, certain things need to be mapped in the back. Let's say the removal of the battery for this remote can be in the back side because that's like people as to intended to open this battery and then do it. That's called proper mapping in the usage of battery use case. Let's say if you want to increase the brightness, the interaction should be very inevitably available for you. Then the interaction happens in a success way. So mapping are the very, very interesting thing in UI UX design. Mapping refers to relationship between control and their effects. What effect you are getting it and what control you are able to have it very crucial for creating user interfaces, very intuitive interfaces. It enhances the user experience and improves the Overall usability. Okay, this is the part there are different type of mapping. One is spatial mapping. A fan could be there with the height of a fan. Maybe the bottom switch can be there with the bottom spatial arrangement. Maybe the top, the chimney switch can be there in the top. So that people can deliberately go and do it. So you arrange the spatial differences so that people can able to understand better. So if you're creating a room like this, if you're showing the 3D model to the customer or a client or something, the best way to show spatial is putting the exact sofa tape window in that space. So that's the way in which it can be spatially arranged. When you take a digital screen, it could be even mapped based on that spatial arrangement. Let's say map navigation system, spatial arrangement in which you keep the elements. People tend to understand it in a much more clearer way. That's called spatial mapping. Next is natural mapping. I'll give how many of you have this stove in in your house like this? Let's say if the control of the stove is like back, left, back, right, front, left, front, right, what happens? You are very confused. Like what to operate this to control that. Let's say if you switch on the wrong heater and if the food goes on and the fire keeps on and your food is not cooked because you have kept your food here and then you switched on the control of this. This is ambiguous, right? How about this natural way of mapping? Since this burner is in the left top corner, this is also kept in the left, in the right, bottom, right, front, front is according to that user. So this is a way of naturally mapping. It's a very interesting thing. How about this one? Can you understand which switches for what? Which is for fan, which is for light, which is for which fan. Let's say 5 fan is there in their room. Have you ever felt that problem? Which fan should I switch on? What switch corresponds to this? You do it in trial and error. You would have also felt that experience. Similar experience I had. Okay, when you design a switch, see how the arrangement of fan happens in the room or the auditorium or the hall. And keep the switch in that way so that people will know first is for first, second is for second, third is for third. This is the solution. But you can think about how you can map it in an even more intuitive way. Look at this fan switch. It's a very classical example. Fan regulator is here. Obviously people will switch on this. Only they know this is for fan. If I keep another regulator here, if I keep Another switch here. What happens? People tend to make mistakes, right? Because of their learned pattern and behavior. The way in which you map something, an interface or the experience, people tend to take it in a whole new different level. You simplify their action, you create a meaningful experience for them. You can make it in a functional way. So same I told you, an example of a fan. You can keep it in a cultural way. Cultural is something like the make in India logo, India flag, the lion, animals. So these things could be mapped in order to have the relativity for that meaning. There is another mapping called perpetual mapping. Let's say if you wanted to give a real time world experience so that they can understand. Imagine for a blind people, braille, if you give, they'll understand. Okay. This is for something like a tactile experience which is similar to your real world. They will know that the mapping could be made like this. Okay, I've just taken an example so that you can understand better. This is the background behind it. Why certain users are feeling it's very difficult, why it is very important and why as a designer, we need to understand this carefully. See, when you design a mapping, effective mapping reduces mental effort required for the user to understand and interact in a specific way. This makes the task easier. Let's say if you're making the user to do a banking transaction and then your mapping is not clear and people go and take a lot of time to do a financial transaction, they'll be getting a lot of frustration in your hand. Next time they'll log out and they'll create a new app and then they'll use it. Many people tend to miss out that particular application, download the business of that particular application or that company brand comes down. It's because of the small, small things. It's not because of too much fancy screens. Okay, Even with a basic screen, people were able to create payment page and do it. If you take the payment page which is loading, it's very, very low encryption rate and low pixels and resolution will be there because at that time people should not miss out on the transaction because of the high Internet speeds. So even with that, people can able to get the interaction done. But if you functionally understand how the mapping can be placed and how it can be interacted and how you can leverage the strength. Okay, so what happens inside the brain? The brain's ability to recognize certain patterns spatial relationship is leveraged in an effective manner. Actually this enhances the user interaction. This is what exactly happens inside the brain. Because our brain has a pattern of seeing through collecting the patterns and then it makes a meaning and then you do it. So instead of making that, you tend to make the user very easy to recognize the pattern, take the decision and take the action. This is what is going inside our brain. People have a over reliance on their certain habits guys. They have a cultural misalignment, sometimes non intuitive. Poor mapping can also increase in errors and dissatisfaction. So user already have that habit pattern. Your responsibility as a designer is to break that and create a new pattern or maybe create a similar pattern which they already know. If it's an Indian road, people know left side is for the way forward. If it's an Indian context, like many people know, like okay, switches will be designed in this way, will be on off. But it will be very different in the European countries or the us. Maybe the interface of the switch itself is very different. They have on off, but the interface could be even more different way. So this is more interesting and becoming more engaging when you understand the user in their shoes. But if you're not understanding that, what happens? Like let's say if you're designing some kind of a nuclear power plant interface, like let's say aircraft interface, if it's a very critical parameter and then they understood it differently, disaster happens. That's why the errors and these things are very, very interesting. Let me give you how it impacts the industry. Effective mapping can improve your task completion by 20%. It can reduce the error by 30 percentage. It improves your user experience. End of the day, if you're not satisfying your customer or your client, you will lose the project. Customer satisfaction score increases by 10 to 15%. Even we do a project and we get this course because of this course only. We pitch to the next client to get more products, more projects, more problems. And then we solve it. We get paid. If the company is getting paid, then they will pay you. If you solve a big problem, they'll pay you big money. If you solve a small problem, they'll pay you small money. 20, 30,000 per month. Right? Many designers still get that salary. Please understand. Choose an industry where you can solve a big problem and get this impact done. And then you can get accordingly fit. Remember that PPP passion solves a problem. You get paid for that. So please understand these factors are very, very helping you. Let's say Net promoter scores also improves your better mapping indication rate. So it's not like we are like learning mapping, we are understanding the impact of it. The conversion rate goes up in your landing page, in your financial transaction. You are reducing the bounce rates of the people by 15 to 20% through effective mapping. But this is the important statistics. Yeah, you can keep on learning from a book called Design of Everyday Things. Don Norman has talked about signifiers, natural mapping and when you take loss see, it's a way in which you evaluate the user. Also whatever the user is expecting, are you able to fulfill it? That's exactly what Jacob Heuristic evaluation also says that user expect your site to work in a similar way or a familiar site make it consistent. It's a law of consistency. This is one heuristic player. Fitzlough targets should be easy to acquire based on the size and distance. Imagine in a map you're seeing some distance and reality. The difference is very big and will allow that interaction. You will get frustration, you will be guided in a different path and your car runs out of fuel based on your calculation. So it's very frustrating. Higgs law. It reduces the decision making time to make the people take a good decision faster. Clear mapping can have this much of importance and then you can able to understand there are a lot of relevant topics. Also, if you create a user information architecture, your mapping will also very clear. If you do a user testing to understand it, you can even refine your mapping accessibility. This ensures mapping is intuitive for all users with even disabilities. I talk to you about blind and other special needs of the people, right? So I hope this activity is very clear for you. If you learn it through this way, you will understand the mistakes of it. The second activity for you is take your portfolio. Take one interface. If you're doing a physical product, ID Design, that's okay. Industrial design. Take one interaction with the physical product or digital products. Try to improve the mapping. Ask the people who's near you, five, ten people and tell how it was before and how it was after. Like let's say if they recognize one minute to understand this interaction. After you change the mapping, they're able to recognize in 30 seconds. Twice you have improved put it in your portfolio by changing this design. I improved my interaction twice. People will love that. People will love to see what you improved, what you interfaced, what you in your project. Be very specific. What mapping you do, what people have changed in their behavior and how it has reduced their decision making time. And you project it in your portfolio. People will love to see that. I hope this video is clear for you. Take that action, pin that message what you put as an interface or interaction in your portfolio. And I'll be making sure I read each and every comment and give you feedback. Listening to these videos will not give you any impact. Taking action and making mistakes and getting corrected and reflecting back on your learning improve. See you in another video. Take care.