musify-iphone-8-mockup

Musify app

Musify app

Musify app

An app for music lovers, with a special emphasis in delivering very high audio quality, and having a curated catalog, based in the music taste of the user.

#uxdesign #uidesign

Description

Description

In a sea of several music apps, it's difficult to differentiate from the others. Musify borns as a concept to bring personality and ease of use to the world of music apps, by giving the user a curated selection of music from artists they like, with the highest audio quality possible.

Role

Role

My role here was to make the research about competitors, define the user flow, create the wireframes, and finally make the hi-definition mockups and a prototype based on this.

Competitive research

I started the design process by researching about direct competitors.

 I made 3 different analysis:

 1. First, I checked all the available music streaming apps, in search for any pain points, new ideas, and which of them were the most relevant ones that would "deserve" to be taken into account in a deeper analysis. 

2. Then, I chose Spotify and Apple Music as the main competitors and analysed how they applied several design principles. 


3. I ran an analysis comparing the usage of different design patterns in both Spotify and Apple Music. 

I started the design process by researching about direct competitors.

 I made 3 different analysis:

 1. First, I checked all the available music streaming apps, in search for any pain points, new ideas, and which of them were the most relevant ones that would "deserve" to be taken into account in a deeper analysis. 

2. Then, I chose Spotify and Apple Music as the main competitors and analysed how they applied several design principles. 


3. I ran an analysis comparing the usage of different design patterns in both Spotify and Apple Music. 

applemusic

Pain points

I found out a few pain points regarding usability. It can be summarised in:


• Spotify navigation is not as straight forward as it should be


• They both have an "excess" of imagery that may result overwhelming the user


• They don't inform about audio quality to the listener

 
• Streaming to external devices is not as obvious as it should be

I found out a few pain points regarding usability. It can be summarised in:


• Spotify navigation is not as straight forward as it should be


• They both have an "excess" of imagery that may result overwhelming the user


• They don't inform about audio quality to the listener

 
• Streaming to external devices is not as obvious as it should be

musify-userflow

User flow

sketches-musify

Sketches

The purpose of my sketches was to be able to explore my ideas and quickly iterate over them until finding a working layout from where start creating the mid-fidelity wireframes.

The purpose of my sketches was to be able to explore my ideas and quickly iterate over them until finding a working layout from where start creating the mid-fidelity wireframes.

wire-musify

Mid-fidelity wireframes

Color and style

I decided this color palette, since it feels more friendly and warm, what I want as part of the look and feel of my app.

In addition to that, I want it to evoke some vintage, rebel and “rocker” feeling, reminding to the colors of legendary amplifiers brands such as Orange or Marshall.

As a final thought I also think the contrast is pretty clear, and helps identify faster the actions the user will have to take.

 

colorpalette-musify2
iPhone 8 – On boarding
iPhone 8 – Login-signup
iPhone 8 – Home
iPhone 8 – Library
iPhone 8 – Playlist
iPhone 8 – Search 01
iPhone 8 – Search 02
iPhone 8 – Player 01
iPhone 8 – Player 02

Hi-def screens

Isometric-iPhone-12-Mockup_musify-min

© Made with ♥︎ in Berlin by Juan Ossorio López — 2021

© Made with ♥︎ in Berlin by Juan Ossorio López — 2021

promsite-black-1