top of page
Copy of CRESCENDO(4).png

Crescendo

UX Design
OVERVIEW

Crescendo is a music application, redesigned to enhance usability

DURATION
PLATFORM

July 2021 - November 2021

Mobile

MY ROLE

Design Systems, Hi-fi Prototyping, Information Architecture, Interaction Design

TEAM

Lead designer in team of 2​

CLICK HERE TO VIEW THE PROTOTYPE IN FIGMA

Problem Statement

Problem

Designing an intuitive music streaming experience with reduced the number of steps required to perform common tasks

There are a lot of music streaming applications available. Other than song selection, the UI also determines their popularity. We wanted to analyse the popular applications, figure out what worked and make a more intuitive music streaming application. Music can be used for healing, and we wished to explore that aspect in a separate section in the application.

UX - Initial User Research

UX

Methodology :

​

  • Step 1 : Potential users (144) were sent a google form to get a general idea of the users, where they listen to music and any problems they face. The information is summarized below

  • Step 2 : Based on the form, and heuristic analysis of existing music applications, a UI was designed

  • Step 3 : UI was tested on Maze 

  • Step 4 : UI was redesigned according to user feedback

Google form results :

Group 1(1).png

Key Takeaways : 

 

  • Popular apps to be observed : Spotify, Youtube Music, Jio Saavn, Gaana

  • The design will be for a phone, as that is the most popular device

  • the age range is 15-25, so it can be assumed that the users have familiarity with the technology (touchscreen, gestures) as well as the language (English)

  • Actionable design features were : simplified view, easy to navigate, unobtrusive ads

​

Based on the popular apps, the following top level user flow was determined to minimise the number of steps for popular tasks like continue the last played song, search for a song and play from the library. The last played song will appear as a mini player at the bottom of every screen. There would be a bottom menu for quick navigation. The profile symbol will be on each screen in the top right corner as well.

User Flow

image 7(1).png
UI

Wireframe

CRESCENDO (1).png

User Interface - Version 1

CRESCENDO(1).png

User Testing (Maze)

Testing

Evaluation was done by setting up task in the interface on Maze. After that, a survey was sent out to the test takers and the following results were obtained.

initial eval(1).png
initial eval 2(1).png

Key Takeaways : 

 

  • terms used in the application were not necessarily intuitive

  • visibility of the font and organization of screen needed work

  • some tasks were difficult to carry out and the user control could be improved

  • this was solved by providing back button in every screen and in case of any error, listing the cause for the error as well as the steps the user could take to solve it

  • Many people preferred to stream songs for free - which meant a major source of revenue for the app was by ads. The goal was to make ad placement as seamless and unobstrusive as possible. We decided to place the ads in the explore page in a place where it also visually helped gain cohesion by breaking the list like view (screen #2 from the right in the bottom image)

FINAL DESIGN

Final design

Key design decisions for the library section :

​

  • The tab like feature of switching between the playlists, albums and songs was kept for easy access. This created less confusion in the tests set up in Maze according to the success rate of task completion

  • The profile picture was big and took a major place in the library to create more personalized and intimate experience for the user

  • To minimize the steps, the option for creating a new playlist was kept in a visible place.

Key design decisions for Headspace :

​

  • Music is therapeutic for us. So, we decided to add a section where people can use music for achieving a peaceful mental state. Many research papers suggested that music can be used to heal and for therapy. We read such papers to figure out if this was possible and explored existing wellness applications. The three main features of headspace were :

  • Mood based playlist : Based on the current mood of the user, the app will curate playlist that has songs related to that mood which slowly transition into more upbeat/peaceful songs. I designed the interface for the landing screen of headspace as well as the page for the mood based playlist

  • Make Your Own Music : The user can adjust percussion, melody and bass of the music according to four criteria : simple, complex, soft, loud. This intends to provide user some control and serve as a way to relieve stress or anxiety

  • Meditate : User can follow along guided meditation or meditate by themselves to peaceful music

8 1(2).png
9 1(2).png
final slide(2).png

Evaluation Result

10 1(1).png
Evaluation
initial eval 2(1).png
12 1(1).png

What did I learn?

  • I learnt how to perform heuristic analysis

  • This was my first project in UX for a subject HCI. I learnt how to work with another designer on team

  • I learnt prototyping in Figma

  • I learnt setting up user tests on Maze and performing time completion analysis

Reflection

What would I do differently?

  • The user research was more surface level - I found out what the user liked or disliked and designed according to that. The main focus was to reduce the time taken for popular tasks. Looking back at it, after completing various other projects, I realise I could have delved deeper into understanding the "whys" - why does the user like this, or why do they not like that? That would have opened up alternate ways for design

bottom of page