Wednesday, 31 August 2016

How Spotify's desktop website UX has changed since 2006

Image result for spotify

Here's how Spotify, a brand which now defines online music streaming, has gone through a number of serious changes (including a major design overhaul) in its desktop website UX.

Here's what I think about the designs,


2006 -  Notice how the UX of the website reflects a rudimentary idea. The elements are well-structured with the right amount of attention  given to every element (notice the large logo and the  mid-sized text that asks users to sign up). However, this doesn't tell users why they should be excited for the service. The idea still reflects simplistic yet minimalist design.


2007 - Here they go a step further to explain what Spotify will be doing. Guess too many users asked them what the idea was! The elements are unstructured, with some (the sign up section) taking too much space. Notice how all the info-text has been boxed into the text-area in the middle. The text is verbose and extraneous, something not every user would be interested in.

2008 & 2009

2008 & 2009 - This is much better. The UX of the website reflects the product of a brand that is both confident and clear of its idea, motive, goals and target audience. The elements of the screen are now well-structured, the info-text is short and simple and all other information has been perfectly categorized with the help of a navigation menu, Notice how icons have been leveraged to succinctly convey the idea. This makes the page less clutter-y and aesthetically pleasing.


2010 - Clearly reflects a brand that is growing and adding many more products/features to its service. Something that the previous designs lacked was the judicious use of white space. This design makes the best use of the space available to get the message to the masses. Notice how text and visuals complement each other while conveying an idea which ultimately contributes towards clean and consistent design.


2011 - Similar to the 2010 design, but now has many more options and visual components. The entire website has a cartoon-y feel thanks to the visual components it uses. Information like product info and subscription is taking up a lot of space. The same information can be compressed and boxed into a smaller space. Also, sections like 'Jobs' which aren't holistically a part of the product can be incorporated in the site map in the footer.


2012 - The site has switched to minimalist design by having a landing page with no other option but downloading the app. Minimalist design has its upside and downside. Upside being that now, the website much cleaner, clutter-free and uniform. However, it assumes the user knows pretty much everything about the service and limits the user's actions (here, downloading is the only option available).


2014 - Great stuff! Parallax scrolling and great imagery, keeps the user glued to the site. The design also sports a trendy, vibrant look, typical of a music website. Also, notice how the features of the free and premium version have been succinctly boxed in a package. This takes up less space and also tells the user the advantages/disadvantages of using any. However, the huge imagery and limited text force the user to scroll a lot to access even little information.


2015 - Much better! The extraneous imagery has been removed and the website now strikes a the balance between text and visuals while maintaining the context, The premium and free package section now uses a compare-and-contrast info-structure to distinguish between the features provided by each which helps the user easily recognize the product and what it offers. The website design has come a long way from what it was in 2011.


2016 - Has the same visual attributes as the previous design. The switch to a more vibrant theme definitely seems to work. Good work in using a scrolling banner. Fits in more information and also, blends well with the design

Tuesday, 30 August 2016

User Experience and Design

User Experience and Design

Just came across this image on a social networking website. While most members of the group that shared this happened to blatantly accept this fact or just laugh it off saying while saying the person who made this seemed to know very little about user experience, I personally think there's a lot more to this image.

User experience (here, user adoption) and design may not always follow the same route when it comes to designing an intuitive and interactive user experience. Consider a use case of an travel website where the customer wishes to just checkout as soon as possible after booking, say, a flight. (The shortcut route). The website has a great design and many interactive components to explore. But, the design is such that, though simplistic, it takes the user through a number of steps like asking if he/she would like to select a hotel at that location, and then maybe a car rental and then maybe a adventure sports trip (The tiled route with great design). This just creates additional pain points for a user who just wishes to book a flight and checkout asap.
Thus, we can say that the design here isn't well aligned towards delivering a good user experience. In a bid to increase sales, the user experience is being compromised.

Another thing to note here is the difference between minimalist and simplistic design. Minimalist design may not always be simplistic and vice versa. UX Myths does a great job of explaining this. A design may be minimalist but may not cover all use cases. The idea is to start from a simplistic design that takes care of all use cases and make it minimalist. Strive towards making a tiled shortcut route that is both simplistic and minimalist. Cheers! :)