Design Changes to Last.fm

Friday, 3 August 2012
by Simon Moran
filed under Announcements and Design
Comments: 49

For the last few months, we’ve been working on some design improvements, and after a couple of weeks in beta, we’re ready for our first full release. We’re pretty excited, and we wanted to share some of the details of the new design with you.

What’s new?

On almost every page on the site, we’ve moved the secondary navigation menu from the left side of the page to the upper right. This gives you a wider page, with more space for what matters: the content. On pages where there are a lot of items in the navigation menu, we’ve grouped the less frequently-used items into a small dropdown menu on the right.

Old navigation:

New navigation:

We’ve also redesigned Artist, Album and Track pages from scratch, and rebuilt the page templates completely. Have a look:

An Artist page: http://www.last.fm/music/The+Maccabees
An Album page: http://www.last.fm/music/Rihanna/Loud
A Track page: http://www.last.fm/music/Micachu/_/Golden+Phone

There are three main aspects to the changes:

Tidier, more rational layout.

These pages are very rich in information, and as the site has developed we’ve added more and more content to them. Our user research indicated that it was time to step back and take a fresh look at how the pages were laid out.

The new design groups actions and information together logically so that it’s easier to locate things on the page, and it’s laid out hierarchically, with the things most people use most often nearer the top of the page. We’ve also removed some less-important things from the main page, though most content is still accessible through the menu at the top of the page.

Fresher visual design

We regularly go out and talk to people about Last.fm, and ask how we can improve things. In response to user feedback, we’ve updated the visual design of the page with more emphasis on images, more legible text, and cleaner, simpler graphics.

New page templates

We’ve built brand new page templates, which are more flexible and dynamic, so that your pages load faster and you spend less time waiting for pages to refresh. We’ve only just started to explore the possibilities of the new templates, so expect more optimisations and speed improvements in coming weeks.

We’ve also taken the first steps towards “responsive design” – which means pages working just as well on your mobile and tablet as they do on a full-size web browser. There’s still more work to do before we can release this, so stay tuned!

What’s next?

We’re going to continue updating the site gradually, over the coming weeks and months. We’re also going to address the feedback we’ve already had, from the beta release, with further tweaks and improvements to get the pages just how you want them.

Thanks for reading! We’d love hear what you think of the new designs, either in the comments here or in our forums