Three Days Grace

Lyrics to List

Three Days Grace

Lyrics to List

'Lyrics to List' is a Spotify experience for Three Days Grace new album - 'Outsider'. By selecting three lyrics from the band's repertoire, user create a mood profile which later generates a playlist based on that mood.

UX

UI/UX

UI/UX

After a few brainstorming sessions our team has picked three concepts that would answer the brief - create an experience where users could generate a 3DG playlist based on their feelings or mood. The winning idea is displayed below.

Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by clicking on the yellow edit icon. After you are done just click on the yellow checkmark button on the top right. Have Fun!

I wanted a simple and "out-of-your-way" UI that would disappear as soon as you land on a scene where the user would interact with the illustrations and then commit to reading a peace of the novel for the audition. 

3DG-cover@2x
3DG-tutorial@2x

User had to search for the lyrics that resonated with their mood on a 'lyrics wall'. They would create a mood profile based on four axis - anger, melancholy, love and hopefulness.

User had to search for the lyrics that resonated with their mood on a 'lyrics wall'. They would create a mood profile based on four axis - anger, melancholy, love and hopefulness.

User had to search for the lyrics that resonated with their mood on a 'lyrics wall'. They would create a mood profile based on four axis - anger, melancholy, love and hopefulness.

User had to answer a few simple questions to get to the scene. Instead of using boring forms, we went the Millenial way and designed a chat with two demons - main characters from the novel. 

User had to answer a few simple questions to get to the scene. Instead of using boring forms, we went the Millenial way and designed a chat with two demons - main characters from the novel. 

3DG-lyrics-wall@2x
3DG-mood-profile@2x (1)
3DG-playlist@2x
3DG-share@2x

Cover arts

Cover arts

I also designed four cover art for each of the four generated playlists.

Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by clicking on the yellow edit icon. After you are done just click on the yellow checkmark button on the top right. Have Fun!

I wanted a simple and "out-of-your-way" UI that would disappear as soon as you land on a scene where the user would interact with the illustrations and then commit to reading a peace of the novel for the audition. 

3DG-cover-arts@2x

Early prototype

Early prototype

As a proof of concept for the winning idea I have created a quick video prototype.

Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by clicking on the yellow edit icon. After you are done just click on the yellow checkmark button on the top right. Have Fun!

I wanted a simple and "out-of-your-way" UI that would disappear as soon as you land on a scene where the user would interact with the illustrations and then commit to reading a peace of the novel for the audition. 

Team / Year

Phantom, 2018

Role

UI/UX design, Concepting