Role
UI Designer
Client
Spotify Vietnam - Happiness Saigon
Tools
Adobe Photoshop, Figma, After Effect, paper and pencil
1. Objectives
Spotify's Indie Viet is a monthly campaign for supporting Vietnamese indie artists. The campaign began on July, 2020 with the promotion of 3 focused artists each month. The website is for collecting the fans' pictures, which will be used in the artist's collage.
The landing page.
2. Insights & Problems
As the nature of indie music industry, the artists and their fans have a strong and sympathetic connection. Therefore, it is essential to have a platform for the fans to show their love for the artists and vice versa.
Allowing the fans to upload their selfies and get it mixed together with other fans to create the artists' profile pictures, the website only runs for a certain period of time. It encourages the fans to try when it is still possible and share it on social medias as a "trendy" post, as well as expressing their affection for the artists they love.
Different seasons of the campaign in social medias and OFH advertisement. Link to the Spotify playlist.
3. Visual Design
Following the Spotify visual brand guidelines, simple and strong graphics style were used for all UI elements.
Three core colour combinations represent three different artists, Duc Phuc, Amee and Binz. The change when switching between each artist runs with fading effect for a smooth and mellow transition for the eyes.
Walk-throughs the interactive prototypes.
4. What did I learn?
A touch of animation: A simple animation on the iconic Spotify logo was made as quirky highlight of the website flow. It acts a loading page and side distraction on the last page. The website itself follows strictly Spotify brand guidelines so a small animation was able to bring a fresh, funny and vivid sense to it.
Respecting a big brand design guideline: Spotify provides a very detailed guides and measurement for specific graphic and image propositions. I have to keep track of them all the time along the design process.
Simple animation to support the website flow
Obstacles do happen: After rounds of revisions, the client had to cancel the website project due to legal issues. It did send a wave of disappointed and frustration to the whole team, including accounts, copy writers and designers. However, we saw it as an opportunity to practice on web design and get our hands on a big design system such as Spotify.