Blizzard
In-Game Checkout

Summary

Each Blizzard game had its own checkout flow and payment system that resulted in an inconsistent experience across platforms. The engineering maintenance required to support the 7 different payment systems resulted in excessive overhead. Additionally, the games supported very few payment methods. This impacted a large portion of the player base in regions such as China and Korea where they have distinct payment behaviors and preferences.

As the principal Product Designer on this project, I collaborated with over 5 engineering and game teams in order to unify the individual payment systems into one consistent experience. I wanted to streamline the in-game checkout experience across all the games, without compromising the existing trust or game experience of our players.

Goals

  • Provide an accessible, consistent and trustworthy in-game checkout experience across all games globally.
  • Reduce engineering maintenance overhead.
  • Keep players in-game when saving a new payment method or using 3rd party payment methods so they spend less time purchasing products and more time enjoying their gaming experience.

Contribution

As the principal Product Designer:

  • Defined UX strategy to ensure the best experience for players.
  • Conducted the UX discovery phase (checkout data analysis, stakeholder interviews, competitive analysis).
  • Collaborated and coordinated with 3 different engineering teams within Blizzard, multiple game teams, QA, risk, legal and customer support.
  • Designed user flows, wireframes and prototypes.
  • Helped design usability studies.
  • Remained the main point of contact for the initiative throughout the implementation in January 2016 to this day.

Discovery

To kickoff the project, I wanted to identify the main user issues with the existing in-game checkout flow:

  • Assessed the functional and visual differences between the games and Blizzard web store checkout experience.
  • Analyzed the data across in-game and Blizzard web store.
  • Interviewed Blizzard’s Customer Support to understand player issues related to checkout.
  • Conducted a competitive analysis for in-game and web checkout experiences.

Findings

I presented the main discovery findings to the various stakeholders involved in the project.

  • Players could not find their favorite payment methods in-game.
    In-Game payment systems supported only 2 payment methods while the Blizzard web store supports over 30 payment methods globally.
  • Players were confused about the amount totals of their transactions because in-game payment systems did not support tax breakdowns.
  • The payment page didn’t clearly communicate why the prices in the in-game store and at checkout were different.
  • In-game payment systems didn’t provide context for payment errors.
  • Most competitors had the same checkout experience and UI across their web and in-game stores.
In-Game VS Blizzard Digital Store Payment Screens UI

Design

I proposed to leverage Blizzard’s web store features to answer users’ needs and solve technical issues.

  • Provide additional payment methods in-game and improve accessibility.
  • Create a consistent checkout experience across the Blizzard web store, desktop app and in-game.
  • Provide a consistent UI across all games.
  • Clearly and consistently display tax information when applicable.
  • Provide transaction status clarity.

 

Challenges

After seeing the design recommendations, most game teams were opposed to using a consistent UI. They felt that including Blizzard’s generic UI in-game would confuse players and potentially cause drop-off during purchase. I partnered with a UI designer to create design options to test how users would respond to a fully custom, a hybrid and a generic platform UI.

UI variations

Validation

A UX researcher and myself conducted a usability study with World of Warcraft and Overwatch players. Beyond testing the concerns of the game teams, we wanted to identify any remaining pain points with respect to the new checkout experience. The main findings were:

  • Players preferred the consistent Blizzard UI over the custom game UI.
  • The Blizzard blue instilled trust and players felt the interface was less crowded.
  • Some players felt that having a consistent checkout experience on Blizzard web store, desktop app and the games made the payment more ‘’real’’. They compared making micro transactions with in-game currency to making purchases with real payment methods.
  • Players thought the new checkout experience was “Simple, fast and straightforward”.
Prototype Example
Initial User Flows

Results

We presented the data from the usability study to the different stakeholders and pursued the unified platform UI across all games. Users are now able to save a new payment methods, pay with their saved payment methods and use 3rd party payments, without ever leaving the in-game experience.

We observed the following impact after the launch of the project.

  • In-Game conversion rate surpassed Blizzard web store conversion rate by 10%.
  • Users were purchasing 25% more in-game than on the web.
  • Sales in countries using mostly 3rd party payment methods increased significantly.
Default Payment Screen
Select Payment Method
Enter New Credit Card
3rd Party Payment