• Skip to main content
  • Skip to primary sidebar

Alyssa Cole

Digital Marketing for Theater Artists Powered by Temple's MSDIM

Fox School of Business

8tracks UX Design: A Deep Dive into Small Elements That Make a Big Difference

July 20, 2019 By Alyssa Cole Leave a Comment

I’m an evangelist for 8tracks.com, the internet mix-tape platform. The playlists are entirely user-created, which means each playlist is curated by people rather than an algorithm. It plays in to how I like to listen to music. I can search for Fringe and find essentially unofficial soundtracks of music used in the show, which given Walter’s amazing record collection, is a good way to spend a few hours. I doubt Spotify would be able to recreate the music of middle school dances better than the user who created the “Suburban White Boy Jams” playlist. I can type in “study chill” and be directed to hundreds of ambient playlists, and if I want to refine, I just type another keyword, which can be an artist, genre, mood, activity…anything.

I thought it would be interesting to do a deep dive into 8tracks user experience and interaction. It’s not just that the music is curated in the way I like, I also find it much less overwhelming than competitive music streaming services. I wondered if I would be able to find out why that may be. Think of it as a type-aloud.

 

On my homepage, the visible carousels are “Listen Again” and “Liked Playlists”. I like that it is displaying content I have interacted with in some way first, before any recommendations. Honestly, most of the time I am looking for one of the last 5 things I have played. One thing I love is the site’s dedication to white space. I don’t feel like the content is crowded, and it is all very clearly separated.

 

 

The media player is also a workhorse on the site. It always displays what you are currently playing. Say you heard a song you liked and don’t know, but missed seeing the title in the progress bar while you were browsing. Clicking the playlist thumbnail on the left will take you to the playlist information page, where the played tracks are displayed. That page replicates the “Youtube/Buy/Favorite” element in the right of the progress bar. You can also click the artists and albums to find information about them. The progress bar is a nice feature. Since internet radio generally only allows a certain number of skips per hour, I use it to judge if I want to sit through the song, or if I actually hate it. I also love that I can favorite a song in a playlist without favoriting the playlist itself. Those two functions are independent of each other, but both options are available here.

 

Carousels start to incorporate information in their hover states. It’s nice to see what page of the carousel you are on next to the arrows. It provides context to where I am in the recommendations. It’s a little tiny breadcrumb that disappears when you aren’t interacting with the element. I like this way of indicating further off-screen content more than peeping it on the left or right. It leads to the site overall feeling very crisp and clean; sometimes the indication of the offscreen element makes the site feel heavier on one side. I also feel it can look sloppy if I’ve scrolled left on one carousel and right on another.

All the carousels have the option for you to browse their content as its own sub-feed by clicking the hamburger between the arrows on the upper left.

 

 

The iconography is also consistent and clear across your media bar and the site itself. It’s always clear how recommendations on your homepage are made.

 

Drilling down in content a bit, each “album cover” also incorporates a hover state with contextual information. From here, you can click the play button, add it to a collection, click one of the tags at the bottom to enter into a search scenario, and check out the maker’s profile page and other playlists. The greying out makes the content more visible. This is another instance where this extraneous content is hidden outside of what I am engaged with on the site. It’s also easy to learn that you can find this information for any playlist displayed; users discover it within seconds just by using their mouse.

 

 

 

8tracks design also incorporates real world concepts. Playlists with 100 likes earn a gold record, 1,000 net a platinum, and Diamond playlists have 10,000 likes. It’s an easy way to dog-ear playlists and gives you an indication of how good something might be. On the right, is a “Gem” playlist. This is a category created by the platform for playlists that are great, but don’t have a ton of likes.

 

 

So you select a gold playlist and want to look at its description. The header of the playlist information page incorporates the full range of tags, play/like counts, and social media sharing. The social media sharing expands and replaces the menu at the center on the bottom, which is nice. It keeps the social media tags hidden and the interface a bit less messy.

 

 

One of the really great features of 8tracks is that it doesn’t only contain radio edits of songs. Users can tag playlists as appropriate or not for work, and all NSFW playlists are flagged as such on their content cards. When I’m in my office and a kids’ dance company is renting, I can turn on a “safe” setting in the main nav on the upper right of the site. (Though I will say, I don’t know where the two users who voted safe on the righthand playlist work; this list is certainly not.)

 

One feature I didn’t know existed are statistics for the playlists you created. I participated in a “Fanmix Your Own Self” Tumblr quiz a few years ago. I can imagine this being a useful page for people who are really into creating playlists or are nostalgic about mixtapes. But imagine knowing where your friends skipped out on your delicately crafted mix.  😬

 

 

Personally, this is how I love to listen to music; with other people who love it. It’s nice to find another user-created list that matches the experience you’re looking for, or very weirdly specific playlists (like “Chill Crafting” which I will be listening to this evening). It’s a neat way to discover things you’ve never heard. It’s like deciding what song to play next for your friends. It feels much more communal than other streaming services.

 

ALYSSA’S PLAYLIST RECS:

songs i enjoy making chicken to. from freedom_can_kill_you on 8tracks Radio.

Call Me When You’re Dead from Solemet on 8tracks Radio.

oh, he was clever from myrandar on 8tracks Radio.

Songs for Rev. Dr. Martin Luther King, Jr. from CookieCrispsss on 8tracks Radio.

Share:

  • Click to email this to a friend (Opens in new window)
  • Click to share on Facebook (Opens in new window)
  • Click to share on Tumblr (Opens in new window)
  • Click to share on Pinterest (Opens in new window)
  • Click to share on Twitter (Opens in new window)
  • Click to share on Pocket (Opens in new window)
  • Click to share on LinkedIn (Opens in new window)
  • Click to print (Opens in new window)

Filed Under: UX Design Tagged With: UX Design

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Primary Sidebar

My Information

  • About
  • Resume
  • My Interests
  • Professional Goals

Recent Posts

  • Developing a social media policy without stifling expression
  • My Cat, the Next Influencer (shh…don’t tell her about money)
  • Developing a Plan to Redesign and Continuously Improve the Wilma Theater Website
  • Tips for Handling the Triple Constraint on Theater Performances: Tales from the Frontlines
  • 8tracks UX Design: A Deep Dive into Small Elements That Make a Big Difference
  • Creating a Better User Experience for Seniors

Copyright © 2022 · Alyssa Cole
Disclaimer: The information included in e-portfolios are posted and maintained by the applicable student. Temple University makes no representation as to the accuracy or currency of this information.

loading Cancel
Post was not sent - check your email addresses!
Email check failed, please try again
Sorry, your blog cannot share posts by email.