The brief

Yep, that along with the information that we were creating a site for an urban music brand with a focus on electronic dance music was the brief. Pretty basic stuff but exciting to create something new from scratch. I had a really short deadline, I had just over a week to get initial designs ready for review.


The first step was to look at how sites were styled for existing music sites for dance music. Working in commercial radio I thought it would be important to focus on artists that had made it into the charts rather than underground music. I was particularly interested in the use of typography, many sites used thin, angular fonts and a lot of uppercase.

The wireframe

To get me started I was given a basic wireframe which outlined the content which was needed in the visual:

First round of designs

As the branding was still being worked I had to keep styling to a minimum focussing on the colours provided. I chose some Google web fonts which were in keeping with the styles I’d found during my research:

Route 3

click images to view in browser

After having these designed reviewed it soon became clear that we couldn’t create the right look with no background story so a little more was revealed: the website was to be a sister site to Capital FM and a rebrand of Choice FM. Below is how Choice FM used to look:

Given this new information I decided that to help this new brand stand out from the crowd and to carry over a bit of Choice FM’s legacy we should consider a dark themed website. To me this made perfect sense with the urban music scene and the nature of the events which would be promoted: late night events, underground gigs and warehouse events.

Second round of designs

click images to view in browser

After another review with the key stakeholders we were asked to make the site feel more on brand. A challenge considering we didn’t know what the brand was yet. As a result we were given access to the Capital Xtra logo. It became clear that dark grey was clashing with the logo so we changed the website background to dark blue. This was immediately approved and we could start the development.

Website specification and development work

This was an incredibly busy time. I had the task of working with current development work, creating specs for future development work – this was essential for the development team to be able to continue working while I was focussing on different projects.

Here’s some examples of the technical specs created:

click images to view in browser

I also created PSD templates for the brand new editorial team and set up all assets needed to style our universal apps, UK radio player and social media pages for Capital Xtra.

The fonts I chose for the website were taken into consideration for the style guide chosen by Marketing. The website has now really taken on it’s new identity head first and there have been some really exciting tv and radio campaigns by the Global Radio marketing team. There are lots of areas I’d love to go back and improve on but this project was a real testament to team work, iteration and lots of xtra (sorry) hours.

Leave a Reply