This optional lesson will help you learn about typefaces to help with branding your product.
In this lesson, you will…
- Learn about different typefaces
- Choose a typeface to represent your brand
Just like colors, typefaces can help establish your brand’s visual identity. A typeface is the style of type. The examples we give apply most directly to typeface with Latin character sets (character sets for writing in English, Spanish, French, etc.), but some of the basic principles may be useful for non-latin languages (Arabic, Hindi, Chinese, etc.).
You might have heard of the word font before. Font is another word that is commonly used to refer typefaces. The difference is that a font is a particular size and style of a typeface . For example, Times New Roman is a typeface, but Times New Roman 12pt italic is a font.
Every typeface has a personality and historic meaning/context that people recognize and associate with it, even if they aren’t aware of it. In this lesson, you will learn about some basic typefaces to help you choose one. The two major categories of typefaces are serif and sans-serif.
These red marks on these letters are called serifs, and typefaces that have them are called serif typefaces. It’s fun to think of those extra marks as being little feet!
Typefaces that don’t have serifs are called sans-serifs.
Serif typefaces have extra little marks at the end of them. Serif typefaces give a feeling of history, and often authority or formality because the very first printed letters were a type of serif called blackletter! If you choose a serif typeface, you can expect it to carry some of this history with it, and a feeling of wisdom and age.
Take a look through the typefaces you have on your computer. Can you spot any typefaces that have serifs?
Sans-serif typefaces are a much more recent family. They represent youth and a new way of thinking. They were first developed to meet the needs of modern advertising and readability at a variety of sizes and distances. Examples:
Activity: Choose a Typeface(s)
Now, get ready to choose a typeface (or two)! Here are some steps to help you pick out the best typefaces for your brand with your team.
1. First, identify a typeface that expresses your brand’s identity. Try to also test a few by typing the name of your business using them. List a few typefaces that feel right for your brand and target audience. Try not to let your personal favorites influence your choice.
2. Now, test the typeface you chose for readability. Test typefaces in the words you want to at different sizes to make sure they are readable. Are there any that are hard to read in large sizes from a distance? Rule these out. Find the one typeface that works best. This will be your display type, used for headers and/or the logotype.
3. Now, search for a highly readable typeface for body text, or large sections of type. You’ll want to be very careful in selecting a body text that complements your display text as typefaces can clash just like colors can! Here are a few quick tips:
- Serifs can often be paired with sans-serifs successfully. Think of these as the type version of complementary colors—opposites attract!
- Contrast is good! Avoid pairing typefaces that look too similar.
- Imagine the “voice” that the typeface speaks with, just like you did with the display typeface. Does it complement your brand and the display typeface?
- Consider readability. A typeface chosen for body text has to be readable at small sizes in paragraph form. Test this just like you did for the display typeface.
- Test the typeface next to your display typeface, just as you think it will be shown in your app.
Need some help? Here are a few great resources:
- How can you use the typefaces and color scheme you picked in the development of your app, pitch video and other submission materials?
- Now that you have the typefaces and the color scheme that you will use for your brand, you are ready to create your logo! Take a peek at Entrepreneurship Lesson 5 to learn about making a logo.
Additional Resources - Applying in App Inventor
Custom typefaces can be tricky to add in App Inventor. Right now, App Inventor gives you a choice of three typefaces, a serif, a sans-serif, and monospaced. If you leave the typeface as “default’ it will be the sans-serif. An easy way to use a custom typeface is to upload a picture of your text in the typeface you want. This works best for headlines and titles.
For large amounts of small text it will be easier to pick one of App Inventor’s presets. If you find yourself in this situation, test which App Inventor preset looks best with your headline and logo.
For example, we took a screenshot of “Heading” in our display typeface, Eagle Book, and then uploaded it in a horizontal arrangement next to our logo. We adjusted the height and width of the horizontal arrangement until it looked how we wanted. We then choose the default serif typeface to go along with our title.
↑ This text is an image,
which we placed into the app ↓
Keep in mind that by making your text an image and not using a label, you can’t change what it says unless you change the image.
Applying in Thunkable
In Thunkable, there are more options for different fonts or typefaces. You can choose from a variety of Fonts in the dropdown in the Properties pane for a given component.