Spotify

How do we bring the spirit of Valentine's Day to the streaming platform?

Event:

Date:

Timeline:

Role:

Skills:

Tools:

Team:

Student project

February 2020

3 weeks

UX Designer (Desktop), Animator

Strategy, Concept, UX/UI, Prototyping, Motion Graphics, Animation

Figma, Adobe Illustrator, Adobe After Effects

Amanda Thao, Meghan Callahan

We created a limited edition feature for Spotify to celebrate Valentine’s Day, affectionately titled “The Spotify Mixtape”.

 

The Challenge

Pick a brand and create an interactive digital experience incorporating motion graphics for a Valentine’s Day campaign.

The Opportunity

Spotify already curates genres for love and romance and has a playlist titled “Valentine’s Day Love”. What it doesn’t have is a branded experience that truly extends the feeling of nostalgia and companionship that is associated with the holiday.

The Solution

Bring back the art, emotion, and nostalgia of mixtape making to the current Spotify playlist experience through a branded Valentine’s day special feature to strengthen customer engagement and positive user experience.

Introducing Spotify Mixtape

A Valentine's Day limited edition digital experience 

The Spotify Mixtape allows users to curate their own playlists, add personal messages, and send a virtual Valentine to their loved ones. With the Spotify Mixtape, we hope to re-introduce the art and care of mixtape making within the modern world of digital technology. We hope that this feature can bring back fond memories for our older generations of listeners and create exciting new experiences for our younger listeners.

 

KEY FEATURES

Dedicated landing page

Your Valentine's Day home page

Like the rest of Spotify’s branded content, we designed a landing page to host all the mixtapes that a user might make plus a section featuring Spotify-curated mixtapes that could be created in-house.

Customizable cassette cover

Choose your flair

 

We were inspired by classic 80s cassette tapes and color schemes and created five mixtape cover templates that users could choose as their playlist avatar.

Personalize your message

Add those Adele lyrics, get super cheesy (if that's your thing)

We maintained the current interface that is used to create a new playlist in Spotify and modified it to “Edit Mixtape Details”. On this screen, users can customize their mixtape title and add a special message to their intended receiver. Users can also change their album cover template if they choose to.

Choose your recipient (s)

Send a mix to your boyfriend, girlfriend, best friend, mom, cousin, pet!

After choosing a template and inputting a title, users can add a recipient(s) to their mixtape. Users can search via their Spotify friends, or choose to send via email, social media, or copy a link to a Spotify URI.

Pick a song to start

The first song is the most important

Once a recipient(s) is selected, users can begin adding songs to their mixtape. We offer three suggestions - one song from an artist that is frequently listened to by both the sender and recipient, a top song from the sender’s listening history, and a top song from the recipient’s listening history. Users can also search for a song title, or browse recommendations from Spotify.

Keep curating

This is your masterpiece! 

Once a user picks their first song, they are taken to a standard playlist page where they can continue adding songs to their mixtape. We embellished the “Made for” text that is seen on regular Spotify playlists to say “Made for ‘recipient’ by ‘sender’” for a little added touch.

Confirm mixtape details

Refine those small details, add more people, or change album cover

Once a mixtape is completed, users can confirm their details and make any last-minute changes that they need to. Just hit “send” to complete the process.

Wrap up your mixtape

You're all set!

Once a user hits “send”, they see a lovely animation of their mixtape cassette being folded into a Valentine’s Day envelope and shipped off to their recipient.

Receiving a mixtape

Made just for you

Recipients of Spotify mixtapes can access them on their mobile devices. You will first get a notification from Spotify saying that your ‘sender’ has sent you a mixtape. Once you open the notification, it will launch the Spotify app and unveil the cassette animation and mixtape.

 

THE STRATEGY

Personas

Jessica and Amanda are best friends.

They’ve been practically inseparable since high school. Despite going to different colleges in different states, they managed to stay in touch over the years, and sharing music was one of their favorite ways to stay connected! But the older they get, it’s getting harder and harder to find time to keep in touch with each other with both of them now working full-time jobs. Frankly, it’s hard to even have time for themselves to discover new music like they used to.

At the turn of the new year, Jessica gets a call from Amanda -- who is now engaged and asks Jessica to be her maid of honor! Jessica is thrilled, and she now has the daunting task of helping Amanda create the PERFECT wedding reception playlist. Yeah, the wedding is still a year away, but Jessica's the type of person who knows you can never be too prepared. Stuff like this takes time! And the wedding playlist has to be the embodiment of the couple’s love.

All of a sudden, it’s like Jessica is back in high school again, discovering new artists and songs just like she used to! One day while she’s browsing new songs, she spots an ad on Spotify for the
“Spotify Mixtape”. Intrigued, she clicks the link to see what it’s all about. Ah...that’s right, it’s Valentine’s Day, she remembered blasting Spotify’s “Love Songs” playlist last year. But something looks different about this “Mixtape” thing...

She decides to create a special
playlist for Amanda -- 1) as a reminder of their high school days and 2) as a test run for the wedding playlist (gotta kill two birds with one stone!). It’s a pretty emotional ride, and Jessica feels a wave of nostalgia hit once she’s finished making Amanda’s mixtape that’s now full of songs from their high school days plus new goodies she’s just discovered.

Jessica sends her perfectly curated playlist to Amanda, who is also overrun with nostalgia, especially after hearing the throwbacks. Jessica's mixtape is a wonderful Valentine's Day gift, and Amanda knows now without a shadow of a doubt that she picked the best person to be her maid of honor. Amanda shares the playlist with her fiancee as well (an added Valentine's present from her to him), and the couple agrees that no one knows their bond better than Jessica.

User Journeys

We created two user journeys - one for the sender and one for the recipient.

 

In our initial prototype, we decided to design specifically for desktop for the sender’s experience and mobile for the recipient’s experience. The main reason for our choice initially was the time constraint that we had for this assignment. Additionally, we found that the Spotify mobile application has more restrictions and limitations in its feature set, especially for users that didn’t have Spotify Premium. We led us to our driving value statement...

Love belongs to all.

Valentine’s Day doesn’t just have to be about one type of love. It should be a celebration of all types of love between all different kinds of people--friends, family, neighbors, and even self-love. We believe that with Spotify Mixtape, we can pay tribute to the traditions of the holiday and also make it open to all to enjoy.

Nothing says I love you like

Music. It’s one of the most beautiful things in the world, and it’s even more beautiful when shared with the ones you love.

Music can transcend language, nationality, race, and gender and unite us all as humans. At the same time, it can be such a powerful instrument to showcase one’s individuality and mark one’s identity. Music can be an incredibly personal experience, for both the artist and the listener. So many hit songs have been written from true individual experiences of heartbreak and happiness, but these experiences can be understood by almost everyone.

A blast from the past

There’s something magical about the analog age (and I know, I know...it hasn’t been that long since we were there).

But seeing how technology and the world has changed so rapidly over the last two decades makes one yearn for simpler times. Back in the day, creating mixtapes was an art that took time to perfect. Nowadays, we can create easily create hundreds of playlists in a day’s time but also delete them just as easily. In building this feature, we wanted to take advantage of Spotify’s efficiency and ease of use while also bringing back the emotion and care that came with the curation process with mixtape making.

THE PROCESS

 

Moodboards

Getting inspiration

We created a series of moodboards to help spark inspiration for our prototype. We also studied Spotify's existing visual design and illustration style to ensure that our feature felt like it fit within the larger brand ecosystem.

Design system

Setting a baseline

We created a design system based on Spotify's brand and design guidelines, adding in our own flair specifically for the Mixtape feature and cassette colors. We kept Proxima Nova as our main font and went with bright and bold colors for our cassette illustrations to evoke the vibe of the 80s and 90s.

Wireframes

Outlining our feature

We designed low-fidelity wireframes and prototypes on top of Spotify's existing user interface to make our feature feel more realistic. This allowed us to tweak our prototype's functionality without worrying too much about aesthetics.

Illustration and animation

Using motion to convey emotion

We wanted to play off of the fun of Valentine's Day and created an animation showing music being loaded onto the cassette mixtape and then folded into a Valentine's Day envelope.

User Feedback

"Beautifully executed...as someone who's made mixtapes in the past, this is a clever way to tie in something from that time to a digital platform."

 

"A great way to introduce things like mixtapes and cassettes to a younger generation."

 

"I could see this being implemented tomorrow."

 

"It makes me happy. It's an easy way to tell someone you love them without taking up too much of your time. It's fun! I can already imagine who I'd want to send one to.

 

 

Reflection

Design for humans, design for happiness

The original assignment for this project was simply to create an animation, which we did with our Valentine's Day card animation. But we wanted to push it even further and see how far we could take our concept. It was hard work, but we had such a terrific time building it. As someone who grew up at the cusp of the digital revolution, I often find myself yearning for the simpler days of the past, and this project was a great way for me to bring that love of nostalgia to the present day.

Amanda Thao | UX Designer (Mobile), Animator

Meghan Callahan | Art Director, Illustrator, Animator

Let's connect! 

 

marisliu16@gmail.com

  • LinkedIn
  • Instagram