Using Font Games to Learn About Typography #345

Font Games and Learning Activities  #345: Challenge | Recap

One of the things I enjoy most about designing courses is finding the right visual voice that reaches the learner and helps them understand a new skill or concept. You can find the visual voice in imagery, colors, characters, and especially typography.

The challenge for many course designers is knowing how to work with type properly. This is where interactive font games can help. Using games, designers can learn the mechanics of typography without being overloaded with theory. Let's look at some examples.

Kern Type

Learn about kerning in this drag-and-slide font game. I really like how this game provides feedback and allows users to compare their work with the recommendations from experts.

Kern Type

View the font game

I enjoyed Kern Type so much I wanted to try building it in Storyline. I recreated the same options for adjusting letter spacing, viewing my result, and comparing my result to an expert solution. I originally built this example during the Storyline 1 beta. At the time, we only had freeform drag-and-drop so that I couldn’t constrain the dragging motion horizontally. If I were to rebuild this today, I would use sliders with custom thumbs for each letter. 

When you’re designing courses, you are rarely—if ever!—going to be creating a constraint-free course. The key is to master your tools and get a little help from the Articulate community.

Kern Type: Storyline Version

View the Storyline version of KernType | Video tutorial | Source file

Shape Type

If you’ve struggled using (or pronouncing) bezier, this is the perfect time to practice creating curves with the pen tool.

Shape Type

Shape Type

Type Connection

Learn how to pair typefaces with this typographic dating game. After choosing a primary typeface, you’re presented with potential matches and strategies for combining typefaces. The feedback helps you learn more about combining typefaces, typographic history, and type history.

Type Connection

View the font game

As course designers, you don’t need a degree in type design to build e-learning, but you should have a fundamental understanding of how type works. And that’s what this week’s challenge is all about!

Challenge of the Week

This week, your challenge is to create an interaction that teaches one or more basic principles of typography. 

Here are some ideas to get you started:

  • Type terminology. Create an interactive glossary to introduce learners to common vocabulary terms.
  • Anatomy of a typeface. Create an interactive guide using markers or callouts.
  • Font quiz. Ask learners to identify fonts by name. Games like Arial vs. Helvetica are a great way to learn.
  • Leading, kerning, and tracking. Create a learning game to help learners apply basic line and letter spacing adjustments.
  • History of type. Create a timeline of interactions to let learners explore the history of type.
  • Combining typefaces. Quiz learners on appropriate font combinations.

Share Your E-Learning Work

  • Comments: Use the comments section below to share a link to your published example and blog post.
  • Forums: Start  your own thread and share a link to your published example..
  • Personal blog:  If you have a blog, please consider writing about your challenges. We’ll link back to your posts so the great work you’re sharing gets even more exposure.
  • Social Media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can track your e-learning coolness.

Last Week’s Challenge:

Before you return to this week's challenge, check out the interactive learning journals and note-taking examples your fellow challengers shared over the past week: 

Learning Journal and Note Taking Examples in E-Learning #344

Learning Journal Examples in E-Learning RECAP #344: Challenge | Recap 

New to the E-Learning Challenges?

The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos.

68 Comments
David Anderson
Tracy Carroll
Jodi M. Sansone

What Does Your Go-To Font Say About You? Demo: https://jodisdemos.s3.amazonaws.com/345+Typeface+and+Fonts/story.html Download: https://jodisdemos.s3.amazonaws.com/345+Typeface+and+Fonts.story Ok, this was a little bit of a workout. I found it challenging to show different fonts in the same project because I try to be disciplined and only use one or two--so I was fighting my instincts. I don't really believe that the font you use most often is some kind of indicator of your personality, but it was fun to play with. However I would agree that if you consistently use Comic Sans, that might saw something about you. :) I also learned new things about font terminology so this was a productive exercise for me. And just an aside--I used the new Articulate cover slide feature in the p... Expand