top of page

Bumpbeat 

Music App, 2019

Designing a design system for music. 

Product Design
Prototyping

User Testing

iPhone X-XS – Dark - Play – 2.png

Inspiration

Spotify, Apple Music, Pandora, Melon Music, iHeartRadio - there are tons of music streaming services out there. However, each system is unique to their own. I brought in my inspiration from already created apps.

iPhone X-XS – Light - Radio – 1.png
iPhone X-XS – Light - Play – 4.png
iPhone X-XS – Dark - Radio – 1.png

INTRODUCTION

Search Nearby

You go into a coffee shop, and they're playing a song that you like, and you want to know the playlist. You can search for nearby.

Light vs Dark

The debate between dark mode vs light mode still exists in the design world. Dark mode and light mode lives in the present, and both modes fits with a light UI. For example, Spotify has a dark mode, and iTunes has a light mode. Users can prefer both interfaces but are only restricted to one mode.

Colors 

Typography

Colors

Using color psychology, I chose pink, purple, and pink to purple. Pink is the color of affectionate and compassion while purple is imagination. Together combined, it creates an intriguing, yet soothing color, often creating a space to bring new ideas and clear thoughts. 

Typography

A standard of  ration of 1.5 was kept for line height in relation to font size.

Rectangle 52.png
Typography.png
Typography_edited.png
Template_–_2_edited.png

ICONS

Commonly used interface icons

iPhone X-XS – Light - Radio.png
iPhone X-XS – Light - Play.png

LOW
FIDELITY

Prototypes for Low Fidelity

iPhone X-XS – Dark - Radio.png
iPhone_X-XS_–_Dark_-_Play.png
iPhone X-XS – Dark - Radio – 2.png
iPhone X - Dark - Home – 1.png

High 
Fidelity

Prototype

iPhone X-XS – Light - Play – 1.png
iPhone X-XS – Light - Search – 1.png
bottom of page