Group 25@2x.png
 
 

Strava × Spotify Integration

 
 

Challenge

When you’re mid-run, -ride, -paddle, -ski, or any other Strava-worthy activity, music can make or break your next PR. The right song can help you push up the hill or get through your next mile. The current Strava app has no in-app music integration, but does allow you track your run with a music player open in the background.

 
 

Client

Strava

Tools

Adobe XD, Adobe Illustrator

 
 

Role

UX Design Lead

Timeline

2 weeks

 
 
 

Journey

In my interviews, I found that users who don’t have a wearable device lose training time to stop and adjust their music by swapping apps. If they aren’t losing time, users reported that they felt unsafe having to use a swipe gesture to adjust their music mid-activity.

Swapping between my Strava app and my Spotify is the bane of my existence. I have to pull off the road…because my phone holder blocks the background app [gestures].”

Users who were interviewed also noted that there were certain songs that pushed them to the top of a segment, but by the time their activity is over, they don’t remember what song got them through it. Depending on activity, users reported a variety of responses in this category.

I can barely remember what I ate for breakfast. If I’m on a run I can easily screenshot the song that was playing but on a bike it’s a whole other game.”

Looking into options I knew I didn’t have to reinvent the wheel to address the first issue users were experiencing. Google Maps recently partnered with Spotify to provide drivers the ability to swap music while navigating with the Google Maps app. Navigation with Google Maps and activity tracking with Spotify draw many parallels.

To the right are my initial sketches using the interface of the existing Google Maps integration.

 
 
 

Solution

Looking at the pre-existing Google and Spotify integration, I utilized the browse feature that one can find on the Google Maps app. When interviewing users, I wanted to emphasize the ability to skip, pause, or go back in their queue with a two-tap gesture. The two taps are a reduction of up to 75% of actions that a user might go through to change their music in the current iteration of the Strava app.

In this exploration, I underscored that Strava is movement-based. While running, cycling, or skiing, a user’s tactility is greatly reduced. I’ve made the buttons large enough to navigate while participating in these activities while allowing your current time and pace (simulating tracking a run) to be visible. I tried to adhere to one of Strava’s mission statements:

Every day, we’re searching for new ways to inspire athletes and make the sports they love even more fun.”
— Strava Mission Statement

Music can be the addition to any exercise that makes a sport you love even more fun. Below you can find a design prototype for the second problem the users I interviewed spoke to: the ability to see what song was playing during a segment. Using the existing Strava interface, I added the album art to the right-hand side of the segment section to create a catalog of which song was playing at the middle of their segment. While this data is not precise in its current iteration, this provides an opportunity to further iterate on this feature.

The map below, and the numbered interaction will allow users to interact with the map that is created in-app. The pins act as a numerical indicator that corresponds to each segment and by tapping a number, a user can expand that pin to reveal which album was playing at that point in their run.

This exploration was an exercise in understanding user intent, designing for a range of users (from an extreme athlete to the everyday slogger [slow jogger]), and was a great opportunity to do a quick, but deep dive into a space that is near and dear to my heart.

Want to add me on Strava? 🚲 Shoot me an e-mail.

gif_SparkVideo.gif