THE CHALLENGE
How can we help connect CROSS-NETWORK GAMING COMMUNITIES?
As more games support cross-network play, there still isn't a central hub where players can simultaneously connect and communicate with friends across different platforms. To bridge this gap, Xbox and Discord partnered to help players engage within their cross-network communities.
As a designer on the community team, my goal was to expand the pool of available friends for players. We aimed to extend the Xbox brand beyond the console, creating a more inclusive gaming ecosystem.
Xbox players reported decreased enjoyment due to the lack of available friends for gameplay. Coordinating gaming sessions required navigating multiple social networks for communication. Discord, an essential platform among players, was the ideal partnership for this initiative.
the discovery
how does discord communication work?
Discord's structured organization of servers and channels is designed to encourage conversation within communities. We examined how players communicate on Discord during gameplay to gain deeper insights into their interaction patterns.
To join a Discord channel, a series of actions needed to be completed at the navigation level:
- Selecting a server.
- Selecting a channel within a server.
Menu 1 - Xbox Console Home page
identifying the entry point
The Guide was the perfect hub for Discord communication, as it already centralized social experiences on the Xbox console. Since it can be opened instantly, it ensures that Xbox players can easily discover and access Discord.
Menu 2 - List of Discord servers
After entering Discord through the Guide, players would need to select a server. We collaborated with engineering to ensure that server images, names, and profile pictures were accurately displayed, just as they appear in Discord.
Server view on Discord desktop app
design explorations
integrating the discord experience
Being new to console design, I approached it with the idea that familiarity would help reduce cognitive load for players. As a result, my initial design explorations mirrored the flow of the Discord web app and led to an unconventional experience for console users.
Menu 3 design exploration - List of voice channels
By showing the full roster of people on the voice channel level, there was too much information to scroll through. Controller input is not as flexible whereas desktop experiences are full of scrolling and free-form selection.
Lastly, the Discord experience heavily revolves around gathering in a voice channel. However, the initial view I had designed was dominated by individuals.
Menu 3 - List of voice channels
design revisions
grouping to reduce scrolling
By minimizing active callers and bundling them with the voice channel name, we freed up space and reduced the amount of scrolling.
Menu 4 - Voice channel
To improve clarity, I added a 'Join Channel' call to action on the third level. With the player now focused on a single voice channel within a server, we gained more screen real estate to present additional details.
Menu 4 - User joins voice channel
The active call interface design was based on the existing Xbox Party Chat experience. I partnered with content designers to ensure the available actions matched the language used by Discord.
The impact
+ 2.5m active users within
the first month of launch
takeaways
align early and often
Since this was my first foray into designing a console experience, I was still familiarizing myself with its common interaction patterns. Aligning with my team helped me identify the right interactions to improve the overall experience.
It's easy to lose sight of the customer experience during a partnership deal with all the moving parts required for a successful collaboration. Communicating early and often ensured we were aligned with the end goal of facilitating an inclusive gaming ecosystem.
© 2024 Josephine Wu
