Supercell | Clash of Clans
Clash From The Past: The Games That Started Everything
To celebrate Clash of Clans' 10th anniversary, maker Supercell and agency Wieden + Kennedy created a world around 40 fictional years of the game. We created the “original”, era-specific, video games that started it all and helped send Barbarian back in time. Over 170 million people played and ultimately transported Barbarian back to present-day Clash of Clans.
ROLE: CREATIVE DIRECTOR, GAME MECHANICS DESIGNER
CAMPAIGN BY: WIEDEN + KENNEDY
TIMELINE: 3 MONTHS
AWARDS: OVERALL CAMPAIGN WON TWO CANNES LION GRANDS PRIX IN ENTERTAINMENT AND GAMING
To support the campaign’s mockumentary “Clash From The Past” we created three era-specific games, complete with cut scenes, that tell the fictional story of Barbarian fighting his way back to the present day.
STORYLINE
As the game’s characters are getting ready for the game’s tenth anniversary, Barbarian, one of the game’s OG characters, is feeling unappreciated. As he sulks off, questioning his place in the game he helped start, he is suddenly zapped by a Tesla Tower and transported back in time to the “original” Clash game from the 1980s. To help Barbarian navigate back to the present, players must play and win three Clash of Clans games "from" the 80s, 90s, and 00s. Careful! Barbarian is being followed by evil goblins through his journey, ultimately culminating in a game-wide battle in the present day.
THE GAMES
When Wieden + Kennedy came to ROSE, they had a strong idea of the types of games they wanted to use as inspiration from each era. We worked with them to define each game’s mechanics and style, ensuring that they made sense with the overall storyline and gave players the ultimate feeling of nostalgia.
THE CHALLENGE
From a creative direction standpoint, creating era-specific games using modern technology and high-res mobile devices, in addition to translating the characters and scenery of Clash of Clans across these eras was the crux of the campaign. Across the three games, we designed and created over 800 assets. The design of these assets also helped define the look of other parts of the campaign and were featured in the mockumentary.
1980s: CLASH
THE CONCEPT
Clash is a take on the classic side-scroller games of the 1980s. Players play as Barbarian, smashing through buildings to try and find their stolen sword. But be careful! The goblins that stole the sword are trying to stop your progress.
ART DIRECTION
We created Clash to be reminiscent of classic late 80s and early 90s arcade games. Taking references from games like classic Mario and Ghosts n’ Ghouls, we re-created the Clash of Clans village and characters in sprites. To create the characters, we identified their most iconic characteristics including clothing, abilities, and coloration, ensuring the simplified versions read correctly.
GAME DESIGN
In each level, Barbarian is looking for his sword. He is punching through buildings to try and find where the Goblins have hidden it. The sword is hidden in the last building the user smashes in each level. To link the levels together, each time the player finds the sword, Barbarian raises the sword in triumph, only to have it stolen again. Multiple obstacles are stopping the user from smashing buildings to find the sword such as Goblins and cannons. Additionally, the player has a limited number of lives and time.
1990s: CLASH DASH
THE CONCEPT
In Clash Dash, players are racing through the Clash of Clans village, trying to catch up to the Siege Machine and the Goblins. Like other racing games of the 90s, players get to choose the character to race as. Their vehicle? The big, strong, and fast Barbarian. Players must come in first place to be able to catch up and overtake the Siege Machine.
ART DIRECTION
The visual style of Clash Dash took after the N64-era Nintendo with bright colors, low(er) resolution texture maps, and sprite-based scenery. 3D games of this era often used pre-rendered scenery items, which were created on Silicon Graphics workstations, typified by their bright, shiny, slightly plastic look.
Characters
To create the Clash Dash characters, we took their present-day look and cartoonified them by exaggerating the features that made them unique. Additionally, we took references from Pixar and Disney to make each character friendlier/softer. This style went along with the overall campaign’s 90s partnership with General Mills by mimicking the characteristics of cereal mascots. The characters were modeled in low poly to replicate the look/platform capabilities of the period.
Environment
For the track and environment, the goal was to re-create the pieces of a Clash of Clans village, but from a first-person vs. overhead perspective. What if you could drive through the buildings? What is inside them? What do Elixir and Tesla Towers really look like? Additionally, we matched the look of late 90s racing game environments by using highly saturated, bright colors.
GAME DESIGN
To make this game mobile-friendly, we designed the driving ability to be controlled through finger-swiping. Just like in classic racing games, users can unlock power-ups that are reminiscent of items within Clash of Clans by running through storage boxes. As the Siege Machine drives ahead of the players, it drops gold coins on the ground that players can pick up to increase their speed. The game is complete with a saving character like Lakitu in Mario Kart, but in this case, it’s a baby dragon.
2000s: CLASH CRADLE OF DARKNESS
THE CONCEPT
To incorporate pieces of multiple types of 00s games, we created a two-part game with multiple cut scenes to tell the narrative of how Barbarian finally finds his way to fight the Goblin King. We created a nod to open-world style, quest-based games, where 00s Barbarian lands in a Clash of Clans village and talks to an NPC to find out his quest. Barbarian then completes a boss battle game against the Goblin King. As relayed in the mockumentary, Clash: Cradle of Darkness was a game so bad, that it couldn’t see the light of day. We created a version of this game, bugs and all, for influencers to play, and released the “never before seen footage” to the public, closing out the story of Barb’s return home to the present day.
ART DIRECTION
For the 00s look, we took cues from open-world games like Elder Scrolls. We made the proportions of the characters purposefully exaggerated and for the NPCs and extra characters in the cut scenes, made them look just off of being human and dark. The world itself and the items in the boss battle arena were made to highlight the new technology of the 00s that allowed for new higher poly 3D objects, lighting, and particle effects, while still showing the cheats of that time like 2D grass overlaid on a 3D environment.
GAME DESIGN
In the open-world portion of the game, Barbarian’s quest is to talk to an NPC, in this case, Builder, to find out his next mission. This is where we have implemented a “glitch” where Barbarian gets knocked out by the NPC, waking up in front of the Goblin Chief’s hut, to advance to the boss battle portion of the game.
Within the boss battle, users have to work to lower the Goblin Chief’s health by punching, a nod to the 80s game, and using Clash of Clans style power-ups that are hidden within crates around the room. Users must also dodge attacks from the staff of the Goblin Chief and objects being thrown by the other goblins.
CUT SCENES
To ensure the continuity of the story from game to game, we created a series of cut scenes that matched the style of the games as well as the style of other cut scenes from the time-period. The following is a compilation of all the cut scenes of the games.
Results
170 Million Users
TEAM
ROSE
Evan Rose, Account Manager AND FOUNDER, ROSE
Frank Vidal, Project Manager, ROSE
Savannah Rheinhart, Project Manager, ROSE
Marie Liao, Quality Assurance Engineer, ROSE
COLLABORATORS
DIRECTLY MANAGED:
Damian Illincheta, Sprite Animator
Emily Pitts, Sound Designer
Lars Bijl, Storyboard Artist
Muhammad Faisal, Game Developer
Richard Hill-Whittall, Game Designer, Reset Games
Digital Imaginary Studios, Character Modeling
Petar Pehchevski, Character Modeling and Animation
Kushtrim Thaqi, Animator
Maurice Fletcher, Character Animator
Adeel Afzal, Animator
Shaun Chapman, Animator
James Thorley, Sound Designer
Yohami Zerpa, Lead Game Developer, Gamebop
George Elhabr, Project Manager
OTHER
Lucas Hill, 3D Artist
Piotr Radecki, Pixel Artist
Leonidas Maliokas, Game Developer, Gamebop
Stiven Ilaraza, Game Developer, Gamebop
Syeda Ambreen, Quality Assurance, Gamebop
Leonidas Maliokas, Game Developer, Gamebop
Eduardo Araujo, Game Artist, Gamebop
Alexander Emeliyanov, Game Developer, Gamebop
Atif Raheem, Game Developer
CLIENT + PARTNERS
Supercell
Darcie Burrell, Creative Director, Wieden + Kennedy
Lawrence Melilli, Creative Director, Wieden + Kennedy
Will Curtis, Copywriter, Wieden + Kennedy
Liam McKacy, Art Director, Wieden + Kennedy
Devin Brown, Producer, Wieden + Kennedy
Butter, Sound Design