Giving a Face to a Game Company

Zabu Studio Inc.

PDesigning the visual assets for a new game studio, from in-game animations to business cards

KeyWords: Interface Design, Animation, Brand Design, Game Art, Identity Design, Print Design

Tools & Techniques: Photoshop, Illustrator, Flash, Blender 3D

The Situation:

 It was 2010 and Facebook games were big. everyone had a farm on Farmville, and there were many with virtual restaurants, zoos and amusement parks on various Facebook games.

 

Zabu studios came into existence to harness the popularity of tabletop games, and had formed a relationship with German game-design superstar Reiner Knizia, licensing many of his games for digital play.  Their intention was adapt these games for play on Facebook, bring high-quality German family games to Facebook viewers, and let existing fans enjoy their favorite games online. For this, the company needed two things: a brand identity that would stand behind the existing identities of a wide range of existing games, and digital assets that would reference, but not copy, those existing games. 

 

The Process:

I came onboard to establish and execute a wide range of marketing tools, including a brand logo, Facebook page banners and designs, business cards, and eventually iOS app icons. It all started with conversations with the CEO about the vision and mission of the company. I did a series of sketches, narrowed them down based on feedback, eventually arriving at the final logo which the team approved of.

 

Our first game, Lost Cities Solo, was a table-top game brought into the digital. The CEO gave me notes about the kinds of visual cues and themes that would be important, both for recognizability and for to convey a particular experience. I laid out the first iteration in Photoshop, recieved critique and then made more and more polished mock-ups until arriving at the final. We user-tested both the game and tutorial, made changes based on the user tests, and added dynamic animated cues around the interaction. 

 

Over the next 2 years, I supplied the firm with visual assets, animations, interactive elements and UX for 5 different games, played by thousands on Facebook and eventually iOS. 

 

Project Date: 2010-2012

Initial Notes & Sketches

Initial Notes & Sketches

Further Explorations

Further Explorations

Exploring Realism

Exploring Realism

Closer to Satisfactory

Closer to Satisfactory

Digitized Mocks

Digitized Mocks

Polished Final

Polished Final

Business Cards

Business Cards

Zabu's first game Lost Cities

Zabu's first game Lost Cities

Exploring fonts for Icons

Exploring fonts for Icons

"Achievements" enabled and disabled

"Achievements" enabled and disabled

First awards screen

First awards screen

UI for initial screen

UI for initial screen

posrealmsketch_0001

posrealmsketch_0001

posrealmsketch

posrealmsketch

Screen shot 2011-03-22 at 12.45.28 PM

Screen shot 2011-03-22 at 12.45.28 PM

Screen shot 2010-11-19 at 10.28.45 AM

Screen shot 2010-11-19 at 10.28.45 AM

Screen shot 2012-01-23 at 8.45.01 PM

Screen shot 2012-01-23 at 8.45.01 PM

Screen shot 2012-01-23 at 8.44.49 PM

Screen shot 2012-01-23 at 8.44.49 PM

Screen shot 2012-01-23 at 8.45.45 PM

Screen shot 2012-01-23 at 8.45.45 PM

Screen shot 2012-01-23 at 4.01.29 PM

Screen shot 2012-01-23 at 4.01.29 PM

Screen shot 2012-01-23 at 8.46.42 PM

Screen shot 2012-01-23 at 8.46.42 PM

Screen shot 2011-01-27 at 11.05.42 AM

Screen shot 2011-01-27 at 11.05.42 AM

Screen shot 2011-03-11 at 11.06.42 AM

Screen shot 2011-03-11 at 11.06.42 AM

Moving Forward: Poseidon's Realm

Starting out: Brand Identity and the first game

Pickomino, 3D animations within a UI

UI and Pop-Up for Pickomino

UI and Pop-Up for Pickomino

Development of assets in Illustrator

Development of assets in Illustrator

Illustrations and concepts in Illust

Illustrations and concepts in Illust

GameBoard, Pickomino

GameBoard, Pickomino

Splash Screen, Pickomino

Splash Screen, Pickomino

Into the Future: Take It Easy and Thunderstone

TakeItEasy, 1st iteration

TakeItEasy, 1st iteration

TakeItEasy, 2nd iteration

TakeItEasy, 2nd iteration

TakeItEasy, 3rd Iteration

TakeItEasy, 3rd Iteration

TakeItEasy Store Design

TakeItEasy Store Design

Information Design, Thunderstone

Information Design, Thunderstone

Campaign Screen, 1st Iteration

Campaign Screen, 1st Iteration

Campaign Screen, 2nd iteration

Campaign Screen, 2nd iteration

Campaign Screen, Locked

Campaign Screen, Locked

Market, Thunderstone

Market, Thunderstone

KeyWords

Interface Design, Animation, Brand Design, Game Art, Identity Design, Print Design

 

Tools & Techniques

Photoshop, Illustrator, Flash, Blender 3D

Related Projects:

UX for Location-Based Games

UX for Location-Based Games

Towers in the Sky

Public Engagement Project

Public Engagement Project

For the UN

Immersive Theatrical Experience

Immersive Theatrical Experience

Digital Art & New Media

© 2016 by Kathleen Kralowec

  • Facebook App Icon
  • Twitter App Icon
  • Instagram Social Icon
This site was designed with the
.com
website builder. Create your website today.
Start Now
Screen shot 2012-01-23 at 8.44.49 PM