URL: PlayOverwatch.com
Projects: Seasonal event pages, community pages, media redesign
Role: UI design, wireframes/prototypes, user research and testing, paint-overs

Players are drawn to the world of Overwatch through its rich story, colorful environment, and unique heroes. Its diverse roster of characters represents players from all over the world and gives meaning to their in-game experiences.

• How can we deliver web content that supports these initiatives and encourages players to connect with the game in new ways?

• Can we engage the community on a regular basis, and do so in a way that resonates with their unique in-game progression?

To achieve these goals, we overhauled the experience of seasonal event pages to showcase the beautiful artwork created for each event, and also brought stronger focus to the new game modes and maps being introduced. Additionally, we implemented a login system that hooked in to the game data that displayed how many event-specific cosmetics the player had unlocked to date. These changes increased player engagement with the event pages, and they quickly became the most visited pages of the site.

The following is a selection of event pages I designed (click to enlarge): 

Each event page was localized in 15+ languages to support players from all over the globe. We worked closely with our regional counterparts to ensure that we delivered content that served the needs of all of our users in ways that were meaningful to them.

How else could we make the official game site an important resource for our fans?

The Blizzard community is made up of players who want to leave an impact on the world, in-game and out.

This dedication to making the world a better place is best illustrated by programs such as the Pink Mercy charity event, during which time players raised over $12 million to support breast cancer research. In fact, many players have done impactful work in the name of Overwatch outside of Blizzard-sponsored events. We wanted to create a space on PlayOverwatch.com that championed their efforts and shared their passion with the rest of the community.

We worked closely with the Overwatch game and global publishing teams to create a special place on the website to showcase these stories in the form of videos and blog posts, called Heroes Among Us.

Finally, we wanted to redesign the Overwatch media page to be more useful and accessible for all of our players.

Media resources have always been an important feature of Blizzard game websites. Fans use official images to aid in the creation of costumes, graphics, and beyond. Importantly, many parts of Overwatch’s story are told through media outside of the game itself, including cinematic shorts and comics. The page had outgrown its original design and had become frustrating to navigate, and lacked analytics tracking leaving us unable to gauge the value of any particular media type. This needed to change in order to support the game’s increasing amount of story artifacts.

We knew we had to turn to our players directly to get the most value out of our redesign. We gathered input from players across all skill levels to ensure the feature was highly navigable and useful for everyone, regardless of their familiarity with the franchise.

Using the existing page as a control we tasked users with locating specific pieces of content, then repeated the task using our refreshed page designs.

The end result was an updated media page that was simultaneously robust, scalable, and discoverable for new and returning players. This new architecture also ensured that users of all devices could experience the Overwatch story with ease.

Next: Hearthstone Official Website