Designing for Explorers

8tracks operated under the Small Webcaster License in accordance with the Digital Millennium Copyright Act of 1998. To stay legal, the product had to abide by strict constraints: playlists had to be over 30 minutes; on-demand listening was strictly forbidden; track skips were limited and apportioned by listening time; and tracklists could not be shown to listeners in advance.

Given these constraints, our resource limitations, and the endemic challenges of social sites, our design mandate was to: adapt new listeners to the unique nature of the service; emphasize our greatest strength — human curation; make parsing a huge database of playlists fast, fun, and easy; and work effectively with the inherent fuzziness of user-controlled tagging.

Given the imperative of growth in an increasingly competitive streaming landscape, we had to meet all four challenges when a new listener arrived for the first time. Since the majority reached the site via organic search — querying something like "minimal techno mixes" — the logged-out tag page was where we had to do it.

The first order of business was showing them that whatever they were looking for, we had tons of it. We led with the playlist count for that tag and placed a collapsed search input nearby — easy first contact with the combinatory browsing interface without overwhelming with data.

Analytics showed new user retention was most correlated with clicking play on the first visit. So we put a big PLAY ALL front and center. For pickier listeners, a carousel of popular playlists let them sample the depth of the service without the cognitive load of the full scrolling list view.

For returning listeners, the tag page takes its standard form. Beneath the direct-input search UI, we display a tag cloud of the genres, moods, and artists most associated with the top-level tag. Select a second tag from the cloud — say "ambient" to combine with "minimal techno" — and results update to show playlists carrying both tags. The cloud updates again to reflect this more precise combination.

A blank search tag is always available to the right for freeform entry of any tag the listener chooses. In this fashion, a curious listener could start from any point of entry and go as narrow or as far afield as they like through free-flowing combinations of tags and artists.

Playlists contain at least 8 songs arranged by the DJ, categorized via mood and genre tags, and defined aesthetically by artwork, notes, and title. The track annotation feature lets DJs add a running commentary song by song. Similar playlists and Collections curated by other listeners are listed in the sidebar for further discovery.

Easily the most fun element of working on 8tracks was the endless stack of incredible user-generated playlist art. To make each page as unique and faithful to its creator's vibe as possible, we took a content-aware approach — sampling colors from each cover image and using them to construct a blurred gradient for both the music player and page background elements. Every page felt different. Every page felt right.

The DJ profile uses a Twitter-style unidirectional following model. It contains a user's name, avatar, bio, and follower/following info, alongside lists of their published playlists, liked playlists, playlist collections, and — most interestingly — favorite tracks.

In the favorite tracks tab, we were able to surface YouTube links for each song favorited by the DJ, creating a sort of back-door on-demand functionality for listeners who felt like putting a new find on repeat — a small echo of the SoulSeek era.