This website teaches users about typographic anatomy including x-height, serifs, and bowls by encouraging users to interact with each letter in the displayed word, Typography. A short quiz tests the user’s newfound knowledge.
Visual designer, writer, developer
- Brackets (development)
- Photoshop (image editing)
- Illustrator (design mockups)
- Pencil and paper (pseudo-code, flowchart, programming)
A 5-question quiz prompts the user to correctly identify the anatomical term highlighted on each letter. A final tally gives the user a score, a designation of either master, student, or amateur and an option to retake the quiz or return to the original screen. Users can review their answers, or retake the quiz.
The goal of this website was to focus on interactive programming, but I believe this tool could be expanded to help teach design students the basics of typography.
- Allow users to type in their own letters and view their anatomical properties
- Show users improvement in their quiz scores over time
- Compare and contrast various typefaces to illuminate anatomical differences