Xbox.com - splash page

  • January - 2011

A project on Xbox.com where I got to help promote some of my favourite AAA titles on Xbox and use my CSS/HTML/Silverlight skills to construct a reusable page layout.

javascripthtmlcssc#jQuery

The Xbox splash page project was to enable Xbox.com to supply bespoke product pages for their AAA and Arcade titles on Xbox.com. Providing enough flexibility in design so as to give them their own unique look and feel to complement each game's personal branding.

Xbox.com - Bioshock Infinite
Xbox.com - Bioshock Infinite

Using base CSS, the page handled the initial scaffolding of the page and styling aspects such as font-size/colour and white space.

Xbox.com - Bulletstorm
Xbox.com - Bulletstorm

Each splash page would then be given bespoke colours and imagery to set the tone for the game and minor CSS tweaks would be made to accommodate (such as margin and padding).

Xbox.com - Trials Evolution
Xbox.com - Trials Evolution

As well as the HTML build, I was also given the responsibility of maintaining the page's Silverlight player. A custom player which could handle configurable colours, assets, playlists, and iconography. It could also handle social media shares and smooth streaming of live events.

Xbox.com - Marvel vs. Capcom 3
Xbox.com - Marvel vs. Capcom 3

Although only small pages, the Xbox splash pages are one of my favorite contributions to Xbox.com. As gamer it was a pleasure to be able to build out promotional content for the games I personally enjoy. I would later revisit this idea of 'reusable' markup and CSS with the introduction of components CSS frameworks.

Other Technologies and Practices