Pioneering a new category of gaming

Remember Facebook circa-2011? It was the era of Facebook games. Every other Facebook notification was from a friend who wanted you to play Farmville or Words with Friends or The Sims. Zynga, Playdom, and lots of social gaming companies were quickly founded and their games exploded overnight.  

During that time, I was working for a social game company called Kabam. Kabam was working on popularizing its own style of game, a social browser-based freemium game that was somewhere between an RPG and a Realtime Strategy. These games allowed players to build large cities and massive armies. They could join alliances with other players and attack enemy cities for resources that could in-turn be used to build larger armies. These games were hugely successful — The game I spent most of my time on racked up $100mm in revenue before it turned 2.

While at Kabam, I worked on two games: Dragons of Atlantis, which was Kabam’s big money-maker, and Godfather: Five Familes, a partnership with Paramount Studios that let me experience building a new game from the ground up. I also worked on helping to create a pattern library of components that were used across all of our games. Below, you'll find work that represents my time at Kabam.

 

Communicating the battle system

In the early days, our games' battle system wasn't able to show combat happening in realtime. This meant that players had to setup an attack up front with faith that it would work, and they would receive a 'battle report' afterwards that explained what happened. Unfortunately the battle system was largely opaque, leaving players guessing how their armies would fare in an attack. I used feedback from customer support forums to redesign the attack flow and battle report systems. Both were usability tested and released, receiving praise in the forums and a bump in key metrics.

This wireframe of an updated battle report shows a turn-by-turn representation of battle.

This wireframe of an updated battle report shows a turn-by-turn representation of battle.

This wireframe of an updated attack flow shows the overall power of the user's attack

This wireframe of an updated attack flow shows the overall power of the user's attack

 

Responsive Games

It used to be that Facebook games had to exist in a specific frame at specific pixel dimensions. This was a big problem for Kabam games that needed lots of ui (ask me more about expert interfaces vs. beginner interfaces!). Fortunately, Facebook announced a flexible canvas, allowing game interfaces to stretch to the full width of the browser. I redesigned the Dragons of Atlantis UI to take advantage of the update.

This wireframe shows how the UI would expand across a flexible canvas

This wireframe shows how the UI would expand across a flexible canvas

 

Kabam.com

At the peak of the success of Facebook games, Facebook announced a 30% tax on all in-game purchases, paid by the gamemakers. This caused companies to scramble to develop their own platforms to migrate players to. Kabam created Kabam.com, and I was the UX designer on the project. The largest part of the design effort was migrating accounts from Facebook to Kabam.com, since players could have multiple accounts across multiple games (e.g. I could have 2 accounts for Dragons of Atlantis, and 1 account for Godfather), but we needed to migrate to one. Another effort was migrating the payment system over, since payments were housed inside of Facebook.

Different stages and states of the account migration process.

A flow showing payment process