Hey guys!

How are you guys doing? It's been a lot more rainy nowadays here in the Philippines, though I must tell you, It is still freaking warm in here. haha and I don't why or how did that happen haha.

⭐Moving forward, let's now talk about the real deal, TYPOGRAPHY!

Let's cut the chase here guys, I know most of us are busy with our, school, work, and other personal stuff you have right now. Let me just show you guys how "THE POWER OF TYPOGRAPHY" works 😉

I want you guys to read this ALOUD:

How did you guys find this poster?✌️ (sorry about that btw haha. )

See how our eyes were immediately drawn to the middle title? then next on the closest one, then next and last?

That's basically how Typography works. Typography is such a wide subject, but we will tackle the essentials. Like for this one, how Visual Hierarchy is used in typography.

Here's a more in-depth illustration:

⭐HERE'S THE BREAKDOWN:

Your Headline or Title should always be bigger, and bolder than the other elements. You could also use display fonts that could immediately attract the attention of viewers.

*This way, your reader and viewers could immediately determine and distinguish the title from the rest of the elements.
Your Subtext (author name, taglines, or any other supporting details for the title) should be close and a tad smaller compared to the title text. (see image above for reference)
Your Footnotes or headers should be the smallest element in the design. These are usually the "unessential" details about the design. That is why it is recommended to make this element just barely noticeable. These elements are mostly optional :)
This is just literally the same with number 3. Any additional details. (optional)

⭐ADDITIONAL TIPS ON HOW TO FULLY UTILIZE VISUAL HIERARCHY.

The size of your subtext should somehow be 2x lighter in weight and size compared to the header to provide contrast.
Play with your layout or positioning of the elements (left, right, center etc or even mix)
As long as your headlines or titles are the biggest, the subtext next and so on... you should be good 👌 (Just remember contrast is the key.)
Use a maximum of two (2) fonts in design. Any excess could make the design look too busy.
You could use Display fonts as the title (like Jeeprox, Matalihim, Berbanya) then somewhat neutral looking fonts as body types. This helps our eyes not to strain on reading small sizes.
Please refrain using display fonts as body types. Display fonts are designed that is meant to attract attention and not be utilized as a body type. (Know your font type guys, It helps tremendously :))
Just my personal preference, I mostly increase the tracking of subtext elements to make it more legible and easier for the eyes.

✨✨To sum it up, "contrast" would be your main factor for visual hierarchy.

Let the important elements be noticed easily. Make it bigger, louder, and bolder. Let it be the star or focal point of your design.
And other supporting elements such as subtext, etc. not be a "distractor" from your focal elements. Let them do their thing, and support the headline on the back-end :)

I hope you guys have reached the end of the newsletter. And I also do hope you have learned a thing or two about my perspective and take on Visual Hierarchy.

The next topic for our "Typography series" would be choosing the right font and font pairs according to your brief. So I do hope you'll be excited about this. hehe

Cheers everyone! Always stay safe guys!

Lorenzo!

✨✨CHECKOUT FREEBIES HERE:

Galactech: Free for personal use.

Oakward: Free for personal use.

Saphion: Light(Demo only)
Here are some of my works as well (IG)

0 comments

EULA - APP/GAME

EULA - EPUB

EULA - WEB

In case you dont know... I accept commissions hehe

Need your support on my new youtube channel :)

See all posts from Lorenzo Martinez