Research & Analysis: I began looking into existing research and our current competitor solutions. I discovered there needed to be more clarity in the UI of the Xbox Status page. Most participants in our studies needed help to parse the information they were being shown.

Information Architecture: Based on the research findings, we restructured the webpage content, prioritizing features and information according to user needs, like adding a status key to the page and prioritizing information to be disclosed when needed. Gamers could start at the initial set of information and, when necessary, move to the secondary set—exposing our hierarchical structure to the gamers rather than forcing them to discover it on their own.

Wireframing & Prototyping: We designed low-fidelity wireframes to visualize the new layout and navigation, iteratively refining them based on user feedback. Afterward, we built a high-fidelity, interactive prototype to test the design.

Usability Testing: We conducted usability tests with a diverse group of gamers to validate the design and identify areas for improvement. Based on the feedback, we made necessary adjustments to the design.

Visual Design: We developed a cohesive visual language, including color schemes, typography, and iconography, ensuring consistency throughout the eco-system.