AH 💬
menu

2020-2021

Twitter

It takes a Village to Refresh a Brand


These many projects for Twitter were completed as Creative Director for Instrument. This work included so many people at Instrument, Twitter, and many agencies around the world. Notably L’atelier Irradié’s Alain and Laurent Vonck provided the new Twitter brand’s initial visual direction, Grilli Type created the custom typeface, and The New Company and Death of Bad provide endless inspiration. Our team at Instrument included Sara Merriman, Annie DeYoung, Savannah Holder, Taryn Cowart, Arietta Tetreault, Anthony Zukofsky, Natalie Miller, Jenny James, Liz Hart, Xi He, Jack De Caluwé, Sage McElroy, Nimi Einstein, Justin Holbrook and so many more.

Background

In 2020 I had the distinct pleasure to work deeply with one of the worlds most powerful, humble, and exiting brands. Twitter came to us in late 2019 with a nascent brand refresh. Literally a few slides of brilliant visual work by l’atelier Iraradié. Consisting of a few motion studies and mock-ups of outdoor campaigns, the work reflected Twitter’s newly articulated brand personality: real, straightforward, and unfiltered. It took the form of print design; halftones, ripped edges, overprinting, collage, misregirstration. Everything we knew from letterpress class and all the dust and scratches we chased in early photshop work in the early aughts. In addition to the ephemeral nature, Grilli Type was commissioned for a special cut of their wide ranging gothic, GT America. But could this feeling be translated into the digital world? That was our remit.

Tweet Forward

Our task was to create a proper digital system for ease of use across dozens of properies by countless authors around the world while at the same time embracing the choas and messiness of the visual brand development. Answers are always easy to see in retropsect, but we did not know how integral our work would be to defining the new brand language. After several rounds of “pressure-testing” (building hypothetical digital experiences that used the brand visual identity) we honed in on what makes Twitter unique: the efficiency and personality of tweets.

fig11.1
Variety of components from About.twitter.com, Careers.twitter.com, and Developer.twitter.com design, development, and illustration by Instrument including Anthony Zukofsky, Xi He, Savannah Holder, Arietta Tetreault and more

Collaborating in 2020

Adding to Twitter's Web Design System is easy enough, deciding what to add (and when to launch) is a more difficult task in the year 2020. The twin challenges of adding a font upgrade (a switch from Helvetica to our new custom typeface across all components) as well as adding dynamic, interactive components were made even more challenging by the year that was. After an introduction in New York City and a handful of in-person meetings in San Francisco in very early 2020, we worked remotely, (a first for many of us) for the rest of our time together. Across the country and around the world we held creative sessions and honest critiques alongside the most powerful protests for racial justice, asphyxiating wildfire smoke in the Western U.S., and a presidential election that was far from certain. Our work was split between design software interfaces and the devistating dashboards of showing Covid-19 rates, electoral maps, and fire containment. As client and agency, designers and mangers, we held space for all of this and created truly unique environment.

fig11.2
Still from Devloper.twitter.com designed and developed by Instrument including Anthony Zukofsky, Xi He, Natalie Miller and more

Discovery = Vision = Pressure testing

The original brand refresh was conceived as an outdoor campaign. It was absolutely lovely, but Twitter is a digital organization. So could it live digitally? We asked this question through making. Designing & building an expressive internal brand center as a way to pressure test and evolve the brand around textures, rips, tears, halftones and attitude. We partnered to restructure, redesign, and develop about.twitter.com for the launch of the brand refresh. We began before the finalization of the new brand guidelines in order to continue to pressure test the new design system.

Visual identity to IA and SEO

Concurrently we worked with other teams including help.twitter.com to adapt to updated design system as well as improve IA and SEO. We created new, user-focused experiences and explored future feature recommendations to aid in higher self-service success and customer satisfaction. We also partnered with careers.twitter.com to restructure and redesign their site in order to apply the new brand and interrogate the existing content strategy. We created a new user experience around discovery and job list searching as well as the Diversity & Inclusion Report. We then defined art direction, and created production-ready assets for the entire site.

fig11.3
Visual and functional specifications for Tweet components as created for marketing with Grilli Type's new font Chirp Bold

Artwork

An unexpected journey on this creation of a new digital brand was the creation of innumerable assets for Twitter's marketing. While embarking on this work at the beginning of the 2020 Pandemic photoshoots were extremely rare. Combining a library of textures and image manipulations with all manner of stock photography, the brand become one of collage. And while multiple agencies tried their hand at this new visual language, we were the first to launch images into the world after a year of critique.

fig11.4
Photo and text collages for Twitter Developer Platform by Anthony Zukofsky and Xi He.

Subbrands

An outgrowth of the continued work with differnt parts of the Twitter organization is the opportunity to pressure-test once again the new brand as it pertains to sub-brands. We continue to work with sub-brands at Twitter to help define their brand strategy as well as their web presence. For the Twitter Developer Platform we created a vision strategy, consolidated several sites, ran research and testing, designed and developed pages and components, and created images for their new brand. Not every brand identity is vast enough to hold a family of subbrands. Twitter's reach is global but as an organization it is quite small compared to some tech giants. In approaching subbrands we looked at the organizations distinct audiences and how their experience might differ from other. For Twitter's developer audience we built tools and messages using the brand elements that spoke directly to the power and fun of developing with Twitter's API.


fig11.5
Collage image for Twitter Developer Platform by Anthony Zukofsky and Xi He with Twitter Developer Platform Team

The result is a living and breathing digital brand and experiences system. We continue to develop structures for how to create new experiences as well as brand images. Using the same rigor for creating both ripped paper collages and accessible interaction patterns.

fig11.6
Penn Medicine Case Study for Twitter Developer Platform.

For more about this experience please get in touch ↗

You might also like...