How to compare yourself now to your friend’s sports adventures from last year in a 3D video.

Short summary —  allows millions of runners, cyclists, hikers and other sports adventurers to share their activities with 3D video stories. Currently, you can only have multiple people in the same video if they are using at the exact same time. ’s value proposition is all about storytelling, so this is problematic as it severely limits the options for users to share experiences. For my final assignment at Codaisseur Design Academy, I designed the process of ‘reliving’ experiences together, even if significant time has passed between them. Disclaimer: This is not a project Relive commissioned me to do.

Imagine if a cyclist can see how much improvement he or she has been made in the past year. Not by looking at statistics and a simple 2D map like in Strava, but seeing a 3D video where the past self is swiftly being outpaced by the current one.

This is not possible yet, but a mockup I made of what the result of merging experiences plus a redesign of the interface would look like.

But while it’s possible to share experiences in the moment. It’s not possible to do so through time as in the above examples. Nor is it possible to browse through I thought it would be great if I could come up with a way to make that possible.

But why does anybody want this?

Great question. I can already tell you that out of 32 respondents to my survey, 92% want to compare themselves to their past self or to friends. Within my small sample size, it seems there is a big demand. However, the use needs to be thought through clearly and what this means for Relive. This is because Relive really is a combination between a sports tracking app and a storytelling app:

2×2 Matrix, based on my research. NB: Due to Strava’s new strategy of becoming a sort of Sports Facebook, storytelling has become more important.

To make the use case clear, and determine which pain points I would be solving, one of the first things I did was to draw up some personas:

Relive used the word “ ” to describe the feature.

I discussed this with my contact at Relive who said the app focusses on cyclists and runners. So it would make sense to design the new feature with Racing Robert’s needs in mind. In addition, we also discussed whether people would want to use the feature to compare themselves, or also compare themselves with friends. They were unsure, and the poll I conducted also shows that people wanted to do both.

People like to compare to themselves and to their peers. Only 20% does not care about other’s activities (32 respondents).

Note that people were the least interested in comparing themselves to the fastest person or professional athletes. Out of the 4 qualitative interviews I conducted with avid Strava Users, this quote sums up their feelings about that:

It’s fun to look at the pro’s and semi-pro’s, but after while you realize you never rank high anywhere. There are so many people out there. I just look at myself and how my friends are doing.

So given that the survey shows people are very interested in their peers, it’s no surprise that Strava’s booming success has been partially explained by social network effect.

While the survey was collecting responses, I summarised my research in the following UX Business Canvas.

Based on my quantitative and qualitative research, I drew up the current user journey. There are two possible user journeys. The “Relive together” feature within the app, and a “Manual comparison” that compares two videos after each other. If two very similar activities occurred around the same time, a user can merge them through the app. If a week or so has gone by, a user is left to do a manual comparison.

Current User Journey — “Relive together”-feature and a manual comparison.

Clearly the experience could be a whole lot better. I drew up the Information Architecture of Relive and Strava. To get a better idea on where to integrate my feature into the existing app, and to see where Strava put their ‘segments’, a comparable comparison tool that has proven to be very popular. These pictures are not meant to inform you, in as much to demonstrate the work I put in.

The Information Architecture of Relive on the left, Strava on the right.

What would this new feature exactly do then?

Another great question! I had the same one! So I wrote a couple of job stories and ordered them in my Trello using the MoSCoW method (it seems I really don’t understand why I would write down a ‘Won’t Have’).

Merging two Relive activities into one

This is the prototype of the main job story:

When I have done a route, I want to compare myself to myself or others who have done the same route, to set goals, feel proud or enjoy with my peers/competitors.

I drew up a new user flow:

Which I turned into Wireframes.

Which I turned into prototypes (here is the link to figma file I worked in). First, for your reference, here is Relive’s current main interface.

Relive’s current interface. Left: activity feed. Center: activity card top. Right: activity card bottom.

Below to the right, you can see the completion of the above job story. The iterations are part of that job story. Each time after a user was tested to select an activity to merge with another activity. Relive does not have a social activity feed like Strava or Facebook. So the prototype starts with simple link sharing through Whatsapp. I imagine that later on they would want to build an activity feed more akin to Strava from where users can select other user’s activities.

The iterations I went through plus the outcome. The second is the most obvious one for a user. The third follows Relive’s Design with the top menu bar and wording, and the fourth meets midway.

Note that I wasn’t redesigning the app, but instead trying to integrate a new core feature into the existing structure and design. This also means that I didn’t want to heavily advertise this function within the app, as any space it takes up, means less space for other important features. And I didn’t think that merging the experiences, albeit core, is not necessarily the primary function of the app.

This video shows how it was not clear to my testee he already completed the action (around minute 3). Has audio. Apologies, only in Dutch.

I conducted 4 tests throughout the project, with different iterations. As always the tests proved to be very useful. For the Dutch speakers, see the video to the right of me testing my design with a peer. Around the 3 minute mark we have come stuck.

In the five screens below the iterations of a similar activity are shown.

A first test immediately showed that people had to scroll down to quickly see why it was comparable. So I got rid of the video entirely, as that would take up the time of people trying to complete the action. Next, I decided to omit the differences between performance, as Relive stated to me they are primarily about enjoying the sports experience afterwards. So I thought making comparisons here put things unnecessarily into a data-driven competitive mood. Which the app is not about. That is also why I moved away from called it “Ghost Mode”, as nobody would understand that. And “compare”, as Relive is not about comparing, but about sharing adventures. For the fourth I deleted the clearer design of the third (with the obvious button), as I wanted to follow the design of Relive. And finally, I felt that the differences in routes could be a lot clearer, so I added brighter colors to the map and color-coded the profiles.

Final Result

So here are the final results. The left shows the main job story: merging two activities together (as shown earlier above). A Relive experience of a friend is combined with a similar one of mine.

The center one has the same case, and shows what a Strava/FB style-feed would look like. I liked Strava’s feature of being able to slide a card. Note that by clicking the icon on the activity card, a user can go toggle Relive experience that has been made by combining two different experiences. So a user always has its original video accessible, but can also see how it relates to others.

The third one shows what happens if you try to remove yourself from a combined video. You can’t. Because it would be weird if you could save/edit a video where you have no part in. This example has led me to think that I need to think a lot more about what kind of problems you would run into when implementing this design.

Relive mentioned that their current “Relive Together” feature is lacking, as it gets very crowded with a lot of cyclists in the same video. I can only imagine this becomes a bigger problem when people start Reliving big races. Like putting all cyclists of a stage of the Tour de France in one Relive. So I quickly designed a not-tested static mockup of what it would look like and improved the interface. Now it always shows your stats, not at the end. And you can switch between people, and toggle them. I imagine this would work the same as switching between subtitle tracks on Netflix.

Left (gif) and center a static redesign of the Relive Together experience. Right the current one.

Final thoughts

This project was a lot of fun to do. Generally, I think I could have done two things better. Firstly, more testing. Always more testing. Relive should do too. More than half of the confusion my testers went through was something I was confused about myself, and I didn’t design.

Secondly, I should have thought more about the implications of my primary job story. Who becomes the owner of a combined video? Where is it saved? How is it accessed? I am happy I spend two days on research and Information Architecture, so I could really understand Relive, but most of these questions still only came up when I was already doing prototyping.

Finally, one piece of advice, if you put a high fidelity prototype forward, make sure the play button of a video actually works. Otherwise testers will find the experience jarring.

Source link


Please enter your comment!
Please enter your name here