Okay so let's get started with this project and the first thing I'm going to do is open a new artboard and the artboard for this project will be 920x1080 but of course use the artboard that you're comfortable with and maybe if your screen is bigger obviously you can use bigger artboard or if your screen is smaller you can use smaller artboard so it's comfortable to you to see. But I will be starting from desktop and going down to mobile. So let's select 920x1080 and the first thing that I'm going to do is name this artboard if you double click on the top left corner of your artboard you can change the name I'm just going to call this home and then the second thing that I need to do is obviously save this file locally or on the cloud so we don't lose it and you can click on the top left corner then save as local document and I'm going to call this project guard WooCommerce so let's save this and guard is the name of this project as we will be designing a website for luxury face masks so I came up with this random name it's obviously not a real project but I couldn't think of a better name so let's go with it. You might have already noticed that I've already have Photoshop open in here and also Illustrator and this is because we might end up editing we might end up having to edit a few images with Photoshop and also I wanted to show you how I created the logo and let's go to Illustrator quickly and to be honest it's not much of a logo I simply chose the Tozel medium font from Adobe fonts and I just typed the name of the project and I felt that this is looking fairly decent obviously for a real project I would probably spend a lot more time designing a proper logo with nice icon maybe and choose the correct colors and so on so this will be a logo and obviously I used Illustrator because Illustrator is a vector based which means we can blow it up or scale it down as much as we want without getting pixelated. Let's copy a logo and paste the logo into a project let's move the logo to the top left of our screen and I'm moving the the artboard with space and left click on the mouse just dragging and then if you want to zoom in on Windows is control and plus and if you want to zoom in on Mac it's command and plus which is exactly the same command and plus and control plus so let me zoom in a little bit more select the logo and as you can see you can see and you can see this little circle at the bottom of our graphic of a logo so this means that if we hover over it we can resize it quickly so I'm just going to make a little bit smaller and we can mess with it a little bit later first of all I am going to use the same font that I created the logo with for our body text so that I know what I'm going to do is I'm actually going to use the text tool here on the left side of our toolbox or you can click T on your keyboard and I'm just going to drag a little box here on the left side and this will be a body text and what I want to do is actually want to fill this text box with some dummy text so we can see how the text looks like and to do this there is an easier method rather than going to a website like lauren ipson we can go to the plugins of Adobe XD here on the bottom left side of the screen or shift control and P or shift command and P if you're Mac so let's do that and if you go back actually to plugins you will see that I've got a plugin installed which is called lauren ipson and you can add this plugin by hitting the plus sign in here and just search for it and then click install so I'm going to use this lauren ipson very quickly click on it and then quick lauren ipson this will fill our box and I probably don't need so much text but let me hide the plugins toolbar and I'm going to double click on this and remove and remove a lot of the text so it's not so much and then I'm gonna highlight this text and just change the font to be to STOLZL and this will be a body font and the second thing that I want to do is make sure that this is set to black and potentially I'm not too sure yet but potentially we'll probably have to change the line spacing to somewhere around 29 which makes it a little bit better to read I assume but we can always mess around with those styles and I'm just going to make this a little bit smaller so we can actually add this to our library now so we can reuse it later on and to do this we can click here on assets or shift Ctrl and y or shift command y if you're mac and then we can add this as a component just by hitting the plus icon so select your text and hit plus icon and we can call this simple like body text now that we have the body text let's think about the headings as well and I've already chosen a font for this as well and the font I chose is the play fare font let's copy this box quickly with Ctrl and C and Cmd and V and actually let's create a new text box on top of this and this will be let's say heading one and of course we need to change the font so let's select it and select the play fare display and this is a free Google font and I would assume that this will be around the size of this heading one will be around 70 pixels 70 not 7 70 and then we can then we can maybe copy this and make a second heading and so on so we have some sort of styles that we can reuse on our layout and speed up the process so let's say heading 2 and you can do heading 3 4 and 5 of course and so on and I'm just gonna stop at heading 2 at the moment and maybe later on we can add some more and of course we can add those to our component but first of all let's change the heading 2 to be around let's say 46 46 and maybe like this I don't know I think this looks okay and let's add or first heading to the components by selecting it and hitting the plus sign and we can call this one then let's choose heading 2 and type heading 2 and I would probably arrange them like this so we have heading 1 2 and body text and also one thing that I would need to check is whether this text is set to black and if I scroll down to fill I already have a set as black which is perfect so one of the main colors of this layout is going to be pretty much black and white and we can actually use the circle ellipse tool here to make some sort of a palette for us so I'm gonna create a little circle but that's you don't have to do this now because we're not gonna be using many colors so let's fill this with black and we can copy this paste it and make the second box maybe white and of course we can we can add some more later on as we develop the website we'll probably need some shadings of black and so on and of course it will be fairly useful to add this to our colors as well just in case we decide to change the colors of our website this will allow us to make it super easy for us so let's choose this one white one okay so now that we have some sort of style guides then we can start developing the website layout okay let's start by creating the navigation bar and for this I'm gonna press T or my keyboard and start typing so the first element that I'm going to add is gonna be perfect and as you can see we probably need to change the font to something else so let's change to STOLZL let's make sure that this font is set to 16 pixels 16 make sure it's set to black and so on and of course I could have used my body text from here actually but I might leave this as a separate component just in case I want to do some extra stuff with this font and so on so this is actually 20 and I want to set this to 16 okay so this is looking a little bit better and so on so let's continue now I've added the product and I'm going to leave this text box to be the point text but of course you can use the area text but this will make it a little bit harder to align I guess in a second so let's add products and you can either do those separately by copy and pasting the elements or you can just use your space bar on your keyboard and I'm just going to add a couple of spaces here so let's add around I don't know 3 4 5 6 7 8 9 10 11 12 13 14 15 I think 15 is a good number and then after this obviously we're gonna have to add a few more elements let's say we're gonna have a sale and then I can copy this spacing so they equal and add another element in here and that will be about paste another set of spacings and then I cannot support so now that we have a navigation bar this is looking cool and simple the next thing that I need to do is add a little shopping cart in here and maybe a search bar to do this let's head back to plugins and the plugin that I will be using today is called icons for design it's a free it's a free plugin you can literally add it from here just click on the plus sign discover plugins and search for it and this will basic this basically has all sorts of styles of icons that you can search inside Adobe XD and just add them they have like material design metro design Ionic font awesome and so on and let's just go ahead and look for it search icon and the one I'm going to use is this feather icon here so let's click on it this what the icon randomly in here so I'm gonna have to just move this somewhere around here and the second icon that I want is the basket or let's have a look or maybe card and the one that I'm going to use is the same sort of style icon which is the shopping cart in here and this as you saw these are this was added to my screen I can remove the plugins now and these are vector based icons which is awesome and you can actually modify them from here you can change the color the size of them and so on so let's move them on the right side of the screen and I would say that and I want to make them a lot smaller than they are actually the border can be changed as well so they look a little bit more premium so I'm gonna change the size to 2 and I'm gonna change the search border size to 2 as well and what I want to do now is kind of want to make sure that they're a little bit smaller so they kind of fit well with the navigation bar I don't want those two icons to overpower the logo or the navigation bar so I'm gonna just make them ever so slightly smaller maybe maybe like this I think this looks nice and obviously I need to space them out and make sure that yeah let's space them out now so first of all let's align the cart from the right side of the screen and what I'm gonna do is select it and just use shift and my arrow on my keyboard to align it so I'm gonna go with 1 2 3 4 I think this is like 70 okay let's have a look and I'm going to create a box in here just to see what's the size like and that's 40 that's 41 pixels and of course you can just drag it down to 40 and move the icon like this if you want it to be a full number and then we can actually use the Adobe XD guides and you can just drag them from here from the left side or the top side if you're gonna drag one down so I'm gonna drag one from the left side of the screen to the icon and this should snap into 40 it doesn't but that's fine what I'm gonna do is zoom in a lot and just make sure that is from 40 as you I think this is I think this is 40 I believe yes you can see it's 40 and I'm not actually using a grid for this tutorial I wanted to remove the stuff freely but yeah you'd normally probably have a grid and so on so let me align this icon now maybe I'm gonna align it first of all with the basket just like this this is aligned maybe like maybe like this and then just move it like one two three four four times this looks like decent spacing and and to be and to be completely honest we can maybe make the smaller and so on but they look fine for now so what I'm gonna do is select both of them make sure that they're vertically aligned by pressing the alarm button here the next thing that I want to do is I'm going to greet them so they're one element and this is you can select the two of the two elements and press control and G or command and G feel Mac then I think the problem here now is the logo is far too big and it's overpowering the other two elements so what I'm gonna do is make sure that the logo is a lot smaller and I'm gonna click on it and make it like around 30 pixels this looks fine to me and I'm just gonna make sure that the logo is spaced out equally with the top the same as those two icons and the menu and also I want to make sure it's spaced equally from the left to the right and this is 40 pixels so let's track another line in here just like this so now that we have those three elements obviously they were grouped these this is one line of text and this in the logo is one line of text as well so we can select all of them together and make sure that they are aligned by using the alignment tool here vertically aligned just like this and also I want to make sure that the actual menu is aligned in the middle and to do this we can use this icon here distribute horizontally let's click on that and as you can see now everything is aligned well one mistake that I see is that people align their text with the actual outline of the text as you can see here on the logo there is a little outline of the text with their grid just like this and I usually like to align my elements my topography with the actual grid and in this case I would drag it ever so slightly like this so it aligns with the line as much as possible and this is what I'll be doing for the rest of the topography as well now that we have the menu of course we can select all the elements and control entry to group them another thing that I can do is to space the navigation or the header equally maybe like 40 pixels from the top as well but of course we can experiment with this and have a look so it would be 40 will be around here and I would normally drag my heading like this maybe and delete the box and see how it looks so this looks this actually looks quite good I'll leave it like this for now but of course we can change it later now that we are done with the header of this website the next thing that we need to focus on is the hero section so to do this I'm going to use the rectangle tool or our new keyboard and drag a big box from the top left corner of your screen and down just like this and I'm going to maybe have the height around 920 and the width will be obviously full width of the screen and as the default adobe likes to add border for some reason which is cool sometimes it's kind of like allows you to see the box but in this case I'm going to remove the border and I'm going to change the fill into a very light gray color like this and this is just because I have a white background on my board and I want to see where this box is so let's use the V tool to deselect and now we need to move this box at the bottom of the screen and to do these there are two ways you can right click and arrange send to back or send backwards or you can obviously use the showcase which is shift control and left bracket or you can simply use control and left bracket to send it to arrange this box to the back and I'm going to use control and left bracket obviously for Mac will be command and as you can see we can now see our menu and this was kind of hard for me to come up with images because unsplash.com didn't have any suitable images I went to Nali express and I found a bunch of images some of them are quite bad but we're gonna have to use all imagination photoshop skills to create something out of nothing pretty much so I found this image here which is actually quite nice it's not high-res but it will do the job so I took a screenshot of this image and I went on unsplash.com and I will link obviously the image in the description below of the order and I found this nice image and I was thinking that I could superimpose the woman with the mask on this image and make it look a little bit more realistic and let me show you how we can do that and I'm not going to spend too much time on it of course make sure that it's looking nice for your shop because you don't want to make silly mistakes and make your shop unprofessional and obviously if you can get a professional photography then yourself that's even better so let me show you how I did this now that we created this box in here I'm going to use this size 1920 by 920 is the size of this box and I'm going to use the same size for photoshop document so let's open photoshop new file and put 1920 by 920 of height click okay and what I'm going to do is I'm going to add this background image in photoshop I'm just going to drag it and obviously we're gonna have to zoom out a little bit and scale this on this tool we don't have to hold shift it's already holding kind of scaling the image proportionately for us but what I want to do is if we go up I want to see maybe like a little bit of the floor and a little bit of the lamps and so on just like this I would say maybe scale it down so we can see a little more detail like this just to make it a little bit more interesting and of course we can move this up and down in a second when we add the image and let's now add the image of this woman with the mask let's drag it in and as you can see this already has potential let's drag it around here I think this will look nice and obviously we need to remove the box of this image and to do this you can go to the properties in photoshop and convert this image to layers so let's hit that and this will pop up and just click yes and this will convert it to a normal layer and now we can use the quick masking tool in photoshop or you can manually mask it whatever it's easy for you but if you zoom in I'm gonna just be lazy and do the select subject in photoshop and hope for the best and as you can see photoshop is doing a really good job in this selecting or subject obviously we can do a little bit better in here but it's not a big deal for now and then all I have to do is click on the mask in here and that should mask the image first and of course as I told you it's not ideal it's not perfect but for one second job that's absolutely amazing and I think this would be perfect but obviously if I wanted to do a little bit more I would click on select mask and refine the mask in photoshop by using this tool and so on but let's I don't want to waste too much time on this now and the next thing that I want to ensure is that as you can see all navigation is here is and I don't want the head of the girl to kind of get in a way so what I'm going to do is I'm going to move the girl slightly down with shift and the arrow key down maybe like maybe like this and of course we can always modify it and so on maybe a little bit more and we can make the one smaller or bigger and so on so let's save this image I'm pretty happy with it of course save the photoshop file so you can edit it later and I'm going to call this hero image.psd and I don't think that you can actually drag psd's so I'm going to have to save this as an image as a jpeg as well so let's save it quickly hero image save we obviously want the quality to be as the maximum quality save us and we're done now that we have this image with the perfect size we can literally we can literally drag this image into xd and drop it and we get this beautiful looking image so far so good the idea behind this hero image in my design is that obviously this is not going to be just women's products so we're gonna have to maybe do kind of like a carousel where the hero image swaps into from a woman to a man to another one different outfits you know what I mean so to do this I can very simply with design make sure that we kind of like add three dots in here you've probably seen them already in other designs so what I'm gonna do is make sure that this is the body is set to black and this will be set around here then I'm going to copy this and space them out like 10 pixels apart and then let's create another one and for the selected image you'd normally do something like you change the fill into something like dark nearly black so this will indicate that currently the carousel is on this is on this point and then it will move to another one and so on of course we can probably make them bigger we can make space them out and so on maybe like make him maybe maybe make him 10 pixels and just paste them out a little bit just like this I'm not too first and so on and I think this is actually they're too small so let's make them even bigger like 14 will be fine this time I'm sure and let's make sure that they have 20 pixels separation okay this is looking slightly better it's one of them things that I can mess around with for ages but let's make sure that they agree with now select all of them control and g or command and g on mark and now let's select the actual select those three bullet points and select shift and the image below and make sure that these are aligned in the middle just like this and also we can make sure that there is 40 pixels from the bottom to the top if you wish to maintain this kind of sizing everywhere but you don't have to so I'd normally do height 40 just like this move them just like this and we're done so we know that they're nicely spaced out to the element this is in the middle and so on the next thing I want to do is add some kind of like marketing text in here and the first thing that I'm going to do is I'm going to I'm going to copy let's copy the navigation here and paste and what I want to add is something like the collection and of course you can think of some nice marketing materials for your branding and so on let's make it look premium so the new collection maybe we can bump this up to 20 pixels maybe we can space the text out a little bit to make it look more premium I don't know and the next thing I want to add is some sort of a hero text in here and for this I'm going to use the heading one that we created earlier so let's copy and paste this in here and this as I said earlier this is play fair display regular roman maybe we can maybe we can change the mean a second to make it look nice but what I'm going to add here is I'm going to add something like elegant and luxury elegant and luxury and this is looking nice and make sure it's like we'll make sure that these are aligned nicely in the middle later and also let's this is looking nice let's quickly select both of them and align sorry align in the middle here but we can also try different styles of text maybe like I don't know bold italic how does that look this is the problem I can spend so much time on this just looking at different forms and styles so let's check italic like this I don't know I'm kind of uh so what I would normally do is I'll normally copy and paste two headings like this side next to each other and then I will change one just like this and then I'll just like see which one is more elegant maybe more powerful and so on and to be completely honest for now I might go with the bold version so let's change it like this exchange okay I think this looks a little bit more luxury let me know in the comments below which one would you prefer and yeah let's let's go with this I think this looks a little bit better so let's make sure that these are they still aligned like this and normally in modern design this would be actually a one big button that people would press usually on their iPad or on their phone but we can also add a button as well just to kind of make it look like it's clickable on desktop as well I guess so to do this let's create a button and to do this I'm going to use the rectangle tool on your keyboard drag a box and this box will be I don't know let's say roughly around 180 pixels and 45 in height and to make this button look a little bit more modern I'm gonna add some style to it and I'm I'm gonna make sure that the border is set to 2 and I'm gonna make the border black so I think this looks like kind of like luxury minimalistic style I'm going to align it around here and maybe we can copy again the navigation bar buttons let's copy this paste it paste it and I'm going to use this for my button as well so maybe we can say browse collection like this and let's see if it fits that doesn't fit very well so we're gonna have to either make or button we're either gonna have to make a button smaller or the text so let's make the button a little bit bigger I would say maybe like 210 a line a line and I think this is looking nice maybe maybe a little bit longer I would say just like this to give it a little bit more breathing space we're at the design stage so we can mess around with it and come back later and once you're happy with this button we can actually we can actually group this button with command and g and actually add it as another component that we can reuse it lights on and so on so this will be our main button and we can add it in here if you wish copy paste it so this is the original button if we change it this one will change too let me show you uh so let me show you so if I was to change this button to I don't know let's say let's say I want the border to be red you will see that this one is changing as well so this is the master button and that's awesome let's change it back to black and leave it there so I want to make sure that those three elements are like equally aligned just like this um oh sorry um horizontally aligned just like this and maybe the button needs to be spaced out a little bit more to the bottom like this maybe even more like this all right one of the things that I'm not too sure about I would usually look at it and okay I think this looks okay for now so let's save this and continue and the next bit and we need to do is extend this outboard let's extend the outboard and to do this you can double click on the outboard zoom out a little bit and just make it ever so slightly bigger we're gonna need some more space anyway so let's make it around here and go up so this will be kind of like the folding point of the website so this will be excuse me this will be full screen so if I put this on desktop preview you'll see this will be kind of full screen and then we'll probably start adding some more elements in here so the user can see that there is more to scroll I guess okay let's start working on the second section here and on the second section we're gonna focus on two sections one on the left side and one on the right side and basically we're gonna have shop for women and shop for men and let's get let's get going with this first of all what I want to make sure is that the spacing between the hero image and the second section is roughly around 80 to 90 pixels depending on your design you can choose whatever you like obviously maybe you want more spacing and so on so this will be my spacing and of course I can drag one of them guidelines from the top just like this and remove the square and I can actually use this square with the 90 height and just rotate it so it's 90 width and I'm gonna use this so there is 90 width on the left side like this and 90 width on the right side like this okay and I haven't obviously we're not using grid on this which you can do it might make things a little bit easier for you but what I'm gonna do now I'm gonna have to figure out how much space I want between them between those two boxes and maybe you know what in fact we can do we can use the same box from here so that's 90 so I'm gonna use this as my middle spacing as well so I want this to be my middle spacing just like this but I'm gonna have to centerline this first with I'm gonna centerline it with the hero image select both centerline create a new box drag this to the left like this so this will be for me 8 to 5 and I'm going to copy and paste another box in here and let's give him a background color of gray so those two boxes like this then what I want to do is this will be shop for women women whatever pronunciation is correct so let's copy the second heading and paste it in here so this will be our heading and remember I usually align my text just to the point here and also I forgot to remove the border from those two boxes click on them both remove the border and we're done so heading one will say shop woman and then I'm gonna use the body text that we created originally copy paste and paste it around here I think actually this spacing I didn't measure but this looks kind of nice anyway and what I want to do is add some space add obviously some text in here and I'm going to be doing the same for male but also want to make these boxes slightly higher slightly higher than they are maybe roughly around 450 pixels like this and 450 pixels like this and obviously this will be now actually depending on how much text we have this will be grouped together and center aligned on the box so let's say shop woman and add some demitex so women's new arrivals it's time to it's time to explore your options and we'll do the same for male probably and what we can do is we can either turn this we can scale this down turn it into a text area if you like by clicking this button here and just scale it down if you like whatever style you want to go for and I think this is looking nice actually so I'm going to go with this group those two together make sure that they are lined in the middle of this box just like this and now I'm going to copy this paste it and move it to the right side right here make sure that they're aligned like this and obviously we're gonna do one for shop men and then just change this to men men's new arrivals and this is looking good now what I want to do is add some images on those two sections I'm actually going to copy one of the boxes and paste it for later I will show you why and I'm going to move this down so we can have it available so let's find a suitable image for women and the one that I want to use is this one here and this actually doesn't this actually has a white background I haven't edited it yet so let's drag this in here and if you double click on it you can actually move the image the way you like you can scale up and down but I actually like the way this landed I really like this so I'm going to leave it just like this and I think this is perfect I'm going to do the same for the male so let me drag one for male I actually have only one for male and let's drag this in and the thing that I want to make sure now is that those two images the aspect ratio of those two of their heads the same as you can see right now this is overpowering this and this is because the aspect ratio in this one is slightly bigger so what I would usually do is try to align their eyes maybe just to like make it look similar I don't know like I'd say like this the eyebrows and the eyes and I think this might just work so then let's place this to the right side and we'll have a look and adjust accordingly so let's leave this and as you can see they're very similar now maybe maybe this needs to be a little bit bigger I don't know but you see what I mean make sure that they're similar and the next thing that actually spotted is that this image this image is a lot warmer than this image and this is something out normally fixes I'm if I'm working for a client I'll make sure that all images have the same sort of feel so this will definitely need to be changed but I'm not gonna waste time doing this and continue and I talked about earlier how this is a one big button those two are potentially going to be two big buttons as well so if you tap on this the hall area this will be a button especially if you're on a tablet you don't want to mess around with small buttons like this so this will work as a big button but of course we can also if you wanted to we can also use one of our buttons that we created earlier copy and paste it and this will make it look super pretty as well so this is another option just like this and of course I would align them nicely just like this and obviously they need to go in the middle of this section and of course this is looking cool but maybe we can even center this text if we wish let's have a look like this so it's just like this so it's all about exploration trying different things what you like what you don't like quite like this but one issue that I have currently with this is that there is a lot of space and you don't really know where the button ends so there's a few ways we can do there are a few ways we can do to do this obviously the first one I'm thinking is add a background color the second one maybe just like this that's why I use the box obviously we have we have to crop the image but maybe we can add a background color just like this so we can see where the outlines are or maybe another another option would be to to add like like this to make this white and to add like a shadow underneath it depending on your style obviously this text now will need to move inside and that looks super stylish as well real nice but if your website design does not have shadows obviously stick to it don't do that and the other way that we can do all this is to separate to create a separator between them obviously we need to like this maybe like a even a smaller one to make it look cool just like this all right I'm just showing you that there's so many ways of doing this I would I would now probably go ahead spend some time cropping those images and put this background underneath them so they look the same and let me copy this button for now and continue because it's taking a lot of time so let's make sure that the text is aligned together just like this this text needs to be aligned in the middle let's text align align boxes and obviously probably want that to be aligned like this I don't know and the button needs to be middle aligned make sure you select those three combine them make sure that they're aligned horizontally there so we're good to go okay I would definitely go for the option with this background color in here and these are looking nice now you can desktop preview this super quickly just to see how your website will look like scroll up and down maybe to see how it looks like I'm not a big fan of this button but those are the things that we can change whenever you like and so on and let's continue now with the next section and the next section is pretty much displaying some products and to do this let's use exactly the same spacing from here which I already forgot how much it was that's roughly 90 so we can create another rectangle here drag another line if you wish just like this drag it even more right there and then this then this will be our new section in here and what I want to achieve here is basically add like maybe woman's best sellers so let's copy this second heading again paste it and move down here in the middle like this so and obviously make sure that this setting is aligned in the middle you can also text align it so when we type it's always in the middle and I will just type woman's best best sellers make sure you align it properly with your line just like this and and then let's add a little bit of text just like here and in fact we could have copied this as a template and use exactly the same spacing let's do that so I'm going to copy this text delete it and just replace this one here obviously center align the text and drag this into here make sure that those two aligned oh okay make sure that those two are aligned like this maybe ungroup those two and align them like this make sure that this is obviously aligned in the middle and I can just use select both of them align with the here section just like this and now we know that this is in the middle and the next bit that I want to do is with not so much space maybe half of this space so half 90 is 45 so maybe we can just do 45 pixels like this at the bottom and this will be our new line so let's drag one down like this and this is where our boxes will start appearing from sorry all items so in this case I want to create five items and I'm not exactly sure how many we can fit and how much space I'm on between them but what I can do is I can create a little box around here and I know for sure that the box I wanted to be roughly 400 pixels maybe maybe that can be roughly 300 and I don't know 320 326 maybe I think that looks like a good number then what we can do is use the repeater grid to kind of figure out how many we can fit in here so what one two three four five is what I want and I would maybe like do it like this sorry so I think we are now now we need more we need more a little bit more spacing so 28 pixels between them that's not too bad I wonder whether this is width or without the borders maybe we can have maybe we have to make them a little bit smaller or calculate it properly so like 22 and and then change the padding all right this is a little bit so make sure you calculate yours okay so make sure you calculate yours instead of wasting so much time like me and I think this is working quite well the spacing between them is 45 and we have five columns which is cool and I can actually undo this and remove it and more probably now create just one and duplicate that one instead and just to remember the 45 pixels now let's let's add a box between them here just like this okay this will be all spacing guide for later okay so obviously we need some nice photos for this as well I'm gonna drag a few and I won't be spending time editing them just like this I think this is working quite well and then I'm going to copy some of the body text from here and in fact I'm going to copy the button as well and the body text paste them underneath here and I think this is looking nice obviously this box will need to go down to fit the size of the product that we are selling remove the border and we can name we will have to give this a name obviously like gold I don't know sparking mask not very good with giving them names and another thing I want to do is just below here let's copy this text and paste it and just below here maybe around there I will add the pricing as well so we can have ten ten dollars quite cheap for premium mask I guess and then we can have two spaces and we can have what's the dollar sign we can have eight dollars just like this and because this is this is technically on sale what I can do is select the ten and use this strike through text effect in here and then I can actually do the opacity on the ten to be around 60 so excuse me not on both just on this and like this just on the ten I want to make sure that the can use 60 and it looks like it's selecting both so what I'm going to have to do is actually separate them which is a little bit annoying but let's separate them make sure that this is set to point text copy this paste it just around here make sure that this is set to eight and remove the strike through text I think this is looking good but obviously I wanted to make sure that this is less prominent than eight so I'm going to set the opacity to 60 so eight pops out a little bit more then we obviously can do with a button if we select this button and scale it down with holding shift this should work for us and what we have to do now is instead of browse collection we'll just replace this with add add to add to basket and of course we can make this button ever so slightly smaller like this make sure that the text is aligned and so on I think this looks okay looks presentable and the next thing that we can do on this is because this is on sale we can we can actually make a little batch that actually on top of here so let's do that to do this I'm going to make a little circle just like this circle can be around 51 51 make sure that the circle is black just so it suits our team and it sticks out a little bit to create this cool effect we can make it so it sticks out kind of like the same sort of okay and then inside here we can obviously put sale let's copy this text here paste it and go like this sale and obviously we have to create this as maybe white so we can see better like this and I think this is a little bit bigger so let's do this as 12 to okay this looks perfect actually quite like this and we are pretty much done now let's use the repeater grid tool let's select all of this ctrl and g to group it and if we do repeat the grid then we can just track make sure that the spacing between hits this mark here which was 45 if I remember correctly correctly and just let's add the rest of the items and that seems to work perfectly obviously we're gonna have to replace some of those items so what I will do now is let's ungroup that group in here we can change some of the pricing of course and so on so let's say this one is 40 and remove this put the opacity up remove destruct the text obviously we didn't select the sale which is good actually so we don't have to remove it but you get the idea I'll probably finish this later on just make sure that they looking good and then let's just walk a few images on here just to make it look a little more presentable so I'm gonna go ahead and add a few more like this one looks nice and the this this jpeg looks nice this this one looks nice and so on obviously change the naming to make it a little more realistic and so on and the next section I'm going to do which will be an exact copy of this so let's copy the size of this which was 90 90 like this let's drag another grid rule this thing here like this so we got 90 spacing remove it we can now copy this full section copy and paste and just move it down so it aligns with our grid that we just made up like this let's I don't know let's change this to something else new new arrivals and then we can change this to something else as well so new new rows updated every day it's time to it's time to explore I think this is sufficient this is good and I noticed I actually copied this section in here so let's make sure that we got we add some nice text in here and I will say oh smooth and soft with and some marketing obviously you can make this a lot better at some marketing stuff just like this make sure it's aligned with everything like this okay and this is looking perfect nice obviously we're gonna have to change we don't want the same images to repeat in here so and the names and the pricing so I'm not gonna waste your time changing all this but I'm just gonna put some new images in here so let's start with this image because it's just super easy and we could have done this in an easier way with the grid but I kind of forgot so let's just do it super quickly anyway this one I think you can select multiple images and drop them on the grid and that will actually work but it's kind of too late now so leave it for now like this and one more this one looks cool save this and let's finish this off with subscribe button and foot on social media so let's make this a lot bigger and for the sign up section that I'm going to do I'm probably this was 90 so I'm probably gonna double double the spacing so let's do something like 180 or whatever because it will be too close together I think if we did 90 again but this will be a new guide so let's add another guide like this just like this okay and we'll probably use this in a second as well so let's copy the second heading we use this quite a lot the second heading so let's copy this paste it around here and what I'm gonna do now is let's add some text so first of all let's do something like sign up to God's newsletter and get updates about all latest arrivals and exclusive sales something like this I think this looks real nice and we can also make it italic if you wish I think this would look cool I don't know why this broke but round 62 will be nice I think this looks cool makes it look expensive I guess make sure this text is properly aligned and like this I think this will be fine and obviously we're gonna have to create some sort of input box in here so I'm gonna use the line tool which is left on your keyboard I know I'm not going to measure it just gonna drag a line like here make sure that the line is set to black and I'm going to copy some of this body text here paste it and what I'm gonna do is add something like enter enter email address make sure that this is like this aligned with the box I think this looks cool make sure we can put this to opacity down to 60 and we can copy and paste this at the end here and maybe do sign up sign up and I'm gonna leave sign up as well to be the same looking like this again I think this looks nice let's group all this together and what I want to do is I want to make sure that these are aligned in the middle like this and I'm pretty much done here so I'm gonna use the 180 pixels at the bottom now to start creating the last section of this website and I'm sure that you're glad to hear this the last section of this artboard which is the footer so we have 180 let's use one of them alignment lines like this remove and what I will do is for the actual links what I will do is I'm gonna use again the body let's copy this paste it in here and let's add a few lists just like okay I'm gonna use this for the buttons for the list and I'm gonna use the same font for the headings but I'm just gonna bump this up to like I don't know something like 25 would be fine I think so let's name this how can I help with a question mark make sure okay like this and as you can see I think that these are like really close together so maybe I would probably bump up the line spacing between them to be like 36 instead so they have a little bit more breathing space like this I would say so they're easier to click I guess as well but on mobile we might have to space them more and so on and let's create a little separator between the heading which will be nicely aligned here and let's make it like this I think this will be looking nice what we can do for the separator let's create a line just like this and depending on how many sections we have we might have to calculate the spacing again which it's a little bit annoying but let's do that and let's first of all before we do that let's make this line gray as well just like something nice like this I'm sure you'll look nice and sharp when we zoom in okay make sure that the spacing between those two elements those three elements is kind of equal like this by using the alignment tool in here distribute vertically yeah let's calculate how much we can fit so let's create a box replicate the grid c1234 and let's see how far we can push it maybe like this but that's a lot maybe maybe like I think 40 sounds pretty good um let's make the box is bigger this was so lazy but it is what it is so now that we have this sort of grid here what I can do is use this line to align like this and I can copy this and multiply it around here just like this to save us a lot of time and effort and what I will do is now just swap some of the elements just like you can say useful info info on this one let's create some model lists ability and so on then we can say maybe like a company and for this we can say about I think I already had about I don't know we can say about in contactors I think we already had contactors but it doesn't matter it's just the me text anyway and here we can maybe do download app just to fit the spacing and I've already downloaded um Apple App Store app icon that we can add just like this yeah remove the text and of course we can add the google one as well and so on and last but not least what I want to do is finish off this website with adding a foot at the bottom here so what I'm going to do is make this for width and then say 220 God and I need to copy and paste the copy the copyright sign in here like this and I can obviously centerline this right that we can make it this as well and last but not least we can use the plugin the icon plugin icons for design and just add some social media plugins like let's say Facebook I like this one let's add Twitter I like this one let's add Instagram this one looks nice I like let's say snapchat for example and YouTube of course okay let's copy those icons let's cut those icons and paste them right in the bottom here like this and what I will do I'm not going to spend too much time I'm just gonna like figure out the spacing I think just like this I think this will be okay and what I will do is I'm gonna use the I'm gonna select all of them and then do the equally distribute horizontally like this make sure that this is aligned with the copyright at the bottom and you move them like this and we're done save us and we are now done with the first page let's have a look at what we've created so far click and as you can see everything is looking nice maybe this could do a little bit more work I would say the button I'm not a big fan of but everything else is looking pretty nice I would say now that we're done with the desktop version it should be actually super easy to convert this into mobile and let's get going with this so the first thing I'm going to do is create a new artboard by clicking on here on the left side or just press A on your keyboard and this should give you all sorts of different devices and the one that I'm thinking of using is the iPhone X XS 11 Pro and the reason I always use this one is because there is a lot more mockups than the max 11 I think but you can use whatever you like so I'm just going to go for the pro and let's zoom in and get started so the first thing that we are going to have to do is we're going to have to kind of we won't be able to fit this anymore we can keep the search icon and the basket but we can't fit this so we're going to have to make the use of the burger menu let's get started first let's copy the logo paste it where is it paste it somewhere drag it in here let's copy those two the search and the basket and we will create the burger menu ourselves and what we can do on here is let's do it like this just like that make you obviously want to do some usability tests make sure that they're not too close together when it's used on mobile and so on the logo will be in the middle of the page and let's create the burger as well we might have to actually go down with those two I think I feel like gonna have to do that and the board of them looks quite big so I'm gonna have to go to one make them a lot thinner then they are that looks a lot better already so make sure that they align like this and I don't know what space to use between them maybe like let's have like maybe like one space what is this I don't know maybe like 16 will be fine just like this and I'm gonna add 16 pixels at the left side as well where we're gonna add the burger menu so let's do this like that is this 16 I don't know okay this is 16 now it's looking good to make the burger menu we're just gonna use the line tool basically I'm gonna make it roughly 17 pixels in width so let's do that 70 pixels in width make sure that this is set to black and copy this paste it make sure that there is like a little bit of space maybe five pixels will be fine and another five pixels and here is our burger menu select all this group it align it here on the left side then zoom out select your logo maybe I don't know I have the feeling that we might have to make the logo even episode slightly smaller as well just like this I think this will be nice to make sure that we have aligned everything nicely I'm gonna use this box again to align everything but yeah I think I'm gonna line those let's select everything first of all make sure that they're aligned control G to group them and I'm going to align them like this with this at the top okay and this is looking nice and professional the other thing we can do on mobile is maybe add like a background color background for the navigation and to do this I'm just gonna select white go down make sure it's like equally spaced and and we'll come back to this in a second actually let's remove it and the reason I was thinking of adding this is because when we copy this image and scale it down like here let's scale it down like this actually let's create let's create a square that is going to mask the image like this so rectangle tool somewhere around there not too sure how much we want not actually let's make it a lot smaller because we don't want to waste too much space like 400s 420 should be okay let's mask let's mask this image with this box so if I put the box on top right click mask with shape and here is the image masked so I can align this now in here I think I made this box slightly smaller let's do this and now that we have the image inside I can double click make sure I line the person the way I like it just like this I would say okay make sure that this box has no border like this and this is pretty nice actually maybe now obviously we're gonna have to send this to the back and we're gonna have to this is why I was thinking that we either have to move the model down or we're gonna have to do like a white background in here which is totally fine to do too let's align in the middle in the middle okay perfect so this is totally fine and the next bit obviously we need to transfer is the title like this so I can copy and paste this put it around here and Adobe XD should allow us to literally scale this down holding shift and make it look like this and if you are worried and this is usually a hot button I'll probably remove this now but let's leave it but if you are worried that this is hard to see on some images of course we can add a white background maybe like this I know it's not the best we can do this maybe like this put the opacity down or maybe we can move this entirely outside here so there's so many ways that you can explore so depending on your image you can do all sorts of things I'm gonna leave mine like this to speed up the time I'm not happy with the extremely happy with the button it looks a little bit small maybe but let's go with it or maybe the button can be like this in the middle here and maybe make it bigger like this let's see if I can shift resize the button no okay that's fine I can align it maybe we can align the button here in the middle you know there's so many ways we can do this I think this is pretty cool as well so yeah I'm not too sure about this so I'm gonna move it up and leave it for now and the next bit that we need to do is obviously replicate those three boxes and they're very easy to do copy paste move move it like the amount of spacing that you want let's say 30 pixels shift and scale down make sure that the fonts are still readable in here because Adobe could mess up with them so in here maybe this font can go down I don't know maybe that's too small it's up to you to decide like this and I think something like this might work maybe we can left aligner now whatever you like and to be completely honest I'm not I think this font looks very bold now compared to the heading so I don't know whether we will need to overpower this with with like a border font let's say bedroom and and so on I don't know I'm not too sure about this so this is the way you'll do anyway I'll probably so I'll probably choose a font that fits better and because we made this as a component in here I can change it and this will change everywhere on the whole page which is good but anyways the only thing that I notice is that we didn't do this and I'm pretty happy with this now and maybe we can even make a cool effect and make the woman look like this I think this is pretty cool and we can allow for more text from here like this what's happening with this text like this you know I think this looks pretty cool as well so many options in here let's get this aligned and so on so I would do exactly the same with the man section copy paste paste in there let's copy the image of the female of the pan pasted in here so we don't have to mess with it too much obviously we need to scale it down like this I think this looks cool and also we will have to extend the outboard as well double click on the outboard extend down down and keep on working on this so let's change this to man and let's change this to man and so on and the next section will be the woman's best seller I would literally copy this make sure paste it make sure it goes in here and I'll probably at this point make sure that this that this text here which is now 19 is the same as this one so 19 so this text needs to be the same as this one so they equal and this text needs to be the same as the other one and so on so this will be 14 maybe like this make sure that they're centerline and so on and we're losing some text in here let's make it like this and I think the line spacing is quite too much in here so maybe put a 16 like this and put equal spacing between the elements and so on I'm not putting much details in this as you can see but I just wanted to speed up the process let's copy this element here paste it we're gonna have to resize this a little bit like this you know he wants now probably maybe because of the sale but that's fine we can literally just make the image slightly bigger and that would do but this is quite a big image so instead what I'll do is actually I'll move this here I'll probably probably make the image slightly smaller and like this and then I'll move everything like this and then we'll continue with the rest of the stuff with the rest of the website exactly the same way obviously this is a very quick demonstration how I'll do it I'll probably spend a little bit more time to align everything and so on but you get the idea now I think the desktop version is looking pretty cool and that's everything from this tutorial I hope you liked it in the next tutorial I'm going to show you how we can develop this and don't forget to subscribe to my channel comment below smash the like on this video and if you have any questions if you have any questions yeah please comment below so I'll see you in the next one thank you very much for watching


This idea of changing the world might seem like it's really idealistic or lofty But it's not as difficult as people might think. I think it's Important for people to recognize exactly what this looks like. Yep We've been working with our on-campus students on how they can change the world Thomas has a really cool one. Now. He has a part-time job at the university His job is to travel around to high school Students around the state and give them a taste of what it's like to be at university Now after taking think 101. He's realized that he's taught for the last couple of years Hundreds of students Ineffective learning strategies for for how to learn now his change the world project is to convince his boss to Allow him to teach evidence-based learning strategies like we covered in episode five learning to learn To give students a head start in moving towards university. That's right Lincoln is doing a cool project as well on scapegoating now Kind of blaming someone or some group for something that might have happened, but he's actually flipping it on its head He's looking at systems like Climate change or the global financial crisis that don't have Agency they don't have a face right so when you're trying to motivate people to do something about climate change It's hard to do because there's nobody that you can point to nothing that you can actually Direct your attention toward and so he's trying to figure out what you can do to change These agentless systems into something with an agent to motivate change. Yep. Yep. Hannah is is one of my favorite projects I guarantee it will work She works at a pharmacy and they hire a full-time Nashrop path, but she wants to give people her customers the tools to make Evidence-based decisions for themselves So she's come up with an idea to print these business cards that have a whole bunch of websites and tools that we discussed in previous Episodes like the Cochrane library to give people the tools to to take control of their own decisions to look at the evidence For treatments and drugs and decide for themselves. What's going to work? That's right so those are just a couple of examples of things that our students are doing but they're The 200 people in the class are doing some really cool things like creating infographics or launching Facebook or social media campaigns They are writing letters to the editor To magazines figuring out the best way to to fund charitable organizations. That's right petitioning governments Yeah, right they they're writing letters to to newspapers to magazines, right? This is what it looks like. It's not as difficult as it might seem But if again if something sucks if something's broken don't get angry, right figure out what you're going to do about it and What we want the people to do in this class in think 101 is the same thing instead of you know getting angry or Feeling like you have no control Taking a little bit of time and doing a bit of research and figuring out what you're going to do about it and Then sharing that with us. So after the course is finished We have three weeks for people to change the world and then we want them to show us to record a video no longer than three minutes and Share with everybody Exactly what they've done. Yep, and it doesn't need to be elaborate the video could be as simple as taking your iPhone out or smartphone and Looking down the barrel and telling us what you've done over the past three weeks to at least start to move towards changing the world Tell us what you've done. You can sit down in front of a webcam at a computer And there's all sorts of software tools that are available that can assist that so right at the high end you've got things like Adobe Premiere Pro or even iPhoto and right at the low end. You've got a really cool Tool called Adobe Voice. Yeah, Adobe Voice is actually fantastic. It's a matter of Just for the iPad I think at the moment But it's just holding down down a button telling your story. So it's just your voice and then dragging in photos Music and it's it looks amazing and that's exactly what it's designed to do. There are other pieces of software like Screen flow right as we said Premiere Pro things that we use in this course to film our episodes That's the high end, but at the low end. It's just taking out a Smartphone or a laptop and and just sitting down for five minutes and actually just telling us what they're often free programs as well Like Microsoft Movie Maker YouTube capture and is another good one. That's right. So Net once people have done this we want them to actually upload their video so it's a matter of going on to the next section that says upload your video and Click the select video button and point to the file right and upload it. It's that easy We thought very carefully about the channel. That's right Alternatively if they use something like Adobe Voice or YouTube then it's a matter of sharing the link and so we provided a link Spot as well. Yeah, so I think it's going to be pretty fantastic The exciting thing about this is hopefully we're going to have hundreds maybe even Thousands of submissions of people just spending three minutes to tell us to show us how they've they've changed the world And we're going to put all these together we're going to showcase the work that our think 101 students have done and It's gonna be awesome


Conflict restructures societal relations and it affects how civilians view the state and contribute to society. Without rebuilding social contracts, the risk of war and violence remains. The link between trust and conflict is a circular one. First, lack of trust on the state and lack of state legitimacy, it's going to create conflict many times. But secondly, the state many times also is part of the conflict. So the state is not only not protecting the population, but also sometimes they are attacking some groups of the population. And third and very importantly, so when the conflict is on, the state is not able to have presence in many regions of the country. So they are not providing services such as education, such as health and such as protection. Breaking this cycle between lack of trust and conflict goes through several stages. First, during the peace process it is important to include all groups of society so they feel that peace is legitimate and the state is legitimate. Then it's very important that the state quickly provides state services to the population and establish presence in the territory. So a state that provides education, health, protection, security and justice and allows the participation of the communities is going to be a state that is perceived as more legitimate. Democracy is important so that people feel they are part of the solution. If people don't feel that they can participate in state building and in providing state institutions, they won't feel the state is legitimate and they will not be contributing to state building. Improving the life of people implies improving the economic conditions of people, the social conditions of people and them feeling included in the society and part of the society. That's a complex task but it can be reached.


Certainly, probably the first thing that went through my mind is how proud we all were for her. The second thing was, how does somebody do this twice? We all knew that she had sort of crested into being one of the premier players on the team.   She does it with defense, she does it with unselfish play. She makes everybody else on the ice better. And this time the tables were almost set the other way with five minutes left.  I don't have words to describe that good fortune or that ability because to do it once is a miracle. This is something I can't describe. My first option was to cheer for USA Hockey. Maybe the Terriers could all get two goals and it'd be a 9-8 USA Hockey win. But if that's not going to happen, you know, her success or the kids from BU shining good light in Boston University is the other side of the coin.


Hey, I believe I am live. Hi guys, this is Dr. Nian C.D. We're starting with today's free training on your resume review. Can you guys hear me? We should be live on both YouTube Live and LinkedIn Live. If you like with me, comment on the chat to say hi. Where you from? To say hi so that I know we are live. And at the same time, let me see. Jeff from YouTube, how are you? Yeah, everybody just say hi in the chat. Good morning. Hi, so I know I am live and trying to see we should be live on both portals. And yes, I am live on LinkedIn. That's why it should be working on LinkedIn. Awesome. So if you like with me, comment to say hi on the chat so that I know we are live. And we had some challenges earlier to go live. So we're two minutes, actually five minutes behind. But anyway, we still have time to finish everybody's free resume review. Awesome. Okay, so I see we're live on YouTube and LinkedIn. Hello, hello, Emmett. Awesome, awesome. So great. So we're live on both platforms. Let's start to do a quick introduction. Hey guys, this is Dr. Nian C.D. a director product featured in Forbes. I also have helped 1000 people land a dream PM job offer in fan companies and unicorn startup. And I just came back from my maternity leave and actually was feeding my baby right before this live training. And glad I can still make time and also meet everybody and also thank you for your time to join me live as well. Now, this is pre-event training for our upcoming masterclass tomorrow and Wednesday and later this week. What is pre-event training for people who register for the masterclass and you already received an email regarding we're giving free bonus for people to review their resume live. If you stay until the end of the masterclass and this specifically is make sure that you have your resume ready so that during the masterclass where we are going to teach you how to create a product portfolio. So once you finish, you have three things ready.  Awesome. Okay. So, all right. So for people joining me, here's the instruction send me your resume. Let me share my screen with my email address. So you can see my contact information right here. So I shall know. All right. Can you guys see my screen? I think it's working. Let me confirm on the platform. You should be able to see my screen. Okay. So let's continue. Here is the instruction send me your resume. Let's skip all the prep. So this is how we do it. Okay. Everybody pay close attention. Today we do live resume review to understand what's wrong with the resume and how to grab the key to the product manager resume so that you can 10 times your success rate getting your interview. So email me at nancyadocnancy.com. When I'm not live, you can email info at pmxcelerator.io. Okay. Either one is fine, but right now I'm live email me at nancyadocnancy.com. Okay. Cool. This is nancyadocnancy.com. This is the email. Everybody email me and your title. Your email title should be free resume review and also the date you registered for the masterclass. Okay. If you already registered for the masterclass because of pre-event training, we send an exclusive link for people who already pre-registered. So we get priorities and we're trying, we'll have 45 minutes today. We're gonna go through as many resumes as possible. If you already registered, just say that the date, for example, pre-regime review, register in masterclass on ABCD date. You put the date in your email title and attach your resume. Okay. So this should be straightforward for everybody and send over to me. We're gonna get started, pull off the first resume. Make sure to mention the date you registered for the masterclass. For people who don't know what is masterclass, here is a quick review of this one. Go to darknancy.com. Let me just go to website. So you know what I'm talking about. Okay. On my website, darknancy.com slash masterclass or you go to darknancy.com homepage. And then there's a big button as soon as you go to homepage, hey, check out our next masterclass just right here. Same thing. Okay. So in the masterclass, we teach you how to create a portfolio in two weeks even if you have been laid off or you had zero PM experience. All right. It's right here. And select the dates, you plan to register and we also have different time coming up later this week as well. Just tell me which day you registered and then attach your resume. And we're gonna get started with people who already registered because the bonus for the masterclass is free resume review when shop lives. So whenever people come here, we wanna make sure we finish the resume before they come to masterclass so that you have your resume ready. You also have portfolio ready. You also know how to pitch yourself to the hybrid manager using the 30 seconds at a bit of pitch framework. So we're gonna do three things together. So just email me your resume and let me know and then I can pull up people's resume. Cool, cool, cool. So I got the first resume. Our key have you registered for the masterclass? If so, please reply to the email regarding which day you have registered. Everyone, you make sure that you mention which date because we prioritize people who already registered. Usually we have like a lot, a lot of people want to review the resume for free. Okay, so here is what we do. Let me start sharing and also say hi. In the chat, so then no, we, the signal, the live stream signal is actually being streamed to both platforms successfully. Cool, and I see on YouTube, Rach Amit, currently enrolled in QA engineer, awesome, awesome, Arch, and Jeff, how are you? Let me see who else is on LinkedIn. Pachi, okay, cool, how are you? Yes, email me your resume. Tell me when did you register? Oh, here's the link. The link of the masterclass is in the description of this video. Let me also put it in the Discord channel so then you know where to find it. People ask what that is, which is our upcoming free training regarding part of portfolio. I put it on LinkedIn. Let me also put it on YouTube chat so you guys can see it. Okay, so now let me share my screen. You'll have several resumes come in already. So tomorrow session, okay. Arch is signed up for tomorrow. Okay, great, cool, yeah, just replying to me regarding when did you sign up, that's all I wanna know. So we got priorities. We're gonna only have 45 minutes today. Okay, Archie, so you guys can see my screen, I assume. Right here, oh, by the way, let me do this. This is my email where you can directly send me your resume. Right here, let me post it in the chat. Comment of YouTube and LinkedIn. Let me go here. Okay, so you guys can directly email me right now. Right, so let's get started with our first resume review where I am right now, right here, all right, make sure to, the email title should be free resume review, the date registered for the masterclass. Okay, so that we have priorities. Now let's do this. Archie said, financial three years experience, specialized in cutting a speed to be product for enterprise customers, very cool. APM, ATTAC, India, and... Is this the title senior ATTAC specialist? What is ATTAC? You do as comment on the chat. Do you mean you run as for other people? Let me see this resume. So, a social product, yeah. They were designed system. Whoops. Okay, yeah, for requirement, and 10-point manager life cycle. VK resolution, in-depth user. I think this is good. You only, there's only one thing you're missing, which is the strategy. Did you work on any part of strategy, go to market strategy? If so, you should add it. But in general, this is good. But the part I don't understand is ATTAC. What is ATTAC? Come on the chat. Let me see. What is ATTAC? It's weird, right? What is ATTAC or ATTAC? Let me refresh. Let me see the comment. I couldn't see the comment. In like, what is ATTAC? Come on the chat, Archie. Hold on. Let me pull up the chat from the back end. It's loading slowly. Oh, morning, morning, morning. Okay, so your comment is building an S product and managing S campaign. Then why don't you call yourself product manager or something? Your title is ATTAC or I don't, this is confusing. All right, so you can call yourself, let's say, as product owner, as product manager or as something or make it more obvious than ATTAC. This is weird. Okay, engineer the new S product, managing revenue, 20% la la la, conduct comprehensive, SQL, Dorado, collab with sales, GTM. We have code and then for stakeholders and the implementations and so on and so on. Oh, I like this resume. I don't know about her specialist. Okay, contemporary user, personal opportunity and by analyzing some individual that are currently with stories. Okay, cool. I saw three user stories, so little. If it's three, just don't mention it. Okay, sounds so little. Sounds like it's so entry level three. Engineers can finish it in a week. Three user stories, okay. It's change the title and down below. Now I understand why you said you're doing the, you're creating the ads campaign for other people. It's very obvious. You're actually creating campaign because it's more operational based on your description here, but I do like AB testing. The thing is more bigger problems of title and also the strategy part of your first session. Okay, you also had different kind of experiences. This is great in general, this is a good resume. Good job, good job. Cool, clearly you watch our prep training. Okay, so let me show you the keywords and use. I forgot. Some of the keywords is the leadership type of keywords I want you to use. This one, this video has all the keywords you need. Go to my YouTube channel, the keywords right here. Must-have PM resume keywords. This one has all the keywords you need. Some of the keywords you are missing is gold market strategy. All the strategy plays a key words. Okay, in your first experience. Okay, great. So let me go to next resume. Okay, Tanya, good job. Okay, so hey guys. Tanya did a good job. Just let me describe this to you. Her email title is free resume review 11th March. So I know she registered for the masterclass for 11th and then she's getting free resume review. So make it very clear because we only have 45 minutes. I do want to prioritize whoever registered for the masterclass. Whoever didn't register, we'll see if we have more time towards the end. Okay, cool. Let me share my screen. Summation, part manager, spearheaded. I really hate spearheaded the words. This is consulting keywords which we don't like because too fluffy. If you lead a team, just say lead a team of two people or lead a team of two people instead of spearheaded something. It's all the consulting keywords, something we hate so much. Okay, because part manager and consultant is a two different career paths and lots of consultants, they just took it for granted.  No, you cannot. Okay, unless you have a specific training and also understand how to translate your experience into PM. So therefore, whenever we see consulting style keywords or this consultant wanna become PM, he doesn't have end-to-end PM experience. I wouldn't like it. Okay, if you lead somebody to say you lead a team of two PM. Implement launch power PI, show customer relationship, expand processor. See, for example, this is confusing. This sounds like consultant because you only talk about one aspect. You did power PI and you presented different things. You did, this is impact, expand the search, you drove the improvement. So again, so this sounds like consultant because part manager can drove the improvement. Consultant can also drove improvement. What do you mean, right? So part manager way we drive improvement is by interviewing customer, creating roadmap, working with developers to create the specific features and then conduct user interviews and also doing a beta launch, all of this, right? This sounds like consultant, you just put your own title or part manager, but everything else sounds like consultant or people are guessing, is this a consultant or is it part manager? So that's a problem. Collaborate this, we like collaboration, launch this feature, did AB testing. If you lead part manager, why there's no leading, creating long-term product roadmap, something's missing, right? So this resume sounds like putting a bigger title, but it's not, your responsibility doesn't match your title. That's a problem, okay? Feel free to change it. That's the main problem, you must change it, okay? Cool. So let me come here and go to next one. Archie, I got your resume, I saw your pain point. Weird is, oh, you didn't mention when did you join the master class? Let me know or sign up. Let me go to other people who already signed up and then it's more straightforward. Entrepreneur experience sheet, did you sign up for master class, whoever joined late? So let me do a quick review. This is a fusing for everybody because I can't prioritize, part manager would prioritize every single day. Okay, so everybody here is how you sign me to resume, you email me at Nancy at darknancy.com. Okay, in your email title, should make it very clear, your email title should be resume review and the date the registered for the master class. What is master class is this one, you go to darknancy.com slash master class or go to homepage darknancy.com and then this button goes here. Okay, we will teach you how to create a product portfolio in two weeks and then even if you're late off or you have zero experience. Okay, so that you know how to use a product portfolio to impress the hybrid managers. So now here is the drill here. So as when people register for the master class, we give them free resume review. So that's why whenever you show up, we prioritize you. So that's why you should directly tell me when did you register for the master class? Okay, so for everyone else, stay entertained because when a priority has people already registered because this is a part of what we do. And the purpose of you, we doing the live resume review is following once we wanna make sure that your resume is ready, your resume ready. And number two, once your resume ready, you directly go with us to go to the product portfolio, which I'm gonna give you two different examples of product portfolio and different tools. You can create product portfolio and also teach you the networking secrets, how you're able to get higher response rate, significantly higher response rate from hybrid managers. That's what we cover in those master class, right? So therefore you have three things ready after master class, you can directly go out for job hunting. So that's why it's important for me to understand did you register, when do you register so that we prioritize people who registered so that you have the three things ready and after master class, you go out for interview, okay? Or job hunting process. Okay, so make it very clear to me, make it easy for me, okay? And let me, once we finish, we'll just go through everyone's resume. Let me do this, let me hold on. Archie, Tanya, who is, let me do this. She, you can directly respond to my email regarding when did you register, so let me pick this one now. This one, this is Galba, Graba, and as I'll read the other strategies, leadership, accomplishment, benchmark, let me see, two pages resume, let me see, strategic man, leadership, accomplishment. A gap increase in the leadership cross-functional collaboration. This resume is kind of weird. So this is all your accomplishing, you put all the accomplishment in one page. I don't have to put accomplishment in one page, it can match when did you do it. Okay, so head of product in India gap, this is great, the director product, her functional team answer the image, the agile transformation. You're missing strategy keywords. Actually I'm launching a video tomorrow regarding the differences between entry-level senior PM and also director VP, product position, and this is, where's the strategies as the director should talk more regarding strategy and how many people did you manage under you because you're a director, right? So that's part of this missing. Associate director, great, you have been in leadership position for a while, you're associate director, higher nurture, how many? So you didn't say how many, one, two, or 20? That's make a huge difference, okay? Integrated API with, okay, so here's the problem with this resume. It's all achievement-based and also you have the whole page talking about achievement, okay? If you have a whole page talking about achievement, I wanna see what exactly, what kind of strategy have you created. You are repeating yourself in this resume. If you wanna talk about achievement, I will just move some of achievement under the real experience. And then you talk about the roles responsibilities because the autumn, I wanna see strategy type of work, having it and roadmap, having that either and how many people you manage wasn't clear either. I think the resume itself is the information is mismatched in different places. You put everything up here. No, I wouldn't do it. So that's the main problem with the resume. So it's hard to read and you're missing what do I mean by direct level? Okay, so please rewrite your resume is when I read is kind of confusing. Cool, cool. So now let me pull out my next resume up. Hold on, let me go. Let me, am I sharing the right screen? Oh, this one. Me, I make sure I share the right screen. Cool, so let me do the she, comment on the chat. What type, which date did you register? Okay, so people comment. How can, can you please remember my resume? Okay, yes. Let me show you how to send me your resume, okay? For people who joined late. Let me show you my screen. First of all, remember this website, Doc Nancy Lee because I'm gonna use it right after this. Let me go here. The slides, okay, great, cool. Here's my email you can send over to me. Send me your resume right now when I go live with Nancy at docnancy.com. When I'm not live, you can email in for a PMSR to dial. Okay, either one works. When I live, do this one right now. Nancy at docnancy.com. So email me your resume right away. Okay, right here, cool. And in your email, I think some of you guys did good job. Earlier in your email, make it very clear regarding the title should be free resume review and also the date you registered for the masterclass. What is the masterclass?  The homepage, there's a click button.  Either way, it's fine. Okay, to docnancy.com again, you can get all the information. So in the masterclass, we do three things. We wanna make sure that how to create a key department manager portfolio in two weeks so that you have two different type of product portfolio examples and five different tools you can use to create your product portfolio. Okay, we teach you there in an hour and then before you come here, we want you to have your resume ready. Okay, so that's why we're doing this live for your resume review. Okay, so you have your resume ready, review your resume and also when you register for the masterclass, you also receive the link where you have the free training to write your resume and with the resume template. Okay, you have everything ready over there, resume review. And then after you have those resume reviews, the next step is, which you go live with me. So we teach you how to improve your resume and then you have your resume ready. When you go to the masterclass, you learn directly how to create your product portfolio and also how to use the networking strategy quickly, learn more interview. So you have three things ready. Once you finish, you can directly go out to do interviews and start your job hunting process. Okay, three steps. Right now, what we're doing is step number one. So that's why I want you to tell me when did you register because it prioritized people who already registered. Okay, just tell me when you can reply my email, when did you registered? Okay, because we have limited time. When you, you have more time, we're going to review other people's resume as well, but the ones who had, you're going to have priorities, we have 45 minutes together. Okay, I put the link. Yeah, I put the masterclass link in the chat. Let me put it on like this one. So we have all the chat you need. And yeah, my email is nianciadocnancy.com. We have everything there. Okay, great. So now let's continue. Let's continue. And let me pull up the next resume, one sec. Okay, she, yes, you registered. Let me see. Which date do you register? Which day? Yes, let me review resume now. So you said, Apple Pay product manager. The other one is for Citibank transformation product. How should I tell you your entrepreneurial experience so resume has seven years gap. So, oh, cool. I see a seven years gap. So let me review your Apple Pay resume. Let me share my screen right now. The Curichit Pro. Oh, this is your entrepreneurial experience, I see. The founder, what is so short? Hackish Gouter Group, what is it? Last mile delivery, okay. VP of products, people of pandemic, okay. You have live insurance, interesting resume. If you're playing for Apple Pay, how is it rather than to like Apple Pay? You really use the resume for now. Is this for Apple Pay? I don't see any, where's the, let me read the, let me read whatever Apple Pay related, rose response, be it a better team, two-year product romance for New York market, so much 10K revenue, not that great, not managed life, Apple Twix is in product, customer interview during proposal pricing, hold on, hold on, hold on, hold on, hold on, hold on. That's weird. This person may be weird, I'm essentially reading this. The manager banking, the advice founder, senior manager, budget oversee, N2N there is a successful implement also right now. No, no, no, no, no, no, no, no, no, no, no. To be meant here, my pen engineers. Hmm, this, let me tell you what's wrong with this resume. It's kind of weird. It's not American style of resume, that's how I summarize it. It's not American style of resume, because this is fine, you did roadmap, you managed life cycle, proposal, different things. I want to see, so you start established partnership. Can you talk about product strategy? Partnership maybe is part of the strategy. So you describe it as what you did. You didn't describe it as I'm creating a product strategy, I'm creating a go-to-market strategy. The strategy part is weaker, and especially have VP title. If you do VP title, you better do some more strategy related initiative, open up a new company, new market, things like this, right? Okay, financial operations. It's fine in doing financial operations, which has less to do with PM, which is kind of weird. I want to see more product for some operations. Do you help to create entrant product management life cycle, or you maybe help one part of product management life cycle you should highlight more? If you didn't do much about PMs and spend less time talking about what you did with operations, it's very weird. This resume, it's not American style in summary, here's what I'm talking about. Okay, so the founder, if you're a founder, can you talk more regarding the impact we're talking about? Now, here's another thing. If apply for Apple Pay, how come there's no payment keywords? Or at least maybe it's embedded somewhere else, but it's not obvious. This really to Apple Pay at all. The payments in whatever integration, I don't see any payment. Oh my goodness, I didn't see it. So the resume need to be rewritten, re-change everything. I think it's main thing you are missing. I think you spend lots of time in China. The American style of writing resume, working, what is the product management? It's very different based on how you present it here. Maybe the style in China is more operational based jobs, but in the US it's different, maybe. So it's very different. Weird, weird. Okay, Pachi, yes, I got your resume. So you joined for Tuesday mass class? Okay, cool. Let me share my screen. Okay, can you guys see my screen? Okay, here it is. A drop to the PhD candidate, congratulations. You're getting a PhD soon. I got my PhD years ago. Your school is really good. I like it. Design, dah, dah, dah, dah, dah, dah, dah, dah, dah. Assistant, visiting research, dah, dah, dah, dah, dah, dah, dah. Hmm? What is no product related keywords? Are you looking for PM jobs? Completely off. Completely re-write your resume, please. Completely, completely re-write your resume. I got PhD as well and I became a product manager. I believe you can do it as well. Okay, but you need re-write your resume completely different. For example, as an example, right? Study this kind of fuel cells and the type of catalyst. What does this mean? Did you propose new product features for your fuel cell product, right? Or did you understand the performance and KPI of a great fuel cell product? So everything you describe is I studied it. There's a plain description of what you did. You didn't talk about what the impact, what does this mean related product? Okay, I want you to go here. Go to my YouTube channel. Doc Nancy Lee, search my name. Doc Nancy Lee, director of product. You come here. Okay, go to my YouTube channel. All right, in this video, you're missing the foundation. Okay, I want you to watch the basics. Example, appointment to resume tips with no experience. You must watch this video and then watch other resume videos and the playlist.  I think you're missing what is product management to do. Okay, so in that case, watch this product management with no experience, how to become PM with no experience in this playlist. You'll have many, many different type of videos that film in the past, roles responsibilities of a PM, top skills, product management, a six essential skills become product management. I see you missing the foundation. So it's kind of weird how you put your resume. You're missing the key aspect. Okay, so let me go to next one. Let me also see the comment in the back end. Let me see, Samma, you wanna send me your resume? Okay, yeah, here's again, quick overview, how this work, yes, you can send me your resume and here's instructions very quickly. Number, oh, I shared the wrong thing. This wrong path, let me share this one. Where's this one? Resume, go here. Email me your resume, Nancy at docnancy.com. Here's how you send me your resume, Nancy at docnancy.com, number one thing. Okay, and in your email titles, say free resume review and the date you registered for the masterclass because the masterclass is here. You go to docnancy.com slash masterclass. You can register, tell me the date because you get prioritized, okay. In the masterclass, teach you how to create part of portfolio within two weeks and with two different part of portfolio examples and five different tools you can use.  Okay, so therefore, just tell me which date did you register, you can register here, pick the date and we also have more date later this week as well. Okay, just tell me a date in your title, okay. Now, let me do this, let me review this. Yeah, so this will do, okay. Parchee, let me go to next resume. Pull it up. Nice. Tina. Rajiv. Well, I'm not gonna review resume because your email title is request review my resume and then in the description, there's no message in your description and I think your email title sounds very weird and rude as well with zero description in your body of the email. Sorry, I gonna push you towards the end if I'm gonna review yours but I prefer someone who's more polite and for instructions in the email title so I can easily filter people's resume. Okay, so now let me do next resume. Persona, let me see. Persona, did you register for the masterclass if so reply to email, let me know when. Okay, at the same time. Wow, you send me your diploma. You don't need to send me a diploma. You don't need to send me a diploma in your, in the email. I trust you, I trust you graduated. Okay, so let me just review this resume. He's very sincere, send me his diploma, graduation diploma, you don't need to do it, just. Okay, follow instructions. All right, free resume review, when you register for the masterclass we'll get you prioritized. If not stay until the end. We only have 45 minutes together today. Okay, we're almost over. So 10 years experience in this and this experience all stages of development life cycle train, wow, so much, wow. What's going on? Oh, that's a five pages resume. Oh my goodness, okay. Five pages resume, remove your summary up front, way too long. Summary means it's short for people to read. If you put everything up front so long, it's not a summary anymore, okay. And then now let's look at your job experience. Huh? IT manager application. Wow, this need to be rewritten completely. Data testing, okay, oh my goodness, way too much. Okay, completely change this, complete, 100%. Please rewrite, please rewrite completely. Too much information. You only need maybe five bullet points, maybe six bullet points, show me your impact and show me the things related to product management, right. There's so much going on. Okay, so now please, please go through this playlist. How to be a product manager with no experience. Okay, learn what's product management as a foundation and then there is a playlist of different kind of resume keywords. How to write a resume with specific examples. This resume need to be completely rewritten. Okay, 100% illiterate. This is way too much, it's a five pages. People cannot be clear. What kind of job are you even looking for? Too much going on. Okay, please completely change it, okay. Ah, okay, so let me read the comment, this is another comment. Okay, she on the comments, on again saying that they have a feedback. I see you're very much on point. I had worked in the seven years for seven years. However, my team founder are all from China. So the all Chinese, I like how you say style is not American style and very weird. Do you have any suggestion how it can change that? Yes, to change back to American style. Let me show you. Let me share with you what we do. And right here, watch the playlist. Okay, looks like you already have entrepreneurial experience. By the way, entrepreneur can easily become a product manager for sure. 200% and actually lots of companies they prefer entrepreneurial experience. I'm going to actually tomorrow film another video regarding how entrepreneur can become a product manager. Okay, so go to my YouTube channel and turn on the subscription button and turn the bell button. You can notify once we launch the new video. But for now, watch this, these four videos which I gave you examples of what American style resume we're looking for. Okay, I believe you had the experience just like sounds very, just not American style. It's weird. American wouldn't write resume that way. Put it this way. It's like, the whole thing. The whole thing, if you're like, American wouldn't write resume that way. So go to the playlist. You can see examples how I would write it. Okay. Cool. Yes. She, yes. Are you, I had a long time seeing from the right mentor. Yeah, welcome, welcome. Feel free to go to our master class. If you wanna be coached by me or take some free notes from our master class as well and go to go there, go to this website, docnancy.com and register. Okay, I will see you. I see you register already. So I will see you in my next master class. But now let me review other people's resume. Let me do it fast and how should I review yours? I think I'll review everybody's. Have I reviewed this, Grava? I think I did. The director, was he the director? Yeah, yeah, yeah. Yeah, I reviewed Grava's resume. I think I reviewed everybody's. I reviewed Grava's resume. Let me read out the name, Tanya. I review yours. She, I review yours. Pachi, I review yours. Prasang, I review yours as well. The only person they review is Pajif. As I said, your email sounds really rude and there's no body of the email and email titles as I request to review my resume now. No, sorry. We do free things for the communities and I don't accept anybody talking in a very rude way. Okay, cool. All right, so looks like I review all the resumes, whoever sent it to me. If I didn't get yours, likely go to spam folder. I don't know, but whatever I received, I review except one rude person. Okay, cool. All right, so this is perfect. Let me see any questions. Put your questions in the chat. Let me read the questions right now. I think I have seen everyone's comment. Cool, awesome. Okay, great. All right, so looks like I have reviewed everybody's resume, whoever sent it to me. Best luck everybody who already registered for the master class. I'm gonna see you tomorrow and Wednesday. Okay, if you registered for the master class, you didn't get chance to submit your resume in time. Join me next week, okay? Just make sure your email, my team make it very clear the date you have registered. I'm gonna review your resume next week. Okay, so see you right in the masterclass is docnancylee and go here, docnancylee.com. You can get all the information you need and also join us for a free resume review next week as well. All right, and also share this video like this video, like this video and share this video with anybody who needs free resume review as well. This is docnancylee. I'm gonna see you soon in my next live training. Also whoever registered, see you live in our live masterclass. Talk soon. See you guys, bye.


I remember there was a meeting I went to in the Air Force that was a four star general making a decision and everyone left that meeting remembering his exact words, but we all came away with very different impressions of what he meant by those words and that really caused a lot of problems among all these different organizations for months afterwards. So it's not enough just to state what the decision is and document it, you've got to have conversations about what it means for everyone going forward.