Exat Typography Website
When Hot Type asked us to create the promotional site for Exat, their most ambitious typeface release yet, we knew a traditional static specimen would not suffice.
Exat is a 21-style, 1,715-glyph typographic system rooted in Croatian modernism and the EXAT 51 art collective. The visual language that inspired the font often hinted at movement in its static work. Lines, forms, and geometric structures suggested energy and transformation. Interpreting this historical impulse through modern motion capabilities became the foundation for the site.
The result is a scroll-driven experience where typography reacts, shifts, and transforms through interaction. Motion is not decoration. It is the primary means of communicating the type system.
Design Objective
We aimed to present Exat as a unified system rather than a set of isolated styles. The site needed to:
- Reveal the full range of the typeface without overwhelming the viewer
- Make variation legible through interaction, not explanation
- Balance expressive moments with clarity and restraint
- Serve both as promotion and functional specimen
Typography itself became the interface. Every interaction is rooted in typographic behavior.
Structure and Interaction
The site unfolds as a continuous vertical narrative. Each section introduces an aspect of the type family before progressing.
Scroll defines state. Movement forward and backward restores context, reinforcing a direct relationship between user action and typographic behavior.
An opening glyph grid responds to cursor proximity, revealing the continuous variable weight axis. In the Design Space section, hovering over style names morphs a single specimen text across weight and width axes in real time. These interactions let users experience the system rather than read about it.
Panels pinned to scroll introduce weights and characteristics in sequence. Each activates only when visible, keeping focus clear.
Motion and Context
Motion references the implied movement of the modernist work that inspired Exat. Subtle oscillations add temporal depth, while occasional 3D typographic gestures punctuate without overwhelming.
Outcome
The site presents Exat as an active system. Interaction reveals structure. Motion reveals logic. Users see how the typeface works by experiencing it directly.