Site Logo
bad ui ux

    Spotify - The Problem Child #1

    Spotify is on of my most used apps in my daily life. You could call it my daily driver. While the Spotify Desktop experience became mostly stable and decent in recent years the design decisions for the Spotify mobile apps are rather ux disasters.

    The Problem

    Below is a typicial Spotify iPhone App startup.. looks all right (besides the long loading time), doesn’t it..?

    For me there are two things that struck my eyes:

    1. The profile image color changes (at 0:09)
    2. The order of the content is changed after it the loading is completed (at 0:12)

    The Profile Image Color Change

    The color change of the profile image is not a big deal. You either don’t notice it or you don’t know what it means. It probably indicates a back online1 or loading complete state of the app. However, I dont get the reason behind it.

    What would I do differently?

    It might be hard to test if a user has ever notices it. The best way to test it would be in a user interview. Otherwise Spotify should show a notice about it’s reason or completely eliminate it.

    Content Reordering

    The more severe problem is the content reordering after loading of the Home Tab is complete. An obviously simplified app flow could look like this:

    flowchart LR s1["App Start (Home Tab)"] --> s3[Refresh Home] --> s4[Load Metadata] & s5[Load Details] --> s6[Finish Loading]

    Instead, Spotify is using an app flow such as the following:

    flowchart LR s1["App Start (Home Tab)"] --> s3[Refresh Home] --> s4[Load Metadata] & s5[Load Details] --> s6[Finish Loading] --> s7["Refresh & Reorder"]

    This can (and will) lead to a user clicking one of the content buttons (podcast, interpret, album) while the reordering process changes the content of the underlying button which then results in a completly different action. This is compareable to a search engine changing its search results a second after the results are displayed. And this is just bad ux design. It happens quite a few times a week that my fingers are faster than Spotify’s reordering process so that a random podcasts starts or I go to the details page of an artist I’m not in the mood for.

    What would I do differently?

    1. For the initial app start: use a skeleton spinner until the reordering process is complete
    2. In case the app’s state is still cached but a content refresh is available: just don’t show the new content. Let the user refresh the content by himself. Let the user click a refresh button or let the user pull down to refresh. Just don’t change the visible and currently most probable interactive content.

    1. There is a visual indicator if you’re offline of back online in the Spotify App which makes the use case to indicate the network status via the profile image color unnecessary ↩︎