We use cookies and other tracking technologies to improve your browsing experience on our site, analyze site traffic, and understand where our audience is coming from. To find out more, please read our privacy policy.

By choosing 'I Accept', you consent to our use of cookies and other tracking technologies.

We use cookies and other tracking technologies to improve your browsing experience on our site, analyze site traffic, and understand where our audience is coming from. To find out more, please read our privacy policy.

By choosing 'I Accept', you consent to our use of cookies and other tracking technologies. Less

We use cookies and other tracking technologies... More

Login or register
to apply for this job!

Login or register to start contributing with an article!

Login or register
to see more jobs from this company!

Login or register
to boost this post!

Show some love to the author of this blog by giving their post some rocket fuel 🚀.

Login or register to search for your ideal job!

Login or register to start working on this issue!

Engineers who find a new job through JavaScript Works average a 15% increase in salary 🚀

Blog hero image

Redesign of the Spotify Home Screen

Adrian 20 September, 2018 | 2 min read

Spotify is one of my favorite apps of all time, through which I was able to discover more music that I like.

However, as much as I like how easy Spotify has made it to search for music and get legit recommendations, one major fact is still bothering me till this day:

“I simply don’t use their home screen enough!” or “I still haven’t figured out how to use the home screen!”



But why? Here are some of my thoughts:

ezgif.com-optimize.gif

1. Too much scrolling

First, I think lengthy scrolling allows for too many options (15 in total), and too many options makes it hard for the user to choose, and raises their anxiety. In the long-term, they’d simply abandon the home screen, especially for Spotify’s case, where without the home screen, users can still use the app with no complaints.

Second, lengthy scrolling makes it hard to find the target. Users have to scroll two full-screen size lengths to get to their “Recently Played” every time! It’s already screaming bad design. “Recently Played” is available in “Your Library” screen, but if the user wants to access it through the home screen, it isn't that accessible, and it only adds frustration.

Third, lengthy scrolling makes it easier to jump over content in the middle because we all know people’s focus point is always at the beginning, and end.

To make all these worse, the titles are relatively tiny, and there’s no separation between each session. It becomes frustrating and confusing very quickly if users are not taking their time to scroll slowly and look through the content.

blog2.png

2. Still, too much scrolling (horizontal this time)

Just when you think you’ve finally found the topic you’re interested in. Here comes more scrolling! And horizontal scrolling is even worse because scrolling horizontally is less efficient due to the fact phone width is way shorter than the length and is uncomfortable for your finger!

Check out below and look at all the beautiful artwork you probably would never be able to see, because, at this point, you’re really tired of scrolling.

ezgif.com-optimize (1).gif

Now the question is: how can we make it better?

The answer is simple: make scrolling significantly less.

By adding a top scroll horizontal bar as shown below, scrolling can be reduced without having to compromise the content.

blog4.png

Why is this a better design?

First, even though we still have 15 topics, they’ve been concentrated to the top area and made easier to identify and quicker to scroll through. What’s better, each topic now has its own dedicated page, cleanly separated from each other.

Second, each topic now has more space, a full phone screen size to display more artwork. The number of artwork quickly tripled, from 2 in one screen to 6, thus reducing the total times the user has to scroll.

Third, more images are shown and less text, which makes the app more visually appealing.

Fourth, from the point of view of a developer, it would also be easier to implement if at some point, we decide to add a feature of preselecting a topic for the user based on their activities or preference.

Originally published on medium.com

Author's avatar
Adrian
    Java
    HTML
    Mathematica
    C++
    Objective-C
    CSS

Related Jobs

Related Issues

viebel / klipse-clj
viebel / klipse-clj
  • Open
  • 0
  • 0
  • Intermediate
  • Clojure
viebel / klipse
  • Open
  • 0
  • 0
  • Intermediate
  • Clojure
viebel / klipse
  • Started
  • 0
  • 1
  • Intermediate
  • Clojure
  • $100
viebel / klipse
  • 1
  • 0
  • Intermediate
  • Clojure
viebel / klipse
  • Open
  • 0
  • 0
  • Intermediate
  • Clojure
  • $80
viebel / klipse
  • Open
  • 0
  • 0
  • Advanced
  • Clojure
  • $80
viebel / klipse
  • Started
  • 0
  • 2
  • Advanced
  • Clojure
  • $180
viebel / klipse
  • Started
  • 0
  • 1
  • Intermediate
  • Clojure
viebel / klipse
  • Started
  • 0
  • 3
  • Intermediate
  • Clojure
  • $80

Get hired!

Sign up now and apply for roles at companies that interest you.

Engineers who find a new job through WorksHub average a 15% increase in salary.

Start with GithubStart with Stack OverflowStart with Email