SpotifyLive UX music feature design

Skills

UX Design

Visual Design

Overview

By expanding on the Spotify music streaming platform, creating a live fan event for users to stream a newly release song or album with other fans all over the world. This feature creates an interactive environment with fans and the artist through a live stream in one app used for music streaming.

Problem

Some Spotify users discussed how there are limited features and content allowing artists to interact with fans compared to other apps like YouTube. With this problem, the only ways users would need to use other apps like Instagram, Twitch, Youtube, and Pandora Live for interacting with their favorite artist.

Solution

Integrate a live stream feature for user’s to easily interact with musicians without using separate apps and create a fan experience where everyone’s connected with new music releases in one feature

The Audience

These user’s demand for a feature with a streaming app, like Spotify, to deliver engaging content for a personal connection to music . These split categories of user’s for this app feature would be “Live stream fans” and “ In-app music fans”.

Live Stream Fans

These users have multitudes of apps (music or social media) for viewing live content from their musicians. They either use certain apps 24/7 or just when a notification from their favorite artist going live pops up. In addition, some user’s in this category wants Spotify to expand their features for more artist-fan interactions.

In-app music fans

These users are dependent on a music streaming app for the music . They still want to view what an artist is recently releasing but are not fully interested in being a fan. Some user’s just want to only listen to a new album

Obstacles

Both users engaging with new features like this could possibly lead to confusion navigating through a live stream. Users could be wondering where to see a recap live, how to locate the live stream, and how many options are there to interact with an artist and other fans. This feature would help by creating simple navigation tools and visuals for any user to understand any type of difficult navigation plus create certain ways fans can given a live experience from one app.

Feature Strategy

Value 1

Spotify users would need to locate the newly released album without getting confused or lost after the live ended.

Suggestion 1

After the live stream is done, users can see a newly released album or song located first under the albums section. In addition, there will be a highlight animation and “new release” small text indicating where to tap for the new release.

Value 2

What are some possible ways the feature curates a fan experience for Spotify user’s without being too complex?

Suggestion 2

While in the live stream, users are encouraged to react with any song using a live chat feature and likes button. Also, after a live stream ended, the artist would select any fan comments correlating how users felt about an album on the SpotifyLive icon located in the music player.

UserFlow

Full link: https://www.figma.com/board/vJoWTHBeiZGVLQTST56gCH/Ming_Artis_UXMusicAppUserflow_Figjam?node-id=0-1&t=Nl2FE60Aceh6IsMl-1

Wireframe Solutions

In the beginning stage, there were two different layout ideas for a main live stream page for user’s to know a new released song is playing. The left wireframe consists of a glowing ring moving in time while the music is playing. The right wireframe would show the album or song art with sound wave bars in the background moving with the music playing. Both wirefame ideas guided a choice whether the user would know if a song is playing during a live stream.

Designing the feature

After designing my main live stream pages, two designs from my previous wireframes are displayed using Spotify’s color scheme, icons, and similar typeface used within the app. Both designs are easy to navigate with buttons on the lower middle and a simple live stream design for user’s to interact. However, the selected design was more simple with connection to user’s obstacles and understanding how a can this be interpreted without context. The inner circle displays an album cover, glowing rings to visually indicate a song playing or an artist speaking, and a progression circle to show how long a song can be.

Selected design

Alternative design

Designing the feature

The live chat became another portion that was both viewed as easy to navigate with a simple live stream design for Spotify users. However, the selected design would help users to view everything on the main live page at once without switching over to a different screen.

Selected design

Alternative design

SpotifyLive- Live experience for fans

The feature combines functions found in live streaming platforms, but for new releases with songs and albums. What to join a live stream curated by your favorite artist celebrating and hyping up a release with other fans? Interested in a Spotify feature where interacting with an artist can be a press away? Want to be apart of your artist's album being represented as a selected comment? SpotifyLive creates a digital fan experience without using additional live streaming apps. Interact with any artist live streaming a new releases before being available on Spotify. With this feature, any user can send messages, emojis, or emotes created by the artist’s marketing team. After the live stream ended, users with the most exciting comments will be mentioned on a music player tab across all songs played within the live stream.

Solution

Artist page

Main live stream page

Live chat

Live chat with emotes and emoji for live stream

Artist page post live

Music player

Take Away

After completing this project, there’s different ways Spotify could create features to encourage more fan and artist interactions through the app. As well as a market integrating live stream options in Spotify. The streaming service has created a few functions for users to interact more in the app from short questionnaires about music and horoscopes to Spotify Wrap. There’s much to explore with a live-stream music party for new releases.

Overall design work

Previous

Blossom & Bloom shop website