Disclaimer: Microsoft/Xbox neither sponsored nor endorsed this project.
This project tasked me with adding a feature to an existing app or service, with the constraints of maintaining the branding and visual design of the existing product.
I worked on Xbox Game Pass, which is a subscription-based service that grants users access to a rotating catalogue of 100+ games they can download or stream to their Xbox consoles.
Because the Xbox Game Pass service offers a varied selection of so many games, it's difficult to find something of interest to play. How might we make that discovery process faster and easier for users?
Add a suite of discoverability features to the Game Pass app for Xbox consoles that recommend games to subscribers based on their playing history, their friends’, and the larger subscriber base.
My user interviews invalidated my original hypothesis about the project, and I struggled throughout the process with testing my prototypes in a way that accurately simulated the console Xbox experience.
While the Xbox Game Pass app currently has a "Picks for you" tab on the homepage, it's not distinguished from other identical tabs on the page.
I wanted to draw attention to this new page, so I placed its homepage tab just under the main interface buttons and added a "New" banner.
The original design for game cards within the app, while functional, also left a lot of empty space, especially under the game’s title. To take advantage of that space, I added:
1. A banner with information about a game's status on the service
2. Icons of Xbox friends currently playing that game
3. A visual representation of a game's score on the review aggregate site Metacritic
4. A short description of the game
While the existing game details modal in the Xbox Game Pass app is functional, I added more, well, details to the details page. This is also where users can give the recommendation algorithm direct feedback on suggestions to improve them.
1. A game's score on Metacritic, including the number of critic reviews it's based on
2. A simple upvote button that tells the system to recommend more games like this one
3. An equally simple downvote button that tells the system this game and similar ones aren't a good fit
To better understand Xbox Game Pass's impact on the video game market and the kind of users who subscribe to and use the service, I researched the ways Game Pass has shaken up the industry and general sentiments among subscribers.
• As of April 2021, Xbox Game Pass had 23 million subscribers
• Game Pass subscribers spend 20% more on games than non-subscribers
• Game Pass subscribers play 30% more games than non-subscribers
• Some users rely on third party tools like gamepassport.net to filter the Game Pass library
Finding users to speak with was a challenge due to gatekeeping and strict rules on the online platforms where gamers typically congregate. Eventually, I got permission to post on r/XboxGamePass to ask for interview participants. 62 users responded.
• Users were frustrated with the lack of filtering options in the Game Pass app
• Users wanted review scores of some sort displayed for games in the catalogue
• Users wanted a "Because you played this game, try this game" feature
I also spoke to three subscribers in short, 15-minute interviews. They represented a demographically diverse set of users from all around the globe.
I asked them about their general experience with the service and a potential playlist solution I was considering. I learned that:
• Users were frustrated with the poor quality of game recommendations on the service
• Users were open to social recommendations so long as they weren't "shoved in their face"
• Users worried they didn't have enough Xbox friends to make social discovery features useful
To better understand and visualize the areas where users were getting stuck when trying to find a new game to play on Game Pass, I created a journey map.
• Users feel overwhelmed by the amount of games on Game Pass
• The limited recommendations the service already makes are irrelevant or inaccurate
• The inability to filter the catalogue for relevant games is the biggest pain point in the journey
Initially, I hypothesized that the solution to the discovery problem would be to add a feature that allowed users to view and create "playlists" of games on the service.
My research revealed users preferred personalized recommendations based on the games they were already playing.
To solve the discoverability problem, I decided to create a central recommendations hub page that would house several discovery features, including:
• "Because you played" — recommendations based on a specific game a user has played
• "What your friends are playing" — a personalized list of games popular with a user's top Xbox friends
• "Most popular games" — Recommendations based on what's trending among all subscribers
To determine the best layout for the Picks for you page, and which sections users would most like to see at the top of the page, I ran a preference test between three versions.
80% of users preferred version 1 of the "Picks for you" layout that displayed the three new recommendation blocks at the top of the page
Due to platform limitations, I wasn't able to test my high-fidelity prototype with an Xbox gamepad like I would've liked. Instead, I ran a first-click test with static images of the designs and a series of follow-up questions. While not ideal, it still provided valuable insights.
• 90% of users successfully completed each of the 10 tasks in the test
• Users were confused by the icons on the game details modal, namely the thumbs up/down icons
• 28% of users found the Picks for you page to be too "busy" visually
The revisions I had to make to my designs after user testing were minimal, and many of them were a result of not having access to the original product's icon set. The new solution isn't perfect either, but requires further testing.
• Changed the thumbs up/down recommendation refinement icons to up and down arrows
• Updated "Join club" icon from a controller to a group of people
A sizable amount of users said they found the overall pages to be too busy thanks to the sheer amount of information presented. To address that, I cut out some of the unnecessary visual indicators.
1. Removed "New release/Leaving/Trending" status banners from game art
2. Removed icons indicating friends are playing certain games
However, I retained the Metacritic scores because users overwhelmingly loved their inclusion.
This was one of the most challenging parts of the project. As much as gamers generally love to share their opinions, getting them to agree to a phone call can be like pulling teeth.
I made the mistake of going into this project with a solution already in mind, and my research revealed my solution wasn't one users were all that interested in. It nearly derailed the project.
Previously, I've only done projects that built new products from scratch. Working within an existing framework and maintaining a product's branding was paradoxically freeing and limiting.
I really wanted to build a prototype that supported gamepads to test it as accurately as possible, but there aren't any affordable tools on the market to facilitate that kind of remote testing.
Until this project, I'd only ever designed for PC and mobile interfaces. Learning to design for TV and other larger displays was a challenge, but I'm glad to have the experience.
The tight scope of this project (no more than 80 total work hours), really pushed me to keep my often overly ambitious impulses in check and focus on what was feasible to deliver.
That surprised me considering it's an industry where user interaction is the core experience. But across competitors and in Xbox's own product I saw how much room there is to improve.
I've always been an avid gamer, but since starting this project I can't help noticing all the flows and interactions that could be better in the games I'm been playing. I didn't see that before.
Though the revisions I made were small, I still want to test the new upvote/downvote icons I chose on the game details modal. I'm not sure they're any clearer than the thumbs I used before.
The ability to search or narrow the library with advanced filters was one of the most-requested features among users, but tackling that was outside the scope of this project.
I wasn't able to make this happen so I'm not fully confident in my testing results, but there must be a way to create a prototype that supports a gamepad and then send that to users to test remotely.