Blobify

We kept listening to the same music. Our own fault, mostly. We knew our favourite bands and went back to them, and Spotify kept handing it back.

So the recommendations were not very exploratory. We wanted to browse by what a song sounds like rather than by who made it.

Blobify maps each track to an animated 2D blob. Energy, tempo, and key drive its shape, movement, and colour, so a playlist becomes a field of things you can read at a glance.

Touch a blob and it dances. Drag it and a panel opens from the side and absorbs it into your saved collection. The sketching started with how the blobs should feel to handle, not with screens.

We imagined them as bacteria drifting in a big space, which in 2020 was either very on the nose or the only thing anyone could think about.

React with Redux in an MVC structure, splitting container and presentational components. Firestore on the back end, the Spotify Web API for audio features, Two.js for rendering the blobs, and Pressure.js for force touch.

We evaluated with Hotjar heatmaps and Videoask questionnaires rather than guessing at whether the interaction read.

Spotify has since retired the part of its API that Blobify depended on.