Discover the different-yet-familiar.

James Rice
Nov 10, 2015 · 8 min read

Provenance of food holds a lot of weight in the current gastronomic climate—no longer do we ask ‘is this beef British?’ but also ‘in which farm was it reared and within what distance of the restaurant?’. This is because it gives us a back story to what we see on the plate. It’s the liner notes to the carefully crafted description of each morsel on the menu. And we appreciate this back story because we value the creators and the origins.

Provenance in music has been highlighted recently with the Marvin Gaye vs Robin Thicke dispute over his 2013 hit Blurred Lines and the recent Baligh Hamdi vs. Jay-Z case with Big Pimpin. It’s not to say sampling is wrong (of course it’s not), but were the originators properly recognised and attributed? Is there a case for more resonant provenance in music?

Definitely sound very similar!

Meet Derive

Derive resonates music for the new breed of teens and trendy twenties who love to discover new music. It finds a common thread — between music they know, and music they may not know — through analysing what samples those songs use.

I’ve experienced this for myself: a playlist I came across lists tracks that are sampled by Endtroducing (appositely, a record that received universal acclaim for its approach to sampling). Listening to this playlist and coming across the moments of familiarity — from those riffs or musical motifs that were sampled — is something special. Probably a bit like meeting a long-lost cousin for the first time.

A playlist of songs that Endtroducing samples.

Listening to this playlist and coming across the moments of familiarity — from those riffs or musical motifs that were sampled — is something special.

There are people out there who already consume music this way. WhoSampled has a growing community around this area of discovery. In a September 2014 Guardian article the WhoSampled founder said:

We want to go as mainstream as possible, and bring this experience to as many people as we can …

Derive is my evolutionary vision for WhoSampled, just as Instagram is an evolution of Burbn—stripping back, re-grouping and relaunching. Derive does one thing well, just like (the now archived but brilliant) This Is My Jam for that one track of the week that you can’t get out of your head.

What’s wrong with WhoSampled?

The WhoSampled website offers exploration by searching and through charts. On top of this there’s the functionality of being able to submit sampled songs leading to a great wealth of community. But it’s not terribly personal, and certainly isn’t a full-on music consumption service. Their app allows for a more personal discovery experience by scanning your device for music, but it’s very clunky.

WhoSampled iOS app. Swipe between the first song and the song it samples.

The WhoSampled app…

  1. Is crippled by only allowing on-device scanning
    Their app can scan the music on your phone, but we stream music now, right?
  2. Is analytical listening
    Choosing a song allows you to compare it the song it samples. Once you hit Play on a song, that’s it. You’re locked on that song. Clearly there’s no listening experience per se, rather it’s an analytical experience in comparing songs side-by-side, skipping (the embedded YouTube video) to the part where you’re told a sample appears.
  3. Has a jarring experience
    The user flow is very laboured in the action of drilling down into songs, then into a list of songs it samples. Switching between songs is disjointing — you have to tap back, back, right back up the tree. My experience with the app has been quite exhausting, leading to only dipping in-and-out of using it.

Derive offers an experience personal to your music taste. It provides music via Spotify and finds music in your Spotify playlists. A pure listening experience rather than an analytical one.


Identity

I sketched out ideas revolving around sound (whilst trying not to step on Dolby’s (because Dolby is sound-related and also starts with a ‘D’) or SoundCloud’s toes (waveforms)). There are obvious visual representations of sound; waveforms, music notes, etc. Drawing from WhoSampled’s ‘Exploring the DNA of music’ tagline was also a potential avenue.

Some of my sketches for the Derive identity.

Overlapping the ‘D’ and introducing other shapes like the quarter musical note (♩) had promise. The multiple renditions of the ‘D’ letterform felt like each is a mutation of another (similar to how songs are mutations of the original they sample). The quarter note also acts as a lowercase ‘d’. When simplified and combined into a succinct graphic this also happily resembled an ear—great! I also like how it suggests a spiralling rabbit hole (of discovering music through samples).

Most promising sketch, and rendered version in colour borrowed from WhoSampled’s palette.

This felt like a distinct-enough solution for this prototype.


Prototyping

When I first had the idea for Derive I imagined it looking something like SoundCloud’s tagging comments to timestamps in a song interface.

SoundCloud web player interface.
What would a SoundCloud-like interface look like?

I thought a SoundCloud-esque interface might be neat for Derive, but actually when working through user flows, I had it the wrong way around. The emphasis should be on the sampled song rather than the song in your library.

There was also the consideration that there’s likely a high number of songs that are covers, remixes, or contain interpolations (whereby whole melodies are borrowed and appear throughout a track) and therefore there would be no specific timestamps to reference.


There are, of course, instances when songs have multiple levels of connections. One song may have sampled by another, which in-turn samples something before it.

Song relationships diagram.

To keep things simple, the focus for Derive is on levels 1 (the song in your library) and 2 (sampled songs).

We get to the 3rd level by tapping ‘❤’ on a song from the 2nd level adding it to a new ‘Loved songs’ playlist. If we play from this playlist then that songs then becomes a level 1 song.

Derive does not look ‘forward’ to level zero (your song was sampled in…), instead it focuses on looking backwards — it’s all about exploring where songs in your library derive from.


Some early interface sketches.

First-install process linking with Spotify.

Setup process

The prototype starts by showing the linking with Spotify, though this, of course, could also include Apple Music, Google Play, or other.

It’s an unavoidable (but one-time only) step for linking with Spotify and using its songs to stream and its user-created playlists to play from.


Card-style on-boarding.

On-boarding

After passing an early-stage prototype around the studio, the feedback was clear that the user would need to be eased-in—to really make clear the concept of the app in the context of the interface.

  1. Derive is like a rabbit hole of music discovery (graphic also echoes the logo).
  2. Here’s a song you like. (Shown in context of the actual interface the user will see after the on-boarding process).
  3. Here’s some songs we’ve found relating to it. We’re interested in the sampled songs; this is the emphasis and this is what you’ll be listening to.

Main app view.

You’re in!

The app in intentionally simple. No big jumbo menu can be seen behind a hamburger menu. It’s a very simple app concept and the interface should reflect that.


Loving a song.

‘Loving’ a song

Here’s a bit of hand-holding in flow of your experience within the app.

“Hey, this song is ace! I like how it’s a totally different tempo than the one I know”

Hit the heart icon ❤ and a one-time modal explains exactly what this action is going to do.

The song gets added to a playlist we create on your Spotify account. Saved for later, or maybe you’ll decide to play from it in the app, creating a new (3rd level deep) relationship of songs!


Start playing from a playlist.

Playlists

By default Derive starts playing from ‘All songs’ (that’s every song in your Spotify library).

Tap the area showing the current ‘Sampled by’ song (you’ll also see the name of the playlist that song is in: ‘All songs’). A panel slides up and reveals all your playlists to choose from.


Exploring music by skipping / shuffling.

Exploring

The primary action in Derive is exploring the music.

The next song ⏩ icon allows the user to skip the current song. Derive will, in a shuffle behaviour, play the next random song in the current playlist.

Being the primary action, this button (along with the heart icon ❤ and playlist selection area) is placed handily in the bottom-half of the screen for easy thumb reachability.


Uninterrupted listening experience.

Listening experience

As I‘ve said, Derive is a listening experience (as opposed to the analytical listening style of the WS app).

When you wake your phone from lock, the app shows large cover art of the currently playing song.

Drag down to dismiss it and return to the main app screen.


Bonus tracks

  • Facebook recently announced Music Stories. It’d be great to introduce an interface allowing the user to copy a share link that they can then post to Facebook in a visual way. “Who knew Limit to Your Love was a Feist cover?? I prefer the original! Derive is awesome!”
  • Get a deeper understanding (and appreciation) for the artists of the sampled songs. Pull in Wikipedia information.
  • An Exclusions list: Simply tap ‘×’ and you’ll never have to hear that song again.

And that’s it

Follow me and my studio on Twitter!


If you enjoyed reading this article, I would appreciate
it if you Recommend or Share it.

Thanks for reading!


Thanks to Greg Bowler

James Rice

Written by

Designer at @coopdigital and @studiogutsy

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade