GLYPHS APP

Overview

Type selection is often intuitive but rarely informed; designers choose by feel, not by structure. I approached this by building a classification-led platform on the Vox–ATypI system, giving users a logical framework to explore and identify typefaces, alongside an AI recognition layer.

Contribution

• Research
• IA Product Design
• UX/UI Design

Tools

• Figma
• Adobe XD
• Wireframing
• Prototyping
• 3D Rendering
• AI Type Recognition
• Usability Testing
• Desk Research

Methods

• Double Diamond design process
• Comparative analysis of typographic systems
• User research & insight synthesis
• User-centred wireframing and prototyping
• Iterative visual testing across device screens

Pain Points

• Classification Opacity

  Type systems are rarely explained where designers work.

• Discovery Friction

  Finding alternatives to a typeface requires scattered manual research.

• Visual Ambiguity

  Similar typefaces lack clear structural differentiation for non-specialists.

• Tool Fragmentation

  Identification and classification live in entirely separate tools.

• Theory Distance

  Academic typographic knowledge doesn't translate into practical design contexts.

Problem Definition

“Designers choose typefaces daily without a shared language; the system that defines what a typeface is remains invisible to most who use them.”

Research

• Process

  Double Diamond

• Identification

  Opportunity Areas

• Interview

  Anonymous Interview

• Photographs

  Some Photographs

• Users

  User Personas

• Trajectory

  Customer Journey

Key Insights

• System Blindness

  Unmet Knowledge

  68%

  Most designers rely on visual memory alone, having never encountered formal typographic classification during their training.

• Alternative Gap

  Discovery Barrier

  74%

  When searching for type alternatives, designers default to name-based search rather than structural or stylistic criteria.

• Visual Learning

  Preference Signal

  81%

  Users prefer to understand type categories through rendered glyph examples rather than written anatomical definitions.

Glyphs as a Solution

Glyphs turns a century-old classification system into a navigable, visually led platform that makes type discovery both structured and immediate.

User Flow

Result

• 3D Visual Language

  • I rendered each category using a sculptural 3D “g” glyph to make abstract type families immediately tangible.
  • The inflated, material treatment signals each category's character without a single word of description.

• Category Deep-Dive

  • Each card surfaces the defining anatomical traits of a category in plain, concise language below the headline.
  • Bullet descriptors like “monolinear” and “based on perfect geometric forms” replace jargon with observable facts.

• Active State Signalling

  • A magenta highlight on “Clasiques” communicates the selected state immediately, without icons or additional labels.
  • I chose high-contrast colour over subtle border changes so the active category is readable at a glance during fast navigation.

Conclusion

Glyphs proves that typographic theory doesn't need to be simplified to be accessible; it needs to be designed.