What a difference ten years makes

Web design has changed a lot in the last decade. Here I’ll be analysing Spotify’s website through the years and discussing key changes as I view them.

The early years

“People Just want to have access to all the world’s music” – Daniel Ek.

Spotify was founded in 2006 by Daniel Ek and Martin Lorentz. It officialy launched in 2008, with the beta being available in 2007. It has since gone on to reach 100 million active users-as of May 2016.

2006

2007

These two designs were to advertise the desktop app before release. They allowed users to sign up to updates via email. Both are lacking in any type of images excluding the logo.

The latter screen shows a distinct waste of page space and disjointed symmetry. The 06 site does a much better job of making me feel enagement and enticing me to sign up. The font size is much easier to read on the 06 site too, while the other is unusually small, especially given the vast amount of empty space.

2008 & 2009

This one is actually not bad for being 8 years old. The navigation bar looks elegant — it could use some more links on it as it is quite barren looking, but overall it is appealing. Good use of imagery helps to build a brand image (this looks like a sophisticated way to listen to music).

Body text could have more spacing and be larger. The icons are too large. Interestingly there is a larger column of whitespace on the left than on the right side and it looks unprofessional when you notice it. The sign up bar from before would look more welcoming than the unavailable message, overall this is quite good though.

2010

Use of imagery showcasing the product which is good, makes it quick to grasp what it does and makes you more likely to want to use it. The cards look stylish and perhaps even ahead of their time here (cards have recently become a major design trend).

All other graphic elements are handled well. It is minimal but tells you All the key information you’d be able to handle It At a quick glance, you can click to find out more — this is smart design, which is browsing more intuitive.

Spotify mobile has been introduced, a big expansion of the brand at the time and a convienent way to stream music on the go (has the wow factor, remember this is 2010).

They have included the ability to log in and provided social media support too, this is a big improvement.

2011

This is similar to the 2010 site but some of the changes are a little weak.

The lists of product features is quite cluttered, also the inclusion of the unlimited subscription seems unnecessary and a bit of a cash grab at the user’s expense, with the exception of no adverts it offers nothing over the free version (Spotify thought so too and later discontinued it).

The graphic elements are quite ‘cartoony’ which loses The idea of count and elegance which was present in The previous designs.

2012

Here they’ve gone all in on minimal design, with the site displaying a landing page with a call to action and nothing else.

In some ways this works and in others it does not, it gets straight to the point (downloading Spotify) but it is distinctly lacking in descriptive information such as showing the features and mobile device functionality.

2014

Now we’re getting to the really good stuff. From here on out all the designs feature parralax scrolling.

Imagery is good, using high-res photos which convey a sense of fun and style. The logo has changed and is a noticeable improvement over the old one. Font typeface has changed, text is larger and easier to read. Elsewhere, cards have made a return.

There is a call to action that catches the eye, although the free version isn’t given as much attention as premium. Overall this is well done.

2015

The call to action is better, as it now shows the free option having equal importance as the premium service.

All graphic attributes look captivating, 3) Engaging. The use of vibrant colour gives it a ‘cool’ look and also evokes The feeling of summer & Festivals putting the user in the mood to listen to some music.

It’s very appealing while being easy to use.

The design of the list of features for each subscription has come a long way since 2011. It’s clean, concise and all important information is displayed and easy to locate.

Playstation application is lsited alongside a web player, which shows further expansion for the brand and an extra way for users to engage in the service at their convenience .

2016

Picks up where the previous design left off. This one features the same style of visual design attributes. Vibrant colurs make a return but with different hues. Body text colour is mostly white and this gives a slight increase to legibility, particularly against the vibrant backgrounds.

‘Play on all your devices’ tagline shows the importance the company puts in being easily accesible and how valuable the mobile market is right now.

The white text in the footer is certainly more eye-catching than the grey used in the previous footer. Social media icons are back and look the part. Smooth icons are trending right now, Vibrant Hues (Bonus points for that). They’ve hit a sweet spot between form and functionality and offered to a website that is as simple to use as it is good-looking.

10 years of Web design history right there. It’s amazing how far things have come, Even the changes since 2011 are of a huge magnitude. What’s in store for the next 10 years? I’d expect VR and AR to play a part in future designs but who knows, I can’t wait to find out!

Big thanks to UX timeline for sourcing the images. They have a whole host of images for the lifecycles of different websites, so be sure to check them out here.

If you enjoyed this piece, please leave a ♥.