Zalando Brand:
Type pairing

Zalando Brand:
Type pairing

Zalando Brand:
Type pairing

Zalando Brand:
Type pairing

Branding
Graphic Design
Typography

Branding
Graphic Design
Typography

Branding
Graphic Design
Typography

Branding
Graphic Design
Typography

Branding
Graphic Design
Typography

Two years ago, I joined an internal team of Designers who worked on the new visual language of Zalando; released last year under The Label. We created a whole new set of core brand elements to bring our inclusive, bold, and playful personality to life. Even though we collaborated on many different topics and shared explorations, my main focus during the branding effort was around the new Zalando Typography. Here’s how we did it.

top-banner

01

Background
check

typefaces–02

When we started this project, Zalando’s corporate font was the oh-so popular Helvetica... and Arial on web... and San Francisco on iOS... and Roboto on Android. So we began this project with the clear assumption that our typography usage lacked distinction and consistency (considering we utilised system on different platforms).

With this new typography system, we had to make sure that it is accessible, legible and guiding, as well as emotional, crafted and exciting to make a clear connection to the world of Fashion.  Ultimately, we needed to develop a deeper emotional bond with our customers and make sure it was distinctive, recognisable and coherent. 

02

Benchmarking against other brands

video-graph–01

To ensure maximum distinction, we started by identifying 60 brands operating in similar sectors as Zalando and mapped them according to their different type attributes. We were quickly able to validate our early assumption: with Helvetica Bold as our main typeface, Zalando fell into one of the most crowded areas of the framework. Our typography was, indeed, pretty unexceptional — but the framework helped us see new and more exciting possibilities.

03

Time to get exploring

zalando-type-explorations

At this stage of the creative process, we started exploring different typeface treatments. We considered serif typefaces for their more delicate and classic qualities. Extended typefaces for their bold and confident look & feel. We also tried applying different weights and different attributes (italic, underlined) to these early explorations.

Though we quickly realised that many of these explorations still didn’t feel true to our brand identity nor to our legacy. Some felt really bold and playful, while others felt more trustworthy and inclusive. But, we needed our solution to meet all of these criteria at once.

zalando-final-pairing-02

Final destination:
Serif & Sans serif pairing

We really liked the way sans serif typefaces showcase informative and pragmatic content and how serif typefaces bring charm and a human touch to stories. Weighing our options, we realised that we wanted to opt for a serif and sans serif type pairing as our new typography system; something that finally felt like the perfect way to convey Zalando’s personality.

Before we land:
Let's find the perfect match!

Once our direction was clearly defined, we had to find the perfect serif and sans serif for our pairing solution. We isolated 140 typefaces from 40 different foundries — ranging from independent studios to renowned foundries. As we wanted to make well-informed and unbiased decisions, we turned our experience principles and brand personality traits into actionable questions, making it possible for us to reduce even further the amount of typefaces combinations possible. Our last exercise was to ensure the technical attributes of the typefaces: languages supported, visual weight next to each other, same x-height, etc. 

All options weighed, we opted for Helvetica Now — a modern take on our original corporate font, the sans serif Helvetica — combined with the serif typeface Tiempos as our final pairing solution.

Optimised for today,
ready for tomorrow.

After experimenting with multiple sans serif options, we were impressed by the accessibility of Helvetica Now. This new take on Helvetica is fully optimised for digital use, which means it is not only easier to read, but also offers better contrast, and improves the overall legibility of the text. This made it a great inclusive and timeless option. As for Tiempos (which is also optimised for digital use), we were drawn to the legible yet romantic characteristics of the vintage serif typeface — its generous curves and large characters.

Oh, and on the technical front, loading times were barely affected by the move from a system font to the optimised versions of these two typefaces. So, we quickly wished farewell to our usage of system fonts!

animation-03
zalando–type-system-04

An easy system, utilisable by a company of ~15k employees

The type pairing system is rather simple: Helvetica Now is used for functional, guiding or informative content. Whereas Tiempos is used for inspiring, storytelling or complementary content. As for pairing them in the same headline or same paragraph, it is absolutely allowed — encouraged even. We ran a series of workshops with different departments to ensure we can address all of Zalando's different needs and use cases.

Zalando's type pairing
in the future

As we all know, a visual language is constantly evolving — and Zalando's is certainly no exception. Even though this new type system is already an integral part of Zalando's new visual language, we are constantly in touch with departments across the company to make sure we can all utilise the same typography.

Overall, the quick typography adoption rate company-wide as well as our customers' response to the new pairing highlights that we’ve probably managed to create a stronger emotional connection by revisiting our type system, or at least that we are on a good path of doing so. Good riddance, Helvetica. Hello, Helvetica Now and Tiempos!

Different applications of the type pairing.
Done by the Marketing, Strategy & Campaigns and the Digital Experience teams at Zalando.