Xbox One Dev Tools
DESIGN DIRECTION, UX/UI DESIGN
Xbox One dev tools are a rebranding of the entire ecosystem of the Xbox developer tool set. The ecosystem was not only for applications on the desktop but for the console and marketing materials (I.e. email, PowerPoint, website) that would be used as the primary outreach to the Xbox development community.
The end to end developer experience was an extensive ecosystem reaching from pre-production to production to post production with applications and services that ranged in between. Many of the applications had their own branding and style and some were even legacy applications from Xbox 360.


Through many months of looking through the entire system and all the applications that were offered I was better able to understand what role they played and how I could reimagine them to make them better moving forward for developers within the community.
EXISTING ECOSYSTEM
Defining the Spectrum
Through research and discovery, it became very evident and clear that there were a few paths that were within the ecosystem and what their uses were.
​
Application Tools
The primary focus of application tools is utility and functionality over heavy graphical interfaces that are commonly over saturated. Light use of graphics is considered acceptable when appropriate but iconography should be the first consideration over anything else.
Customer Engagement Tools
The primary focus of Consumer Tools is to entice and engage our markets with strong visuals that convey key benefits and offering within our system. The use of graphical interfaces that are saturated with device photography, photography, colors and iconography are greatly encouraged to be used throughout any outwardly facing consumer experience.
Modernizing the system
After getting a full breath of all the applications and with a clear make-up of the ecosystem. I took some time looking at examples and created mood boards that reflected the type of modern clean design that I was looking for that would will be timeless and also adhered to the styling standards that Xbox people identified with.


For the logos I tried to create an aesthetic of having an image to represent what the application itself did along with a clear identifier that identified to the family line of the product.
For colors it was important to maintain the use of Xbox colors and also incorporate the colors from Windows 10 because the applications were being used both on Xbox and on desktop.
Making it work
It was paramount to create patterns, controls and flows that were as similar as possible across the different applications in order to create consistency and ease of use when pivoting between applications. Below is an example of Xbox One manager hierarchy and models.
UX TOOL EXAMPLE
Living across the ecosystem
By reimagining the ecosystem, it redefined the developer tool experience. Below are a couple examples illustrating the UI both in light and dark theme as well as for desktop and Xbox app experiences in consumer and in developer application mode.
TOOLS UI
