Here's a fun exercise on type personalities. 1
I have wrote out seven different phrases in this Figma file. 2
Go ahead and get to this Figma file 3
you'll see in the resources of this video. 4
I want you to choose the typeface for each phrase, that you think is suitable for it. 5
You can use either fonts that are installed on your computer, or Google fonts that come with Figma. 6
Google fonts is a great repository of a lot of free, yet beautifully designed fonts. When you click the font 7
selector in Figma, it will give you choices of both: the fonts that are installed on your computer and 8
the Google fonts. Choosing fonts right from this dropdown is not very useful, because it doesn't give 9
us a visual display of how the font actually looks. 10
What we can do instead, is to go on fonts.google.com and find the right typeface there. 11
So for example, for the "Fitness Coach", I would look for a typeface that is strong and bold. Possibly something 12
that looks good in all CAPS, because that's how fitness associates to me. It's muscles, rectangular shapes, 13
not round, smooth shapes. 14
Right? 15
First I'm going to type out my phrase in here, 16
"FITNESS COACH". In capital letters, because that's the style I want to check. 17
This makes looking for the right font much much easier. 18
I can instantly see how my text looks like. 19
Now I'm going to refine my search results. 20
We have different typeface categories, quite similar to what we previously discussed. 21
The Handwriting category is the same as the Script category, that I've explained in my lesson. 22
It's just a different way to call the same thing. And we have this extra category called Monospace, here. 23
Monospace fonts are those where each letter occupies the same width. Look at the latter I for example, 24
it's the same with as the letter T, but in most other fonts that's not the case. T is almost always wider 25
than the I. Monospace fonts are generally used for typesetting computer code. It gives a lot of readability 26
and distinguishes characters from each other. Which, you know, in code obviously is super important. To make 27
sure that I is not mistaken with L, and then O is not mistaken with zero. Anyways, Monospace typeface 28
isn't what I want for a Fitness Coach, so I'm going to deselect it. Neither I want handwritten typeface, because 29
they don't display seriousness, strictness and power that I want. Nor I want classic looking Serif fonts 30
for that matter. 31
Okay, so Sans Serif and display categories are a good place to start. 32
I'm also going to adjust one more filter, which is the thickness. As I mentioned, I want it to be bold 33
and powerful looking, so I'm going to increase the thickness a little. 34
This will show typefaces that has heavier style options inside, like Bold or Extra Bold. 35
Alright, now as we can see I have a lot of good options that are quite suitable for the Fitness Coach. 36
Look, Monserrat is excellent option. 37
It's heavy, strong, bulky looking, just like muscles. I like how balanced and symmetrical is each letter. 38
Some of the other options aren't a bad choice either, but this is quite great match. Before I choose 39
this, 40
remember what we need to do first? 41
Exactly. 42
We need to read the manual of this typeface. 43
Let's make sure that the designer didn't intend this typeface for something, that conflicts with fitness 44
coaching. 45
So it says, it was inspired by urban typography. 46
That's pretty suitable for us. 47
It even mentions the keywords like work and dedication. 48
Well, isn't that just great? Work and dedication is directly relatable to fitness coaching. Done. 49
That's our font. 50
So, now we can apply this font to our phrase in Figma. 51
Just to note, Figma files that I share with you, 52
they're supposed to duplicate automatically, so you get the copy of it in your account. But if they don't, 53
don't forget, to go to this little dropdown by the name and then choose Duplicate it into your drafts. 54
If it's already editable that means it automatically already duplicated. 55
But if it's not, if you're trying to select something and if you see that it's not selecting, or it's 56
not editing, that means that you are editing mine, you are basically seeing my original file in a view 57
only mode. 58
So, from the font selector, I'm going to select Montserrat. As a default, 59
it will be in regular style but I want it bold and thick, so I'm going to select its boldest form, which 60
is called Black. 61
Also I want it to be Uppercase. 62
Of course, I can type it out one more time with my Caps Lock on. 63
But there is an easier way to do this. 64
This link here opens up advanced type options and there we can select Uppercase. 65
This way, no matter how I type my text, caps or not, it will display in Uppercase. 66
This is also where you have Underline option, if you need it. 67
In this box, I want you to explain your thought process on why you chose the font. 68
So in my case, I would write what I already described. 69
Don't skip this last step. To become a designer, you have to start thinking like a designer. To actually 70
have a deeper understanding of every step and design decision that you make. And actually clients, 71
your clients will definitely appreciate this. 72
I remember they always did. 73
I would send this email with, you know, step by step of major design decisions that I would make. About 74
typefaces, or fonts and things like that. 75
And in the beginning, I liked doing it. But then I kind of got lazy. And when I didn't write these descriptions 76
of my thought process behind it, revisions increased. Because now they didn't trust what I had made 77
a choice. And they wanted to review and, you know, change fonts or change colors or things like that. Because 78
they thought, I just picked them out of nowhere. 79
So definitely practice this. 80
And then, when you work with your clients, show them how much thought process has been put behind the 81
scenes.