Hello, everyone, and welcome back.
Next, what we're going to learn about these options up here in the middle, when you select like a
frame or say like a rectangular shape like that.
So let's jump right in.
So I'm going to select R and I have the rectangle selected, as you can see, and I'm gonna draw a nice
square right in the middle of my little frame over here.
Let's zoom in and you have three options.
Let's go through them individually.
So the first option is edit object.
So I've selected an object and I have a couple of options up here.
I have the move tool.
I have drawing tools like the pen tool that we saw before and the pencil tool.
I also have the bend tool which will allow me to make some really nice curves and I have the paint back
at all.
So I really want to focus on a couple of these tools because you won't be using them all pretty often.
But if we use the move tool, we can select like a point on this square.
And we can move it any which way we want, so in this case, if we move it in, I'm going to make a
little bit of a diamond.
So I'm going to like both points and bring them in little by little.
And I have a diamond.
Now, if I wanted to you say something like the Bentall, I can take that.
And start twisting it any which way I want, I can even make this into a little bit of an oval.
Now, these are really great for making your own custom icons, and we're actually going to get into
this in a later section of the course where we create our very own icons.
But just so you can get used to some of these tools we have here.
So I'm going to do that for this site to.
Not a really nice oval, what we have going here, but.
And we can even select these different points and bring them in, kind of looks like an egg about to
topple over, but you don't need to actually click into here to to get those options.
You can just double click on your shape and those options will appear.
So that's to edit your object the next part.
And when I spoke about the last video was a component.
Now, this is one of the most powerful things about Theama and something that you will definitely use
if you're on a team.
I even use them when I'm doing solo work.
Now, the difference between using components within a team and by yourself, it depends really on the
plan that you're using within Sigma.
Now, if you're using a free plan, you will only be able to use components within the file.
You can't have a component be reused outside of the file.
On a professional plane or an organizational plan, you can use components across teams, across files
and across projects, and we're going into how to do that later.
But this component.
Little option here just creates a component.
Now you'll notice that over here.
Now, this is really great for interface design if you're creating new things that you need to reuse,
like buttons or logos, text, there's different things that you can do and you can recreate.
Now, if you see my component right here, there is four little dots.
And those four little dots basically signify that this is a master component.
So you don't want to touch this one, but if you do want to reuse it, what I would do is I would copy
it.
So I'm going to Kominski and Kamandi now.
I have another component, but this is an instance.
And what that means is this is another variation of this component.
So you can have a file with your main component.
Or a page with your main component and you can have the instance be reused throughout the rest of the
file, in the case of using it within a free plan, like we'll be using it for this project that we're
going to be building.
So let's take a look at that.
So in the assets panel, I'll see.
I have local components.
And you'll show me which frame it is in.
So if I won, this is the frame.
So if I rename this, I can call this components and if I go back into my assets section, I'll see
that those were my components live.
So I have my rectangle one and it's selected.
That's my master component.
But I don't have this component there because that is just a copy of this.
So let's go to a different page.
Let's see how we can use this.
So I'm going to do here is I'm going to go into this frame and I'm going to go into my assets and I
can just drag it over.
And there we go, we have an instance, if we go back to my layers, we can see this little diamond
shows that I have an instance of it and I can delete it if I want.
And that component will always be there.
Now, if I go back and I go back to that original component, if I delete that.
I have no more component's.
Let's go back and fix that, so there's my component and that's how you create components within Fatemah,
it's really easy, really easy to use across different parts of your app.
It's what we're going to be doing even in like the user flow section.
We're going to be doing it when we're creating our very own components for our design system.
It's going to speed up your workflow.
Can you imagine if you have to keep on designing the same button over and over again when you can just
easily go over to the assets panel and just copy and paste it from there?
At least they'll all be the same and they'll all be very consistent and your decisions will be much
more consistent afterwards.
It's a great practice to have a component library for whatever file you're working on, especially when
you're in the final stages.
So we're going to delete this component next, I'm going to create a new rectangle.
So I collect art and click shift and create a square over here.
I'm going to zoom in, so I'm just sliding in.
The next option.
Now, to create a mask and then a copy this, so in case of Apple, I can you option shift?
In drag, and that will drag a new square or you can just do a command and command via copy and paste,
it doesn't matter, but we're going to make one of these a mask, so let's select a different color.
So I went over to my fill, going to select red, bright, bright red.
Now, if I select both of these and I click.
The mask option right here.
You'll notice that.
One of these.
Is hidden while the other one is showing.
Now, if I move over.
You'll notice that the rectangle on the left was actually acting as kind of like a window or like a
frame into viewing this rectangle.
This is great for imagery or if you want to, like, hide different shapes.
So this is a great way to kind of do that.
And if I delete this.
It shows again, so let's do that one more time this time, let's overlay them.
Uses mask and rectangle two is now the mask, and now if I move rectangle three.
You'll see that it is being hidden by rectangles, too.
So really cool way to create masks.
But another great thing, so I'm going to click rectangle again and make another square you can create.
You can use Boolean.
Options here.
So these bullying options or operations are right here, and usually this is when you have two or more
shape's.
Available, if I select all, I'm just going to drag my cursor over them, if I select all these, I
have union selection, I have subtract selection, intersect, exclude, and I can even flatten these.
So if I do a union, you'll see that they're all together.
Now, they're one shape.
If I double click in here, I can pull them out if I want.
But they're still a union.
Now, if I go back, bring that back in, go back, Manzie, and now I have all these shapes again.
You can you subtract.
You can do intersect.
You can do exclude all these different options, and at the end, if you want to finalize your design,
you'll see, like I said before, like, you can access these layers underneath and you can fiddle with
them if you want.
But if you want to access your design.
I'm going to just fix this.
OK, cool.
This looks pretty cool.
I'm going to actually select it, go to my Boolean operations and click Flodden selection and now I
can no longer select that, but now I can edit it like it's its own shape so I can start clicking the
move tool, the bental if I wanted to and go in a little bit deeper.
And do weird stuff like this, this becomes really handy when you're actually using these different
types of tools to create stuff like icons, and that's it for the top bar.