Elephant

Meet
your
new
Twitch

Community / Nominee
Elephant

Community

Nominee
This project was really supposed to showcase the new brand identity, but it went so much further and really blew up the notion of what a brand site could be. - Elephant Team
image description
Q: Can you briefly describe your project and the concept behind it? A: The Twitch rebrand was about celebrating every member of the community; our role was to create an experience that really lived up to that. We wanted to tell a story about the inspiration and ideas that drove the evolution of the brand. All the Easter eggs, inside jokes, and winking references are there to recognize the community and the beautiful mess they’ve created. From a creative perspective, our aim was to make a living, breathing example of how far you could take the rebrand. We were intentional about every detail–from animations, to colors, to interactions and typographic arrangement–in order to illustrate just how much flexibility the brand has today.
image description
Q: Talk about your initial prototypes. How did those ideas change throughout design and execution? A: Our original concept was to make the entire experience a side-scrolling game full of surprises for the Twitch community. We had hoped to use the Konami code as an Easter egg, but it overcomplicated the sense of surprise we were trying to create. Some aspects of the original ideas came back later in the process. For example, we wanted the entire thing to feel like playing a game, but it wasn't feasible within the timeframe and didn’t quite work as the main experience. The idea came back into play when thinking about creating a social aspect to the project. We decided to add in some Flappy Bird-style gameplay at the end with brand elements and allowed users to share their scores.
image description
Q: What influenced your chosen technical approach, and how did it go beyond past methods? A: Our role was to conceive and create the front-end experience alongside the Twitch creative team, while the technical implementation was handled by the Twitch team and a company called CloudCannon. The ideas and execution of the experience really drove the technology that was used to bring it to life. We never felt limited by having to fit the work to a particular pattern or template.

What breakthrough or “a-ha” moment did you experience when concepting or executing this project?

Among the Easter Eggs we wanted to include somewhere on the website, was a fun fact about the new font that Twitch used for the rebrand, which is named after Robert Moog, the inventor of the first commercial synthesizer. We really wanted to make a feature about it, but we did loads of versions and nothing was really working. The night before our last creative review, we came up with a concept that mashed up Nyan and Bob Ross–two popular memes on the Twitch platform–along with an interactive mini synthesizer and everyone loved it. It ended up being one of the last bits to be approved, but one of our favorites features.

Watch

Q: What web technologies, tools, or resources did you use to develop this? A: We designed the project using Sketch with a shared library between our team to stay aligned with all the design patterns we have created during the project. To explore interactions, motion, and create a prototype of the full experience, we used Principle. Because of the heavy use of motion, we chose to also present our work straight from the Principle prototype, helping everyone better understand how the project would turn out. Our partners at CloudCannon did a splendid job on translating our prototype into real code, achieving a result ever so similar to our proposal.
Q: How did you balance your creative and technical capabilities with the client’s brand? A: As always, our biggest challenge was time. This meant we had to constantly balance timeline-related decisions with our ambition to push the boundaries. We were vigilant about evaluating feasibility, and always having smart alternatives.
Q: How did the final product defy your expectations? A: The reaction from both the Twitch and design communities was really positive. This project was really supposed to showcase the new brand identity, but it went so much further and really blew up the notion of what a brand site could be. There is a section on the site called ‘Bringing it all together’–the idea was to create something that showed all the brand elements working together in a way that felt uniquely Twitch. This aspect in particular, really drove the conversation about the rebrand.
Q: Why is this an exciting time to create new digital experiences? How does your team fit into this? A: A lot of companies like Twitch now have very established in-house creative teams, and we see this a lot with other clients too. So it's now less about the typical agency-client relationship and more about a unified team working together openly, honestly, and collaboratively. There are fewer big reveals and more collective working sessions and discussions. We had a lot of healthy debates about which ideas were worth the extra work, and which ones we had to let go. The success of this project ultimately depended on a unified team composed of Twitch’s creative team, their engineers, and our team at Elephant all working in sync with a passion to launch the new rebrand in style.

Explore

MediaMonks

Netflix DARK

TBWAChiatDay LA

Behind The Record

Wild Forest

François Audouy

Zuleika Arroyo

Black Women Too

Sid Lee / DIgital Kitchen

The Joker’s Escape

NBC News

Trans, imprisoned — and trapped

The National AIDS Memorial

World AIDS Day 2020 - A National Conversation -

AKARU

Avoriaz

GSD&M

U.S. Air Force ECHO

Animal

Life At Spotify

Center for Architecture

Visualize NYC 2021

HAUS

Tillamook

360 Design

Zoonomia

Wonderland

Wonderland

Gigarama

Sing, My District

Nightjar

Discovered Wildfoods eComm Experience

Dogstudio

ZOOX

MediaMonks

Maserati MC20

Cheil Worldwide, Inc

Samsung Galaxy S21 5G series

NYC & Company

The Black Experience in NYC

ESPN

ESPN College Football Tracker

Paradowski Creative

The Sheldon Website

Active Theory

CHILE20

Active Theory

Secret Sky 2020

Hook

YouTube Culture & Trends Report

Hook

Local Guides

Hello Design

The Marvelous Mrs. Maisel

Studio Airport

Emergence Magazine

Athletics

New York Review of Books

R/GA

ESPN House of 98

ThoughtMatter

CENTER Photography 2020 Compendium

Turbulent

Turbulent.ca

IntraCollaborative

Newest Americans

Rotate°

Big Green Egg

Wide Eye

WhiteHouse.gov

Swell Creative Group

Everyone In LA: 2020 Homeless Count

firstborn

Exo

GIPHY

GIPHY

Content Pilot LLC

Chambliss. Bahner & Stophel

Hello Monday

Bartlett Summer Show

Work & Co

Vistaprint Masks

Hello Monday

Virgin Hyperloop

Forbes

Forbes 30 Under 30 2021

MIT Open Learning/Center for Advanced Virtuality

In Event of Moon Disaster

MediaMonks

Frontier Development Lab: Solving NASA’s Toughest Challenges with Google Cloud × Intel

Jam3

ComplexLand

Spring/Summer

Stykka

firstborn

The Leary Firefighters Foundation

Elephant

Elephant Website