top of page
intro.png

We aim to create a music product that enhances current experiences while introducing something fresh and unique.

To achieve this, we began by identifying users’ dissatisfaction with existing music experiences, and aligning our business goal accordingly.

To address users’ pain points with current music experiences and achieve our business goals, I made the following decisions:

Frame 1000003845.png

Create a Design System

To accelerate design with reusable components, ensure visual alignment, and enable rapid iterations.

Create a Design System

Artboard 1.jpg

Combine Astrology with Music

To understand users’ subconscious preferences, add emotional depth with a personal touch, and aligns music with their dynamic emotional energy.

Combine Astrology with Music

mood selection.jpg

Introduce the Daily Mood Selection feature

To Use mood as a context to refine recommendations to align music with how users feel each day.

Introduce the Daily Mood Selection feature

calendar jpg.jpg

Introduce The Calendar Feature

To encourage habit formation by enabling users to plan and track their listening routines.

Introduce The Calendar Feature

How do I know my decisions are successful?

I created a scalable design system in 1 week, to ensure visual consistency across designers and accelerate the design and iteration process.

Design system.png

Over three weeks, we conducted interviews with 20 people to identify pain points in music recommendations on streaming apps. We then explored enhancing personalization through 5 case studies, including the feasibility of astrology-based algorithms to improve user satisfaction.

research.png

Based on the solution of integrating astrology with music, I designed 4 key features to address our business goals and user pain points.

ideation.png

I created wireframes of the 4 features, tested with 16 users, and optimized designs based on feedback.

calendar.png

I designed 45 high-fidelity pages in one month, aligning with the cosmic theme and leveraging color psychology to ensure a cohesive, immersive experience.

Frame 427319455.png
OB.png

Fast & Simple

Users can log in with third-party accounts, eliminating the need to manually enter additional information. This simplifies the process, allowing users to start using the app by just entering their birth details.

Frame 427319455.png
MS.png

Caring & Empathetic

The mood selection is the first feature users see and can only be chosen once per day. AstroFM prioritizes the user experience by recommending music with higher contextual relevance based on the user’s selection. Users have the option to skip the mood selection or reenter it whenever they feel ready. There are 10 common moods to choose from, and if users are unsure of their mood, they can select “nothing specific.

Frame 427319455_edited.png
DP.png

Personalized & Relevant

After mood selection, users receive a daily playlist as three cards. Before flipping, they see the planet associated with each song and its keywords. Flipping the card reveals song details and allows playback. Clicking "Why this song" explains its deeper connection and relevance. If unsatisfied, users can regenerate the playlist with a button in the top right corner.

calendar
calendar.png

Nostalgic & Straightforward

In the calendar, users can click on any day they've used the app to review their mood, playlists, and liked songs. Users can also view all their liked songs by clicking the top-right corner of the page.

C.png
Frame 427319455.png

Insightful & Transparent

On the “Me” page, users can view a summary of their birth chart, including an overview of planet positions. Users can customize settings by clicking the top-right corner of the page. For example, the username and avatar are automatically set based on birth information upon login, but users can modify these details themselves.

Over 2 weeks, I conducted usability tests with 40 users who had never interacted with AstroFM before. We ensured designs were tested with a diverse group to evaluate effectiveness in meeting varied needs.

usability research.png
Frame 427319455.png
bottom of page