From pixels to melodies

: image based playlist generation

AI Generation

ML Integration

Personalization

Inspiration

As a passionate music lover, I’m often selective with playlists, yet finding one that truly matches my mood can be challenging. One day, while taking photos to capture the moment, I realized how powerfully visuals convey emotions. This sparked an idea: why not connect photos with music? This led me to imagine a way to bridge photos and playlists, intuitively blending my specific mood and moment with the perfect music, without the hassle of browsing countless options.

Role

Product desginer

Timeline

May 2023 - July 2023

Project

Personal Project

tools

Figma / Figjam

Adobe Photoshop

Adobe Illustrator

Overview

Problem

There are thousand of playlists, but finding a perfect match is incredibly hard.

There are thousand of lists in music platform, but not a single playlist matches perfectly.

There are thousand of lists in music platform, but not a single playlist matches perfectly.

Browsing through countless playlists is time-consuming. In overwhelming numbers of playlists, finding a playlist that genuinely matches with the mood or activity is challenging.

Solution

Image captures the moment, time, and memories.

Easy and precise way to capture a specific mood and the moment is taking a photo.

By implementing Machine Learning technology, single snapshot transform into a personalized playlist.

Easy and precise way to capture a specific mood and the moment is taking a photo. By implementing Machine Learning technology, single snapshot transform into a personalized playlist.

Easy and precise way to capture a specific mood and the moment is taking a photo. By implementing Machine Learning technology, single snapshot transform into a personalized playlist.

Design Process

Outcome

Key Features

Personalized Playlist Generator

One single snap can make a perfect mood-matching playlist

No more hesitation. 'Snap and Make' enhance your experience within few seconds.

Life Journey, With Special Music

Record the moment with music

Post your snap playlists on 'My Page' and share your Snaplist (Snapmusic + Playlist) journey with friends.

Personalized Browse Options

Experience the magical coincidence

As a context-based application, it knows exactly what playlist you're looking for at specific moments.

Research 1

Research Goal

Explore challenges and pain points users face with current music platforms.

Investigate the specific difficulties users encounter when selecting a playlist.

Research computing technologies to transform the concept into a functional solution.

Research Methods

Competitive Analysis
Quantitive Research through Survey
Technology Exploration

Survey Discovery

Survey Discovery

Survey Discovery

After surveying 40 participants who uses music platforms on their daily basis, I found out that most users face when choosing a music playlist and gather insights that could help improve the playlist selection experience for users.

Survey Highlight

The survey revealed that participants spent significantly more time browsing for a playlist than anticipated.

Just as music preferences differ, their experiences with music platforms also vary. However, the functionality to play the right music at the right moment is crucial, and platforms should support users by simplifying the process of finding the perfect playlist.

Users spend an average of 6.1 minutes searching for a playlist that matches their emotional state and current context, highlighting the need for more efficient, personalized solutions.

Competitive Analysis

Following the survey, I analyzed three most selected music apps from survey to examine their strengths and weaknesses in playlist generation and functionality.

Research 2

Understanding Computing Technology

To bring my imagination into reality, I researched computing recognition technologies and explored how they could be applied to my concept of recognizing context from images. Through this exploration, I learned that Machine Learning and Object Recognition in computer vision can translate abstract data into actionable insights, enabling context-aware music selection and playlist generation through recommendation algorithms.

What is Computer Vision & Machine Learning?

Computer vision and machine learning, key subsets of AI, enable computers to interpret visual data and learn from experience to make accurate predictions. These technologies are central to my project, transforming images into context-aware insights for personalized experience.

How does the technology work?

Object and Emotion Recognition technologies facilitate the identification of various elements. Essentially, the emotion, mood, and activity captured in the photograph with location and time from data, influencing to generate the music playlist.

How does the technology execution process work?

Ideation

Persona

Storyboard

To understand how this potential solution could assist users, I transformed the story of Eric into a storyboard.

Challenge

How Might We - ?

"How might we create personalized playlists from visual images by leveraging computing technologies and context-based algorithms, fostering connections between users, music, mood, and memories?"

Wireframe

Wireframe and Flow Design

Design Iterations

Home Design Iterations and Improvements

I started by drawing inspiration from platforms like Apple Music and Spotify, displaying list of playlists on the Home with varying sizes of cards. After two mentorship sessions, I realized my initial designs lacked a context-based approach. I learned the importance of intuitive interface design and simplified the user flow to bring users closer to action in fewer steps.

Design Issues

Minimizing user inputs is essential to enhance user convenience.

The design lacks clarity in highlighting the fast 'Snap and make' function, undermining its unique value.

Improvements

Renamed 'Home' to 'Create', navigating users directly to the camera to highlight its core feature.

Moved playlist displays to 'Browse', featuring selected six context-based recommendations.

Another Iteration

During usability testing, a common question emerged: whether the app could also work with photos from the gallery. Recognizing this gap, I iterated on the app’s functionality to integrate a 'Share from Gallery' feature.

Design Concept

Style Guide

I created a comprehensive design system for unified brand consistency by organizing standardized design elements, components, and guidelines that illustrates what was used in the final design and logo design.

Design Solution

Introducing Snapmusic!

A mobile music playlist generation app for music lovers that transforms your photos into personalized playlists, blending context and emotion.

Onboarding to Snapmusic:

Introduce SnapMusic to your unique music taste by selecting your favorite artists. This step helps the app create playlists tailored specifically to you, setting the foundation for a personalized listening experience.

Personalized Recommendation

The 'Browse' page showcases six curated playlists tailored to you using metadata such as daily activities, weather, time, location, and more—with your permission. These playlists are designed to perfectly match your current context and preferences.

Smart Routine Playlist:

SnapMusic learns your listening habits and sends a push notification at the times you often play music. Seamlessly blend your favorite playlists into your daily routine, creating magical moments without lifting a finger.

Record & Share Moments

Save and record your playlists. Share your playlists with friends by sending a unique code, making it easy to exchange musical memories and relive your favorite moments together.

Lessons Learned

Takeaways

Leveraging Technology for Effective Solutions

Prior to starting the project, I had little knowledge of how AI, Machine Learning, and Computer Vision work. Through studying these technologies, I not only guided the design process effectively but also realized how my hypothetical idea could transform into reality. This experience highlighted the importance of research and knowledge in expanding creative possibilities.

The Power of Storytelling

It proved invaluable for bridging the gap between abstract ideas and user-centric solutions, helping me communicate complex concepts in a relatable and engaging way. Storytelling not only clarified the value of the product but also fostered empathy by placing users at the center, ensuring the design aligned with their needs and daily experiences.

Next Steps

Implement Advanced Personalization

Currently, the research lacks in-depth user behavior analysis, which may lead to misunderstandings about application usage. If possible, I aim to address this by conducting usability testing to explore additional metadata, such as user preferences, social trends, and fitness activity data.

Transform SnapMusic into Reality

If I had more time, I would focus on strengthening SnapMusic’s technological foundation by collaborating with engineers to develop and refine playlist generation algorithms.

©2024 Biju baek

Go Back To Top

©2024 Biju baek

Go Back To Top

©2024 Biju baek

Go Back To Top

Thanks for visiting!

To fully enjoy this website, recommend to view on desktop.
\Made with love and a lot of coffee © 2024 Biju Baek

Let's connect!

Thanks for visiting!

To fully enjoy this website, recommend to view on desktop.
Made with love and a lot of coffee © 2024 Biju Baek

Let's connect!

Thanks for visiting!

I recommend to view on desktop to fully enjoy!
Made with love a lot of coffee © 2024 Biju Baek

Let's connect!