UI Typography Fundamentals *FULL 2024 UPDATE*

The Complete Designer Guide to Typography Online, from choosing a Typeface to responsive setup (+ Figma Typescale File)

Created by: Christine moonlearning
moonlearning

What Will I Learn?

• Typefaces & Fonts, and what's the difference?
• Serif, Sans Serif & Superfamilies
• Where to find typefaces?
• How many fonts do you need in your UI Design?
• Setting up a type scale. I will show you two different approaches to get the font size right.
• Why we use rem and not px. Crucial for accessible UI Design!
• Font weight, line height, and line length. The little details that will make your Webdesign shine.
• Contrast, and why you are legally required to get this right.
• Responsive typography, this is where the magic happens!
• You can create your own typography scale alongside that you can re-use for all of your future projects and save yourself a lot of time!

Requirements

• Basic knowledge of Figma (or Sketch)

Target audience

• UX/UI Designer or Graphic Designer wanting to learn more about UI Design