There’s been a number of almost-goosebump-inspiring moments during my .NET dev experience such as the first time I saw my code running on a Windows Phone 7. Another one of these moments was seeing my code running on my Xbox One for the first time.

(Note: this post describes pre-release technology)

It is now possible to take your regular Fallout 4 playing retail Xbox One and turn it into a development machine. This allows the running of Universal Windows Platform (UWP) apps. At the time of writing this is in preview/pre-release status with a final release expected later this year.

There’s a great set of documentation on MSDN that describes the following steps in detail. I’d recommend reading through them all before starting the process as there’s a number of warnings that should be observed before starting. For example “some popular games and apps will not work as expected, and you may experience occasional crashes and data loss. If you leave the developer preview, your console will factory reset and you will have to reinstall all of your games, apps, and content” [MSDN].

Also be aware that, to enable Xbox UWP app development in Visual Studio, the Windows 10 SDK preview build 14295 needs to be installed: “Installing this preview SDK on your PC will prevent you from submitting apps to the store built on this PC, so don’t do this on your production development PC” [MSDN]. I created a new Hyper-V virtual machine so as not to disturb my base machine.

The documentation recommends using a hardwired network connection rather than wireless for better dev performance, I used wireless and for this simple app and it was fine. Also note “…system performance in this preview does not reflect system performance of the final release” [MSDN].

Also note that you don’t need the latest Windows 10 preview build to install the tools, the virtual machine I created was just running standard Windows 10 Pro, though as the following screenshot shows this seems to mean that there is no XAML visual preview in Visual Studio.

Overview of Steps

The following is an overview of the main steps required, once again you should consult MSDN for full details/steps required/warnings.

Step 1: Development Environment Setup

[MSDN]

You need:

• Visual Studio 2015 Update 2 or newer (be sure to install the Universal Windows App Development Tools component)
• Windows 10 SDK preview build 14295
• Sign up for Windows Insider program
• Create Windows Dev Center account
• Network connection to your Xbox One

Step 2: Xbox One Setup

Detailed steps from MSDN.

Sign in to Xbox One.

Install Dev Mode Activation app from Xbox One store

Once installed run the app:

This can be a bit confusing as to what to do next, basically just leave it alone, at some point (perhaps hours) an “Update your Xbox” prompt will be displayed. Install the update and wait for it to complete and your Xbox restarted.

Open the Dev Mode Activation app again and following the instructions, to switch your console to into dev mode:

Tip: Make sure you’re connected to your wireless network before continuing…

Once restart is complete, open the Dev Home app:

Take a note of the Xbox One’s IP address:

Step 3: Connection to Your Xbox One from Visual Studio

Create a new UWP project in Visual Studio.

Open the project properties and choose Remote Machine, enter the Xbox One’s IP address, and choose Universal (Unencrypted protocol).

Next run the app, and Visual Studio will ask you for a PIN, head back to the Xbox One dev app, and choose “Pair with Visual Studio”, you’ll be given a PIN that you can type into Visual Studio.

Your app should now be installed and run on your Xbox One!

SHARE:

The Xbox Music API can be used by third party developers (i.e. you and me) to search for artists, songs, albums, etc and also get access to actually play songs.

There are two flavours at present: “unauthenticated” and “authenticated”.

Authenticated access allow playing of full songs and working with user playlists. Playlist changes will automatically roam to user’s other devices. The full access to play full songs requires that the user has an Xbox Music Pass.

Unauthenticated access doesn’t allow access to user playlists, and streaming of music is restrict to 30 second previews.

At present anyone can get unauthenticated access via the Xbox Music RESTful API on Azure Marketplace. Authenticated access is currently limited, you need to apply for the pilot program. I’ve applied for this, hopefully I’ll be accepted so I can understand this part better.

Getting Started with Unauthenticated Access

We need an access key to allow our apps to able to use the (unauthenticated) API. To do this follow these instructions to register and create an application in Azure Marketplace. Don’t worry about the code samples at the bottom of the post, there’s a client API we can use instead.

So now you should have an application registered (you might have to enter some web address in the redirect URI – I’m not sure what this is for at this point).

More...

SHARE:

This is the first in a new series of articles I want to start, noting user experience things I use/see and observing how they could potentially be improved. The articles in this series aren’t meant to be mean or critical, merely observational.

In this article we’ll be looking at the TED app for the Xbox One. (If you haven’t heard of TED before, they are videos of talks on technology, design, art, etc. some of which are deeply moving and inspiring).

Here’s a screenshot of the main menu.

Overall I love this app, clean and simple, it’s also nice that it’s themed white as a change from the other darkly themed Xbox apps such as the Video app.

The groupings on the main menu are nicely grouped and intuitive and follow the basic Xbox One UI patterns.

There are however a couple of specific user experience things I struggle with in this app.

What Video is Currently Selected?

The first is when selecting a video to watch. Take a look at the screenshot below: which video is currently selected? It’s hard to tell right?

The currently selected and not-selected items are too similar, we need the currently selected video to stand out, or to put it another way: there is not enough contrast between selected and unselected.

Below is a mock up of what simply adding the TED red brand color to the selected video border could look like:

Now we’ve increased the contrast/decreased the similarity between selected and unselected videos.

Alternatively we could make the background description color a pale red:

Again these are just lo-fi mock ups but they show some ways we could start to think about making the the currently selected video more easily distinguishable.

Playlist Play

Here is a screenshot of a playlist with one of the videos selected:

Hitting A on the controller unfortunately doesn’t just go and play the video. You have to go across to the “Play talk” button and then hit A. Every time, I make this mistake, and there’s a “cognitive pause” while I wonder why the video isn’t playing.

Moving across to the play button:

To fix this we could simply make pressing A on a selected video in the playlist (as in the first screenshot) a “shortcut” to playing the video by hitting A.

Feel free to comment if you have other observations or ideas for improvement or you think this is a good idea for a series.

SHARE: