So let's start with the category screen. And before we do click on the home, right click, locate guides and then simply copy guides, click right here, right click guides and paste guides and it will paste the guides in exactly the same position as it were on the first screen. What we're going to do next is select these two texts. So you can hold your ctrl key to jump inside of the folder. ctrl key once again, Ctrl C, click right here Ctrl V, and what we're going to write right here is sofa. And right here we are going to write in 129 items.

Because this is going to be a category screen and once they locate the category, it will be easy for them to navigate because they will see how many items there are inside of each category. And perhaps maybe we can move this 40 pixels down just so that we can have a bit more room. The between our navbar and our items, and once again moved to nav bar and status bar at the top. Next up, we're going to copy this Ctrl D, move it like so. And we're going to right in price. Control D once again and move it up 10 pixels.

So we want to line them up perfectly like so, and then move with 10 pixels, double click right here, and type in sort by, because this is what they're going to use to sort these items. And what we're going to do is select the down arrow Ctrl C, move right here, Ctrl V, and we're going to position that down arrow to be aligned with our price like so. And we're going to move it until it meets with our guides. Move the price and hold shift and move it 10 pixels to the left. Choose sort by align it with the price like so. And once again, do 10 pixels or you can even align it with the top edge of this text if you want to, like so.

But I found it works exactly the same way, the other way around. So it's 10 pixels, 10 pixels, 10 pixels 10 pixels everywhere, the same spacing, and that will make easier for developers later to work on your design. Next up, we're going to select this image. So once again, you can hold Ctrl jump inside, use the image, and you can also use these two texts. So Ctrl C, jumping right here, Ctrl V, and we're going to align it like so. And maybe we can now move it 20 pixels down from this text.

So shift bottom arrow twice, and now we're going to jump in, move them to be left aligned And what we are going to do now is position and like so. So to the top and hold Shift, move them 10 pixels left, sorry, right and down and do exactly the same for this price. So simply move it like so and place it 10 pixels down. Or if you think it's a bit much, simply hold your top arrow and move it five pixels down, and you're going to test it out a bit later. Now we're going to enlarge it, so it's going to be 157 with 180, like so. And what we're going to do now is group all of them so make sure this is the top this is the bottom, hold Shift Ctrl G and type in for example, item one.

And what we're going to do now is ordered some of these layers because it keeps putting layer at the top. It really annoys me But as far as I'm aware of, you cannot do anything about it. So you can hold this Ctrl G, and maybe type in sort by, press Enter. And we're going to place this right here. So item one. And what we're going to do now is populate all of them and create six, for example.

So Ctrl D, move it right here, and select all of them and control D. So 20 pixels like so control d 20 pixels, like so. And we created a grid of six items. Now we're going to order him so item one, item two. And this is the boring bit. But if you want to be precise for your developers a bit later on and cut your work short, because you're not going to be jumping in and out and communicate with the developer on unnecessary items. Then I really recommend that you name all layers, all your groups or your assets, because that is going to be a lot easier for you then to work on and for your developers to understand.

And they will, they won't bother you because it will be really simple for them to navigate. Because everything is named correctly, everything is named in order. And later down the road when they code, they're going to code as you read basically. So from the top to the bottom from the left to the right. So it's really easy to optimize them in advance, and then just to give them the final files, and they will love you for it because it will cut their work short as well. Next up, we're going to create search filters, and I'll see you in the next video.