Menu

Front End User Interface

Home / portfolio / Front End User Interface

Project Spark: Front End User Interface

Team Dakota | Microsoft Studios

I was able to work on the breakthrough title, Project Spark (codenamed Dakota), as an UI Artist and Designer. I started the project about midway into the development cycle and even at that stage, was blown away by the potential of the game. Project Spark is an open-world digital canvas that enables anyone to build, play, and share whatever they can imagine. It’s a powerful, yet simple way to enjoy your own worlds, stories, and games.

The following screens were designed even before the beta announcement of Project Spark. Therefore, a forewarning that a lot of these screens will not make it to the final product. Anyhow, I can at least explain some of the design and inspiration behind all of this work! The following screens show the path from booting the game, sorting content, selecting a game and then the load screen before actually playing the game.

When I first joined the project, we were developing for tablet/PC. Later on we added Xbox One and Xbox 360. This proposed a huge challenge for our UI team as we had to design for touch, mouse/keyboard and controller.

We wanted to really focus on pushing content to the user. We knew that there were going to be two categories of users: players and creators (and we hoped a fusion of both). For that reason, our system for finding content had to be easy.

Project Spark Front End UI
Project Spark Front End UI
Project Spark Front End UI
Project Spark Front End UI

As a user, we knew there were going to be certain categories that the base user would want to search. Content that is highly rated, new, popular/most downloaded and content that was played by their friends. Other categories could easily be added or modified to curate the feeds.

Project Spark Front End UI

Once a user reached their category of content to browse, we introduced them to additional data and tags that were applied to each piece of content. Tags are keywords that the original creator applies to their game/content after creating it to allow for more in depth and reliant searches. It also helps the player decide whether the game would be something that they would play or be interested in remixing (taking another creators game and modifying it).

Project Spark Front End UI

This screen would display before and after playing the game/content. The user could immediately remix the game to make it their own, check the leaderboards for glory, report (positive or negative) or search other content that has related tags and/or users.

Project Spark Front End UI
Project Spark Front End UI

The following screens show the flow of options screens from the main menu. These options would change depending on what type of system the user was on (computer/tablet or console).

Project Spark Front End UI
Project Spark Front End UI
Project Spark Front End UI
Project Spark Front End UI
Project Spark Front End UI
Project Spark Front End UI
Project Spark Front End UI