Day 50-Figure & ground Aesthteics Skill- 100 Days 100 Skill Booster Sessions

You know that. What do you call? Please switch on your camera, Guys, I needed to see you. And it's a very different feel if I see and teach. Yeah. So what we are going to do in this particular week, in fact, the week is I have choose a theme, okay? There are seven skills which is going to come in this week, but it is going to be a aesthetics week.

Okay?

Is aesthetics. Can you type in the chat box? What is the aesthetics? Type out. Type out. What is aesthetics? Tell me what is aesthetics according to you? Go ahead, type out of the chat box. I'm not seeing any chat. Come on. Just a second. Just pasting out the link for the people in the WhatsApp group. Give me a second. Okay, okay, fine. Let us understand that. Give me a sec. Okay, great. So people are typing in the chat visually appealing. Oh, then what else? Okay, one person is saying visually appealing. What about others? What are the aesthetics according to. You see, guys, being a designer, we need to first understand this word, okay? If you call anybody randomly, okay, from any different, different field, they're going to tell this word aesthetics as a meaning, right? But according to you, what is aesthetics? According to me, the word aesthetics has completely redefined. When I visited a museum called Bauhaus.

Okay?

How many of you know this museum? In 2019, I had a visit for this museum. It's there in Dessau, Germany. It's in the central part of northern part of Germany. Mind blowing, okay? Mind blowing. Meaning I got in design. In fact, I unlearned a lot of things after going there. The way in which I started seeing aesthetics was. Was very different after visiting this one museum.

Okay?

And yeah, you can type out in the Google, you'll know this museum, what is this made up of?

Okay?

In fact, the curriculum, what the design syllabus design students are studying now across the globe. Okay, not here, across the globe has been derived from the Bauhaus principles, okay? In 1909, this movement became very famous. This, this aesthetics and design, they call it as a design movement, but people saw it like an aesthetics. People saw this whole perspective like a aesthetics. Like, let's say art needs to be more colorful, no more harmonious, more what you call rhythmic. So all these names were called. But if you take on the flip side, if you go into the Bauhaus designs, if you go and understand who has. Walter Grupius was the one who actually started this.

Okay?

Started in 1909 during the world War. I mean before the World War I and during the World War II, what happened is it got fallen okay. It broke and then again it, it went away. But the, the principles of Bauhas remain same. The principles of Bauhaus was impacting the entire design journey. And if you know minimalism design. How many of you know minimalism concept? Type out in the chat. Yes. Type out in the chat. Yes. If you know that good looking and emotional look of the product.

Okay.

Yes. How many of you know minimalism concept like Jagdish? I've heard this word, I've applied slide somewhere. I'm consciously not aware, but I know that this is one of the principles which people talk about. How many of you, how many of you like that people are watching in the YouTube live? I would recommend you to type in the chat.

Okay.

That makes it more interesting. Yes, yes, yes. Thank you guys. Thank you. So it is a very clear and evident meaning that everybody knows aesthetics in a very different way. Right? But in this week you will have to be little patient till Sunday, okay? You will have to watch each and everything what's happening, the examples, the case studies, what we are going to show you activities, what you are going to experience and do it. The way in which you think about aesthetics will be very different.

Okay?

And I am not going to reveal you on the day one itself. Slowly, slowly you will understand that part. Okay? And there is something called Gestalt law of psychology. There are many laws available how the aesthetics has been deciphered and construct, reconstructed.

Okay?

There is something called Rasa theory.

Okay?

Emotional, like we saw a little about emotion in the last week, I think one or two days. But the expressions is very different. Nine different emotions we have, okay. The designs, what we do, it's all resonating to that and we evoke a different emotion. Like imagine when we design this cap, when people are touching this, or maybe people are touching your user interface, what you're designing, they evoke a different emotion. Like let's say if you made that interaction as red in color and you gave a tactile feel along with that, and then you created some haptic feel. Like, let's say you also added a little micro interaction, you added a little vibration to it when people are doing it, and then you added a sound to it and then you added a graphics to it. So you touch different, different aspects of the human when you try to add more flavors and elements to it.

Okay?

So what happens? Don't do it randomly just because you have all the options. That's not the point. The point here is at that time, what is required for that interaction to happen for that human being, how can we evoke a different emotion? How can we touch his senses? He already told you, like the apple is actually playing with your senses. They know how to create an experience. People don't pay for product or service. People pay for experience. The kind of experience, what they feel, what you made them go through. So we as a designer hold this responsibility. And in this week, aesthetics, what you're going to learn is going to be a major, major authority for you. Being a designer aesthetic is not just making the product look good, making the product feel good. If you're talking like that, then the 10 standard student is also going to give you the same definition. What you guys have given are you guys want to be the same and you wanted to really have a proper understanding and depth in aesthetics. Type out in the chat one if you wanted that.

Okay?

I wanted to know because it's not about. Yes, yes, yes, yes. Come on guys, type out of the chat. Yes, Anju. Yes. Hari. Yes, Chavi. Yes, Jayanandani. The point, what I'm trying to tell you is you have to internalize this word more than any other people out there in the market, out there in the, in the product design world.

Okay?

So you don't have to go for Bauhaus Design Museum, guys, you don't have to go for what you call. You don't have to go for Germany and all these places, spend lots of money. You just have to understand this full week with me, okay? And I'll give you some activities. You can just follow that. Second, I would recommend you to go and listen to one of my podcast. I have detailed documented what I have got as a learning when I went for Bauhaus musing and came back. Okay, I think it's there in Spotify. Harry, if you can able to go to the Spotify channel and bring that podcast and paste here, that would be a great help. But anyway, if you're not able to find out, just. Just leave it. No problem. Just focus on the class.

Okay?

Later also you can do fine. Guys, I'm sharing my screen now.

Okay.

So that audio will help you to understand this Bauhaus museum in Amurrus different way.

Okay.

So with that context we will start this session. Guys, just a second. What's happening?

Okay.

Okay. Yes. So we are in the day 50, guys. Okay, so we are in the midway. How many of you are excited? We are doing it consistently for 50 days. Yet 50 days is there. But the way in which we started the day one. I think you guys should see the day One, how clumsy we are, okay, how nasty we are. But we are having a perfect structure. Each and every skill, beyond the simplicity you can't expect outside, either people will too much confuse you or people will give you no information.

Okay?

But we are breaking down each of the skill. What are the concept? What are the neuroscience behind it? Because nothing happens without neuroscience. You need to understand that, okay? An aesthetics, what you're going to see. It's a direct dopamine hit for your neuroscience. I'll tell you what are the neuroscience behind how people are seeing certain things. How people are seeing the circles, how people are seeing the rectangles, how people are seeing the lines. Entire aesthetics, what you call, is broken down into these elements. When you see a car, wow, beautiful. When you see architecture, wow, beautiful. When you see a website, wow, beautiful. It's all made up of lines, circles, and what you call dots and planes and shapes, right? It's all arranged in a particular way in order to make you get that feel. The color, the texture, the kind of way in which it is coming. And everything is actually arranged in a seamless way.

Okay?

So composition is a very important word to remember. Please take a note, guys. See, I'm telling you, even if I teach you for this one week, it doesn't mean that in one week you'll become a master of it. It takes practice, theory you can quickly understand, not a problem. But it takes little practice for you to internalize certain principles. Please take a note because this is not going to go very easy. It may seem easy, but it will not go very easily.

Okay?

There is something called composition. There is something called Gestalt law of psychology. There is something called Rasa Theory. If you understand these three perspectives along with Bauhaus principles, you're going to see different. You're going to see design after this week in a more different way. The way in which you operate will be very different. But for that, you need to pay close attention.

Okay?

So in this day, we are going to talk something called figure and ground. How many of you know this? How many of you have heard this type yes, in the chat box? If you have heard this, okay, please, please don't say yes. Then only it will become interesting for me. Okay? I'm just kidding. I think you could have heard this word. I'm sure nobody has ever what you call come across this type N in the chat box. If no, if it's yes, type Y. Let's understand. Let me understand how this audience is also there. Excellent. Excellent. No means that's excellent. Okay, great. So it is one of the principal guys of Gestalt law of psychology.

Okay?

But this is not the one and only one. I'll explain you little shortly, but let's start with this.

Okay?

So what is this figure and ground about? It is a balance of foreground and background. Okay, I gave you a little context of aesthetics, guys, but we will slowly, slowly reveal on the day. Tuesday, Wednesday, Thursday, Friday, so and so. Okay, but first I wanted you to observe this concept, okay? It is a balance between foreground and background. What is the overview? Figure and ground principle is a foundational gestalt concept, okay? It helps users to distinguish figures from the surrounding area. If I show you one picture, you will be able to understand it. See, why it is very critical for the designer is to make sure he guides the user accordingly. How many of you know FedEx logo can you open that? If you are having Google with you, you can parallel open FedEx logo.

Okay?

I'll tell you what is mean by ground, figure and ground in that, okay? And it creates a clarity and hierarchy. See, understand this particular word, guys, we are not bringing this for some kind of a fancy stuff, okay? It is critical in design as it guides your viewer's eye. Remember this point views, it guides your viewer's eye and also it creates a hierarchy. We as a designer are instructing the user. Hey user, this is what I'm trying to say. Please understand this. You're not consciously telling that you're communicating through your visual, okay? This is a major objective of it. Aesthetic will be outcome of it. Please don't get it wrong. It's not the other way around, okay? So your clarity in your communication, the guide and the hierarchy within this layout is. Is very important what you create, okay? So understanding figure and ground helps you create visually organized experiences, right? Have you seen certain screens? Like, let's say it looks very decluttered, it looks very cluttered. It looks something is off. You will not feel it's bad, but you will not feel it is good either. These are all like emotions. You can't express this in words and abstract, okay? So you need to little bit sensitize towards it.

Okay?

So this is the whole thing about it. So it's actually helping you to create visual experience and separating the primary major elements from the secondary elements. Okay, so let's see one example now.

Okay?

You'll definitely get the clarity, guys. So what you're seeing in this picture. Guys, can you tell me what you're seeing in this? Go ahead. You can open the mic and Talk, guys. No problem. Hey, don't talk technical words. What you're seeing in front of this picture. I'm asking a very simple question.

Okay?

Vas. Yes, that's what I'm asking. What you're seeing, Let me put it into a.

Okay.

What is the source about? Let me write the source. Guys, wait. Make sure you give that source.

Okay.

Not correct to take just like that. So we are using this source. Great. So this is one example. Let's go back. What are you seeing here? Is this figure and ground? Confirm me. Two faces on one was each other looking at each other. Batman. Of course it's Batman. Understand the concept. Like what are the reason we are talking about this one? Hmm. Go ahead. Okay, let's. Let's leave that. How many of you can see here something? What is this? I think it's little common, right? Many of the people would have known about this. You can open the mic and also talk, guys. No problem. Completely fine. Okay, people in the YouTube live, I want to check like what's. What's happening in the YouTube live as well.

Okay?

Two faces. Okay, excellent. Who's that? Divya. Okay, fine. So what's happening here? This is the one I'm asking. Can you see something else?

Yes.

Ah, tell me.

So one old lady and one is younger girl.

How many of you can see that? How many of you can see that? Maybe the way in which you are tuned towards seeing that it is little different. Okay, now I'll try to explain you. Wait. Take this picture. Can you see this picture here? There is a vaas which people have already said, right? And there are two faces merging this. So what is the designer or maybe the communication? Whoever is trying to put this image, they are just reducing the background and they are highlighting it.

Okay.

They are bringing out certain things and then they are neglecting certain objects. Why? They could have deliberately put a vast picture, right? Or they could have deliberately put a face picture, right? So why people are doing this? Can you tell me? Their communication is very simple, right? They wanted to show some two faces. And why. Why are these people not directly telling? Tell me, sir.

It's communicating that when you are looking completely the black one, then it is easy to focus. And like this is the switch between your black and white.

Okay.

You can constantly look at black black and if you are immediately look at white, it's easy to identify like what it is. So it's a black and white concept. When we are looking at the UI screens, then we are generally making the screens in white screens and Black screens.

So. Okay. Color is one part. Anju, I understood what you're saying. Color is one part. I'm asking in general. See, they can also put a flower vase like this, right? Imagine this is one flower vase.

Okay.

They can bring two faces here. Imagine why have they not communicated like this? Can you. Can you go a little deeper and answer this? I'm asking for everybody, not just for Anju. I'm asking for each and every one of you. Hari, Muthu, Jayanandini, Shaee, everybody. I'm asking reducing the pixel area. Muthu is little bit closer. Excellent. Muthu, go ahead. Muthu is little bit closer. I wanted you guys to think beyond this conventional what people normally think. I wanted you to slow down on think. There is a reason why people could have also put this flower vase directly, right? Yeah. They can also put some black and white here, Anju. And they can simply do that. What is the point in doing this? Like this kind of two faces. One example is this figure. I'm drawn. But I'll show you a lot of examples. Wait for it.

Okay.

And yeah. Let's see this. Can you see one old guy and there is a face also inside.

Okay.

They could have deliberately drawn a face. They could have deliberately put a old man also two pictures. What is wrong? Why? Why? See, this answer has to come from you guys. I am not going to reveal this. Then there is no point in learning design. It has to come from you internally.

Okay.

Jain and is saying reducing the distraction. Showing only needed. Excellent. Little bit closer.

Okay.

Little bit closer to the answer. But try it out. You. You guys have not got fully. Muthu, you have not got fully. Hariharan is saying to give different interpretations. This is excellent here. Excellent. Good, good, good. You guys are learning a lot now.

Okay.

Few people, but what about others? Type out what is the intention behind creating this kind of a figure instead of deliberately doing this. Go ahead. Advertisement.

Okay, fine.

Correct. Two colors. Easy to see for all. That is okay. That's what Anju also said. That's great. Superb. But why you can still keep the two colors also right here also maximum how much many colors are here. But. But if you still want to make see, these are like only maximum two or three colors. Making interesting. Showcasing two different messages targeting different people at the same time.

Okay.

Targeting different people at the same time. What's Chavi trying to say? Showcasing two different messages targeting different people at the same time. That's exactly. You can also see in that perspective. But here it will be little different. Context.

Okay.

Sanjay is saying contrast color shows information clear and precise. That's good. See, I will tell you the use case. Guys. See, the moment when I tell you the use case, you'll be able to get even more clarity on that. Okay, Please listen very carefully. The reason why certain. Certain graphic design principles or certain. What you call certain aesthetics are being projected in this way is. I'll just let you know. Wait. If. If we go forward, we can able to get this clarity. Yes. Wait, so why the skill matters? Let us go and understand the skill. But first understand that the reality of this, it improves clarity. See here what I am trying to say is like let us say what's happening now. Okay, fine. So here what is happening? There are many communications available, right? Background, there is a sofa. There is a. There is a window. There is a rope. So what are the communication, what we are trying to say? People can interpret it like gift. People can see it like just a flower was. Right? The meaning in what you guys see is very different. People will think it's a. What you call artificial flowers. Or maybe it looks very solid. It looks very flimsy. So the perception what people had will be very different. But here, what's happening? What's happening? Let's see this. Only one thing. Some people will only see only the flower vase. And some people only see this. So the way in which you are hierarching the information is very clear. See, you have the control here. I am expecting that word only from you guys. Since time is not there, I am just going away. Okay, so the person who has designed this or maybe put this, they exerted the control of the user. I am controlling your view now. Okay, you are not viewing randomly here. I don't have any control. Control is there, but it's very minimal. Please understand that. So when you choose an element in interaction, in design or even in the physical product. Okay, even in the physical product, I would say you take any physical product. Guys. Like let's say the physical product. The user can only keep the hand like this, right? I have designed it in a way. It's only the user can able to go. So I'm literally making the constraint and a boundary for this guy. It's not only for digital products. Guys, please understand. It's for everything. It's for physical, digital, everything. You need to get this clarity and going forward. When you take like let's say just a second, so focus. It directs your user attention to critical elements without getting overwhelmed. And it enhances the usability. A well balanced figure and ground relationship supports intuitive navigation and interaction. What happens? Okay, why are you making the user very less distracted? Very minimal to the point. Your ultimate objective for you to do is to get to do whatever they want. The mobile application, whatever you're designing on the website has a different different intentions. But when you use this kind of a graphical element, it is not only aesthetic. Guys, please keep, keep this aesthetic away, okay? That's what I'm told. That's what I'm telling you. In this one week you'll see very differently. But the way in which you are guiding and making the user very clear, using this one principle, figure and ground will ultimately make the objective very superb. If, let's say people are using the same mobile application and achieving the outcome in 10 minutes. Imagine with this figure and ground applied consciously in many places, you guys can able to do it in just one minute. You guys can make the user achieve the whole task in just one minute. Can save up to 10 times of their time. Why? Because you made this communication very clear.

Okay?

So now this is the concept behind it.

Okay?

If you wanted to really understand more, let me give you some more examples. It's relevant across web design, mobile posters, physical product, anything. Guys, it doesn't matter. I told you, right? It's very, very important. And it's across all the field. 84% of the user value layout clarity when using website and app. How many of you don't know this? 84% of the user don't think your user is just a. Hey, he'll just like that view it very, very important. Design Management Institute has said that users form the first impression in about 50 milliseconds. Psychologically heavily influenced by the figure and ground relationship. A journal of cognitive neuroscience said that I told you, right? If you're not understanding this, you're not winning any of your products. How do you make a national award winning product? How do you make the product use for the people? Like they are glued to this forever. Have you seen many of the applications like people are glued for that forever. Excellent. Extraordinary. Because they have understood this aesthetics in a more different way.

Okay?

88% of the user are less likely to revisit a site if the content is very hard to distinguish due to poor layout balance. Let's talk about composition and all these things later. But this is the statistics you need to understand, guys.

Okay?

So what are the neuroscience backing for it? Our brains are wired to differentiate figures from background as a survival mechanism. How many of you don't know this? It's a part of our DNA. How are you able to differentiate even before me telling that? Because it's all ingrained in our brain. Please understand this very carefully, okay? Because lot of people are thinking. This will take time. You. Just a second, guys. Just a second. Okay, fine. Good. So lot of people are thinking like it's a very conscious thing and many people are only going to see that. Some people will not see this. No. It's a part of our DNA. You need to understand this, okay? The perception let us focus on important elements while filtering out the noise. You as a designer has to make that very easy for the people who are viewing that. I repeat this last sentence. You as a designer has to facilitate that to happen very easily. If you confuse your user with a complex layout, you tend to go into a big problem. Okay, see, this is the concept I explained you. I just showed you. But how you are going to consciously implement. Let's come to that part. Okay, so when designers apply figure and ground, they align the brain's natural processing, leading to quicker comprehension and retention. Right? So your user takes decision in your mobile app or website or anywhere or physical products only in a split second by viewing this figure very clearly in your product or service or whatever you're building. If that is not felt, people will not glue to your product. They will go for their customers or they will find something else. You need to get this clarity. Okay, so what is this all about? Figure and ground definition. The figure and ground relationship explains how we distinguish an object from its background. It's very clear now. Okay, so it's a focal point and it gives you a context and everything. So basically a button, a headline, image or anything, whatever. You primarily try to focus. Please try to play around with this. Okay, and the background providing the context for like, let's say it can be black, color, white color. See, black and white is a very simple example, but it could be applied for anywhere. Okay, please understand this concept. Okay, so there is something called contrast, Space and isolation, size and scale, borders and outline, shadow and depth. You can do it in multiple way. See this figure? What I showed you is a mix of everything. Okay, maybe we can take this example. Maybe we can take little complex. I'll show you one. One more example, guys. Yeah. How many of you can see something different here? What is this type out in the chat? Guys, what are you seeing here? Go ahead. What are you seeing in this picture? It's very deliberate. Guys, can you see that? Looks like stee job face. Excellent. What about this? Who is this? Who is this gorilla? And Tiger. See, I'll tell you an example. If you are drawing some kind of a figure on ground like this, like let's say if I'm taking this example and I'm putting it here.

Okay.

What is the source about? Okay, yeah. So what does this exactly mean? Is like the designer who has taken this example, okay, Instead of drawing too much of elements, instead of taking too much of graphics, I just put one small dot here, dot here.

Okay.

The internal tree, what I try to design is in the outer face, which is like the sill out of the gorilla, the sill out of this tiger. But I just did one small element. What this. So why we are choosing the minimal element is to make the screen clutter free but still communicating the same thing.

Okay.

It's not like I want to deviate the communication. I want to keep the communication in the same. But the background, it should provide the context of the figure. You need to understand this. This is very, very important. See, ultimately if you are not understanding this and then if you are trying to create lot of graphical elements, you are again confusing your user. You are making the screen even more ugly. The context should be first conveyed. See, leave aesthetics first. Your functionality should be communicated. Communicated, communicated. Your functionality is uttermost important thing. We are, we are not just painting some wall picture to keep in museum. If you're talking about that, then this class, we can talk in a very different way. But we are making a product usable for the user. You're not going to put it in a wall and enjoy that painting. You are going to make that usable, accessible, functional for a user. So you should communicate the meaning very clearly. And this is one principle. Figure and ground is a one concept. There are many other things which we will see. But understand this element. So this creates a clarity and visual communication to your user. Okay, so let's talk about first concept, contrast. Use colors to make figure and ground stand out from the background. You can use one way. Second, you can use high contrast directly to attention. To get the key elements right. You can use this white and black, whatever you guys said. And also we have seen the example space and isolation separate the figure from the ground with white or negative space. People have typed out right chat box for breathing room and isolation helps you figure out and capture the attention. Now I wanted to show you one important information. Guys.

Okay.

Just a second. How many of you have seen maybe people who have attended our earlier session? Please keep quiet. Can you see something else in this logo? Let me open this. Can you see something else in this logo, Guys? Come on, go ahead. There is a figure and ground available here. Can you tell me? Go ahead, tell me. I want you guys to consciously understand and tell me where is the figure and ground applied here? Go ahead. Come on guys, type out in the chat. Where is the figure and ground available here? Can you see something here? Like what is this communicating? The O shape and the D shape. Semicircle in E, O and E. Okay, what is that meaning? I'll tell you guys. Maybe it's little difficult for you to understand. Can you see here? Can you see something? Arrow mark here? And maybe take an example and put it here.

Okay.

Maybe I'll try to put it here. Okay, so in this FedEx example, whatever I taken you, this arrow mark is not consciously drawn. But this arrow mark has communicated that this is going forward. It's a logistic transportation company and they're. They're. They wanted to move forward. They don't want to stay in a place. The meaning of the logo is this context. Okay, but they don't want to consciously put the arrow mark and get the brand logo in the backside. Of course the brand logo has to come front, right? But they have also communicated that and also without disturbing the X, without disturbing the E. See how smartly played. Very minimal to the point. But people who are little conscious will understand it. Are you guys getting it? Are you guys getting it? Let us go for another example. Let us go for another example. How many of you can see something here? This logo. Very good examples. How many of you can see something here? What, what is. What is the figure and ground here? Let's say want you to type in the chat. See if you're not active, what happens is we will not peacock. Who, who, who has got that? Divya Anju. Excellent, excellent. So this is actually very smart. The reason being there is a big relationship between the peacock, the animal and this com and this logo and the brand. Okay, so don't do anything randomly. Do it with a very conscious approach. Okay, if you're able to do it with a conscious approach, what happens? You will try to attract the far more different audience and you will communicate the meaning to the point.

Okay.

You can see a lot of examples coming in your online.

Okay.

I'll show you. Hold on. There is something else also. Of course these are like pretty direct. Like the Adobe A is inbuilt inside and usa, the ES is inbuilt inside. It's like pretty direct. I also told about this and also it's a bitten apple. How many of you don't know this bitten apple meaning. Okay, so there is a. There is a scientist who was like, let's say 1950. He has died. Name is Alan Turing. Okay, so this guy has been actually poisoned. By placing the poison on the apple, this guy was innovating too much and he is becoming a threat for the technology or whatever people have. What they did is they poisoned his apples, okay? And they wanted to create the death of this guy in a more subtle way. So he doesn't know why he is dying, but every single day he was eating that. But the thing is, he died. So. But this guy has contributed a significant contribution to the entire world of computing today. The way in which we are seeing the computing now, it would have not happened if Alan Turing was not there. Please go and watch the movie. You will understand there is a movie called Imitation Game you can watch that you will know about Alan Turing. Okay, so in remembrance to that Steve Jobs has said this. This is what is the story. I've read it is pretty sure, but I'm 100% not sure. I've read it from a very trustable source, but this makes sense. The reason being entire computing industry, including Microsoft, Apple, whoever, has the way in which Alan Turing has first invented the computer, the principles, the counters, the counting machine. That's what he first called it as, okay, that was developed over the time as machines, as computer, as processing units, as cpu, as one integrated computer. Then came desktop, then came laptop, then came now, like we have crazy things, right? So in remembrance to that, Steve Jobs have skipped that. But he cannot bring Alan Turing face putting a mouth biting and all right, he has just created a cut, figure and ground. Got it. See, the story and the meaning, everything is conveyed here in a very minimal way. You as a designer has to bring your elements to the minimal, to the minimal, as minimal as possible. You can see this. I'll take this example maybe.

Okay.

We'Ll take one example here. Oh, why it's not coming like this? Give me a second. Okay, so what are the source here? Okay, so the point here is you can look at all these logos here. Can you see connectedness? This logo is communicating something else. Okay, and this unilever, you can see, see, there are many principles available here. Don't worry about this for now. Just worry about the figure and ground. Okay, so only the FedEx. We'll talk about this logos in a day. By day, slowly, you'll understand other principles also. Now comes the real action. Okay, so are you guys getting the clarity in what is mean by this figure? And ground. Are you guys understanding what is mean by figure and ground? I'll give you two minutes time, guys.

Okay.

I'll give you three minutes time. Take out any two pictures in the online showcasing. This is figure and ground. Apart from the examples, whatever I showed you.

Okay.

Open your tab parallelly your browser and I want you to give me at least one example. I'll give you three minutes time.

Okay.

Do it fast. I wanted you to select one. It should tell that the background foreground should communicate a very different meaning. Or a hierarchy or a focus or a clarity, whatever. But one thing should be there for me.

Okay.

So your time starts now. Do it parallel. Because if you do it live only you will understand this. Yes. Last one more minute, guys. I want everybody to share your screen and show me like what are the example you guys have got. I'm giving you the permission for screen sharing. Figure and ground. Excellent. Only one person is done. One. Two person has two. Two examples. What about others? Guys, do it fast. Do it fast. Now typing out is not the point. I want that real picture to be seen. How do I understand this? Yes, Javi, you can. You can share your screen if you want. That would be better. Your image is not coming properly to me. Yeah, that would be better I guess.

Okay.

Excellent. So what are you communicating through this? You're in mute.

I'm seeing a scenic view of the moon, stars and the trees at the night.

Super. What are the connection between elephant and this? Is it an elephant?

It is an elephant. Maybe it's because it's the jungle view and.

Okay, that's what we want. The context and the meaning should be exactly aligned with the figure and ground. What you are doing.

Okay.

It should not be random. If it's a random then there is no point in doing this exercise at all. Excellent. Good. What about others? Anybody else wants to share their screen? Do it fast. Jainandini, Muthu, Divya, Hariharan, Chellagar, Shantilal, Anju, Jainandini. Guys, if you understand one one example you will internalize it more. See Shavi now would have got a clarity consciously by applying this. What is mean by figure and ground? Okay, one more example. Fast. Fast. Before we conclude this session we are already going little beyond Mutu. What about you see, I. I don't want the name to be typed. Many people are typing like Amazon logo. Show me how you are seeing this Amazon logo. That's what we want. That's what I. I request you to show me. Yes, Muthu, go ahead. Screen is there Screen sharing is available for you. Go ahead. Your screen is still loading. Yeah, you're in mute. Mudu, your screen is getting black. Stop sharing and do it again, please. Yes, explain, explain. We can see partially of your screen, but many blacks are coming. I do not know why.

Okay.

Show me one example. Yeah, that's enough, Muthu. Okay. You want to show the empty space. That's. That's what you want. Nothing is there here. There should be some figure. There should be some ground, right? You're showing only the ground. Where is the figure? Anybody else who can share? Many people are sharing me picture. Hariharan is saying Carleton University dance team. That's great. Anju has given a picture. Anju? What does that mean? Anju? I wanted that meaning of that. That's what I want. I can understand the figure and what are the context and the meaning. How are you interpreting that? That's what I want. Yes, Hari. It's very pretty clear. Excellent. It's a dance. It's an expression. It's a dance of bird is also pretty clear. Pretty clear. Okay, good. What about Muthu? Or can I go? Because we are having a little scarce of time. But anyway, Muthu, you can share it separately. Okay, so there is something called space and isolation. I gave you that example. There is something called size and scale. You can play with the large figures naturally standing out against the ground.

Okay.

Borders and outlines. So we have seen some logos which is outlined. The FedEx logo, arrow mark to define the boundaries for to enhance the recognition. Very clearly. Shadow and depth. You can do it with a 3D effect also guys. Similarly it's same, right? So the subtle shadow creates a depth making figure to be float around. So there are five ways you can able to do it. Using contrast, using space and isolation, size and scale, borders and outline. Shadow and depth. But it doesn't matter what you use. It all matters. Are you using it or not? Consciously? How are you implementing this is matters more than what is the concept you are doing. Okay, so the consciousness in which you operate while you are designing this kind of a logos, or maybe you are designing a visual elements will all depend on this figure and ground. This is one of the very, very important principle of aesthetics.

Okay?

In fact, I'll give you some practical tips. Make sure your primary action button stands out your intention of viewing. This is what people have to click this button, right? Make sure your submit button, your call to action should be exactly placed around it. Do not do it for many other things. You will confuse the users easily. Use the color contrast to make the main button pop up and stand out. Second, separate the input from the shading and borders. Use the depth of field. People are more inclined towards that in the form of borders and shading around fields. It helps the user to get what they want. Third, avoid clutter in the ground area. I told you, right? It's always good to keep a plain background very simple. Instead of having too much of elements, it will confuse them. Case studies you can have Spotify like let's say mobile interfaces uses figure and ground principles to emphasize the album cover and key controls. Go and observe this. You will get this clarity dark background research allowing colorful album to stand out. Very simple, right? See, it's a very subtle meaning, but they have communicated that very intensively. Many applications are there, many products are there. I'm just giving you a small example. Resultant of that is what people are getting an immersive experience. I feel very immersive when I go into the Spotify app. I go into the mode of like music listening, all of my podcast, everything. I've put it in Spotify to get that. And also I listen to podcast of my mentors and other people in this podcast. I don't use Apple podcast. Also I like Spotify even though the quality is really good in Apple podcast. But the thing is that Spotify has a good experience. I will never regret that. Okay, Apple product pages. You can see Apple's design emphasizes product by placing them plain white and backgrounds. Many of the people like, let's say they make it very focused reducing the visual distractions and a polished look. You can go to Apple website. You can see that tomorrow day after I'll show you many examples in going forward that guys. Okay, so one more live activity for you guys. Please listen to me. It will exactly improve your ability towards going forward. Take a screenshot of this one. I want you to. I want you to take a screenshot of this one. Contrast, space, isolation, scale and size. Border outlines, shadow and depth. I want one one example of this post it to me separately in WhatsApp.

Okay?

If you wanted to create a very good LinkedIn post for it, please use it. No problem. I'm more than happy because you have to build your brand, right? Take one example of contrast using contrast. How I can able to play figure and ground using space on isolation. How I can able to do it using size and scale. How I can able to do it using borders and outlines. How I can do. Take a screenshot of this and implement one one picture. Guys, instead of posting to me you can post it in your LinkedIn pages. You tell that this is what I learned today from my mentor or the morning session.

Okay?

If you want you can mention the name or else it's okay, but you have to mention the learning. What you got the screenshot of the example and put a small text below it. Take second size and scale. Put one example, put the meaning and the context behind it.

Okay?

Create a carousel effect or post and tag people. That's it. Try to do it. Okay, I want you guys to do this one because this is more important than the activity what I showed you.

Okay?

UI buttons and all. We can do it slowly. But for now do it with basic logos and elements in the online. That would be the start of you.

Okay?

First experiment with this color contrast, this background, borders and everything. Then you can able to do little complex things.

Okay?

No problem. This is not a big deal. Don't worry about it. We'll do it little later.

Okay?

So what are the AI tools which can able to do it? Canva, excellent tool. Runway ML. Please try it out. Guys, my favorite tool is Runway ML. Yesterday I told you about. Not yesterday, Saturday we talked about a very interesting tool, Meat Leonardo. I think many of our people have posted huge. Guys, are you getting reply? I am seeing a lot of reply in your comments. Please go and follow it up. Particularly the Jainandhuni's post and other people. No people are replying a lot. Please go and network with them. Talk to them. They'll become your people of friends. They'll network with you. They'll give you referrals, opportunities. They'll show you a lot of good opportunities. One contact can change your entire life. Guys, networking is all about LinkedIn is all about networking. Your network is your net worth. Okay, so we are ultimately doing these things in the LinkedIn to get attracted with a lot of people, right? By showcasing your learning. So try to do that. And please go and engage with the people who are replying you. Okay? Don't just leave it. We are not doing it for likes or subscribers. We are not content creators.

Okay?

So we are product designers. Think about it. You can use this chat GPT also which I gave you. People who have attended that what you call our magical prompt session, they can able to get it. But here I'll also paste this magical prompt for you guys. But use it carefully, okay? V IO V IO is not needed for you right now. But just try with this Canva Runway ML. And you can use this meetly or not meet you or not. It's A wonderful tool.

Okay.

It's a beautiful tool. You can try it out. So this is what it is, guys.

Okay.

And finally, what are the expected outcome? You should be very confident, guys. You should know what is figure and ground even without others pointing out to you. Your consciousness should go high. That's what I want.

Okay?

So you should gain that confidence. And consciously people has to mean you have to see. Okay, this is figure and ground. Oh, this is only ground. Oh, this is not communicating. I let me make it very minimal. Take your examples and make it even more minimal. Even more. If I can able to achieve it in a circle, can I achieve it using a semicircle? If I can able to achieve it using a semicircle, can I achieve it using a quarter circle? If I'm able to achieve the quarter circle, can I use it only dot to communicate? Is it still communicating? Bring as minimal as possible so that your screen becomes clutter free. Okay, takeaways. I think you would have understood the concepts and everything. And I would also highly recommend you to come and register for our Sunday webinar. Guys, not this Sunday. On the. On the next Sunday we are having a very, very special workshop. We'll send out the link for you and you can register over there and you can listen to my podcast channel, my YouTube and definitely you guys will get a lot of learning. Okay, I'm just pasting out this link to you guys.

Okay?

Yes, I've just pasted our link also for the people who have come, new people who are watching in YouTube live, please go and listen to all of our materials, but don't get lost.

Okay?

Stay focused on your learning and then you will be able to get a lot of clarity over there.

Okay?

And this is podcast and this is YouTube. You guys know it. And what else? Yeah, you can download our Apple application. Guys, I've also given our application, you can able to go and download our LMS and there is one free course which I've kept for you guys. Please go and register and take an advantage. Okay, that would be great for you. Okay, so just go and register. I've also pasted that link I am telling for the public, whoever is attending. So you can watch that one free course which is available for you guys to get learning.

Okay.

Good. It's time for recap. So go to your learning management portal and give me what is the top three takeaways in our learning management portal. Okay, I'll just take a screenshot. Good. I want you to go and type your learning in our learning management portal. Guys, what is your top takeaways? And then leave for the call. Because if you're not reflecting, you'll forget. I request you.

Okay.

It's there in our LMS portal. I'm just creating a post very quickly so that you guys can. Yes. I put my picture share your top takeaways in figure and ground aesthetic session. The skill booster session.

Okay.

I'm also going to add another tag called.

How do I.

Just a second, guys. Just give me a second. Yes. Go under type your learning, guys.

Okay.

I wish you all the best. I hope this would be a start of your learning.

Okay.

It's not a. It's not a end of learning. You. You guys have to now experience by practicing it more. Then and only this. This thing will stick to you. Or else you will forget the life takes over.

Okay.

I wish you all the best. And people who wanted to attend our next webinar also. You can go and register there automatically. You will be getting the message and what you call. Just a second. I'm pasting the link as well for you guys.

Okay.

And please come for that. And you'll be learning a lot more things over there.

Okay.

Any doubts guys, before we end. Chavi, Anju, Shantilal, Tilagar, Hariharan, Muthu, Jayanandini, Divya. Fine. Can we conclude? Yes. What's happening? I'm not responsible, guys. I don't know what's happening. Automatically it is coming. Let me switch off.

Okay.