Vizify

A web application for music streaming enthusiasts that relays information about users Spotify streaming habits through a visual language

view prototype↗

Collaborator

Just me!

My Role

Lead Designer,
Thesis Project

Tools

Adobe Creative Suite, HTML/CSS

Duration

6 months

Problem Space

Spotify does not allow users to see their music streaming data at all times.

Users want to feel a sense of joy and uniqueness when viewing their streaming habits.

Solution

Vizify is a way for users to see their streaming data as a generated visual info graphic.

Vizify allows users to see how their individual music taste translates into a piece of generated visuals that recognize users unique tastes, resulting in a feeling of joy.

How it works

Visual Language

Vizify connects to the user's Spotify account and uses their streaming data which translates into a Visual Language, a term used to describe how the streaming data translates into visuals.

The information in the info graphic that the user receives is rooted in the parameters of Spotify's API.

view prototype↗

Visual Language Explanation

  • Username data extracted from connecting to Spotify API
  • Takes users total streamed minutes
  • Takes users streaming data time and finds the mode. (This is a hypothetical feature, as far as the research uncovered this data cannot be extracted with just the Spotify API alone)
  • Takes users top 6 streamed albums and makes album art black and white to match the Vizify brand colours as the original colours of the album art would be too off brand
  • Takes users top 5 streamed songs and takes the song's data and turns it into an HSL colour
  • Takes users top 50 songs and finds the average level for each of these parameters from all 50 songs to translate to one number
  • Takes top 50 songs and plots them on a map of Danceability to Valence levels. Songs in a minor key are Vizify Blue, and songs in a major key are Vizify Red

Branding Assets

Supporting pieces were created to enhance the brand of Vizify.

These include a sticker pack, set of print posters and an instagram filter that was created with Spark AR.