Case Study
Popsio Music Discovery
This is an individual project from the DesignLab 101 course.
- My Role
- Brainstorming, sketching, branding, low-fidelity, high-fidelity, prototyping
- Timeline
- 4 weeks, May – June 2020
- Tools
- Figma, Adobe XD
User Research
I conducted two user research interviews, one in-person and one conference call interview. The major questions I was interested in exploring were how people listen to music, their preferred music player, what they like about their current experience, what's missing, and what other music players they had tried. The results from these interviews helped me to gain a clearer perspective of the problem I was trying to solve for.
How might I recommend new music given that users don't enjoy in-app or email notifications for new music releases? How might I help users track music releases from different artists in a convenient way?Ideation
After examining the responses in my user interviews, I found that users are interested in keeping up with new artists — however, they do not like notifications and want to find all the new music they want to listen to in one convenient place. Idea: An application that streamlines users' experience with viewing new music releases by providing a subscription feed for new music releases.
Branding
The process of deciding brand guidelines began with creating a mood-board to spark direction for my design. The images in the mood-board evoke feelings associated with the Popsio brand, with keywords being 'Urban' Music and 'Pop Aesthetic'. The Popsio logo was my first attempt at creating a vectorized logo and I went through many iterations to create one that was both memorable and easily recognized in many sizes.
Style Tile
The visual language was distilled into a single tile — colour palette, type scale, iconography, and component treatments — to lock down the brand direction before moving into high-fidelity design.
Design Process
Sketches made to find the right designs in the beginning stages of the design process.
High-Fidelity Wireframes
I initially went with a muted design, and after getting feedback from my mentor, I changed the images to the imagery that evoked more of the Popsio brand feeling from the mood-board. I also incorporated bright colours like the pink brand colour, and removed the recommended home directory.
Final Design
The final screens — Last Played, Discover, Subscription Feed, Recent Releases, and the Player — built around the pink brand colour and the imagery from the mood-board.
Prototype
A walkthrough of the core flow — from the home screen into the subscription feed and player.
Learnings
This was my first personal project where I was involved with every step and had complete product ownership. It was such a fun learning experience and these were my main take-aways:
- Goal and User POV: Always referring back to the project goal and designing for what's necessary to solve the user POV to meet project constraints.
- What is good design: Learning when to focus on the visuals, and when to adapt and use the right design patterns.
- White-space and Consistency: The importance of having the right design fundamentals — designing with appropriate white-space and making elements consistent.