Nike Buddies

Developing a new feature on Nike Training Club to build social support, promoting workout adherence
Jump to Prototype ->
CLIENT
Nike
(prospective project)
TIME
~80 hours
ROLES
UX Researcher
UX Designer
TOOLS USED

01 BACKGROUND

context

Why did I choose Nike Training Club?

As a daily user of Nike Run Club (NRC), I wanted to incorporate more diverse training on my workout routine. Unsure where to begin, I chose to download Nike Training Club (NTC), a sister at to NRC, as they offered a variety of workouts from strength training to yoga. I also believed NTC would provide similar benefits as I did with NRC: guided workouts, being a part of challenges with friends, leaderboards, etc.

However, to my slight disappointment the feel of NTC was not the same as NRC. Part of it was the lack of emphasis community compared to NRC.

probLEm

Breaking it down

NTC is a popular at-home workout app

Nike Training Club (NTC) is one of the market’s leading fitness apps with over 450 classes in a variety of different disciplines such as cardio, yoga, and strength.

With a Program Feature, unique among other workout platforms

NTC has a prominent "Programs" feature (previously only offered in Premium) where users can begin structured training programs for specific goals.

As this feature is newer compared to other features, I am assuming that is has a low usage rate.

NTC has low access to the user’s community

NTC also has an add a friend feature, but community interaction is highly underutilized. The only thing a user can do it view a friend’s profile - which does not show much.

So, how might we ...

empower NTC users to adhere to a workout routine using Nike's Programs while building social support with their own community?

Solution Space

Introducing Nike Buddy

My feature allows users to add someone from their friend’s list, a Nike Buddy,  to complete workouts with within a training program.
The target population is beginners who want social support to keep them in check in their fitness journey.
The intention of this feature is to help users adhere to a workout routine.

02 RESEARCH

research GOALS + objectives

This design will be successful if I ...

1
Understand the current workout app market
2
Identify frustrations, if any, when completing workouts with others
3
Prioritize features based on user research
*Note: All research participants were selected if they wanted to incorporate social support in their workout.

Competitive Analysis

How Does The Competition Look Like, Coach?

research findings

What do The people want?

Social support is important, but especially for beginners

50% of users anecdotally noted that having social support was important for them to get into the habit of working out. However, overtime they felt that they did not need to workout with friends, often because they would “get too distracted.”

Users are more motivated when they see their friends’ progress

Survey users are 25% more motivated to see their friends’ progress compared to their own. This aligned to my own experience when using NRC.

Be wary of sending too many notifications

50% of interview research participants noted frustrations with workout apps when it sent too many notifications explaining it diluted the message

research findings

People had a lot of suggestions

Interviews also gave a wide range of feature suggestions (on top of adding a Nike Buddy) to build out the social feature for NTC. Many ideas were things I had not considered.
Seeing comments about a workout from Nike Buddy
Suggestion 1
Scheduling workouts with Nike Buddies
Suggestion 2
App notifications to send a personalized message to Nike Buddy to remind them to workout
Suggestion 3
App notifications of Nike Buddy completing of a workout
Suggestion 4
Creating workout challenges not within a training program
Suggestion 5

Rice Chart

Prioritizing Suggestions

From interviews, I got a list of great suggestions. From there, I decided to survey the same users on what they prioritized as I could not prototype all features due to time restrictions. I used a RICE chart to rank what suggestions I would build out for the first iteration.

The R.I.C.E score was calculated using the formula: [Reach x Impact x Confidence] / Effort.  Inputs from each category was estimated based on secondary research, primary research, and personal estimations.  The higher the R.I.C.E Score, the higher the priority.

After filling out the chart, I chose the top 3 to prototype. Check out my task flows to visualize how I planned to implement them into Nike’s architecture.

R.I.C.E. Score = [Reach x Impact x Confidence] / Effort

03 interaction design

ui kit

nike training UI Kit

Creating this design UI Kit became very handy when designing screens as I was able to use components and variants. I followed color and font schemes from screenshots of NTC screens. I also created new components and icons following the pre-existing UI for NTC.

task 1

adding a nike buddy

Selected unique screens from task flow:
New Icon
I chose to place the add Nike Buddy icon on the page where users view the training program details. The reason I chose to the top banner was to follow the established UI, but was concerned if testers could not find it.
New Screen
This screen is what users would see after clicking on the the Add Nike Buddy icon. Although Nike has a screen for this task, the design was not consistent with the screens associated with training program (ie the background is white), so I took some liberty on designing my own screen that felt aligned to the Nike Design UI Kit.

task 2

Accepting an invite

Selected unique screens from task flow:
New Section
Seeing from research that users felt highly motivated when seeing friends’ progress, I wanted to incorporate a subtle detail that showed some progress. When a user is about to start a workout, they can glance over to see who has completed (or not) a workout.
New CTAs
Although these CTAs were new, they follow the same UI architecture with the rest of NTC’s screens. For the left screen, I chose the “Accept” to be the white button as it’s the more desired CTA.

task 3

like a comment

Selected unique screens from task flow:
New Section
The top suggestion from research was to see Nike Buddy’s comments from individual workouts. Following suit from another screen that NTC had with tabs, I chose to place the comment section as another tab within the workout page.

03 testing & revisions

maze insights

first usability test highlights

I used a unmoderated test on Maze to test if users were able to complete each task as well as to gauge how intuitive each task felt. I also asked if they had any other suggestions. I was able to get 14 users to complete this test. To my surprise, most users were able to complete the tasks.

user problem

Difficulty in finding the add Nike Buddy icon

"I almost missed the "add friend" button because the white outline was a bit hard to see"

design change

Incorporating a pop-up

Since Nike Buddies is a new feature, incorporating a pop-up felt appropriate to introduce a new feature. This way, users are aware of the new addition.

usabiltiy test results

before & After

94.33%

Success Rate (Direct + Indirect)
Compared to 71.43% before

7.4/10

Average Intuitive Score
Compared to 6.8 before

user problem

Users were unable to start over

“I had gone to the wrong section I believe, but when I tried to return home by selecting the bottom navigation it wouldn't take me back, nor could I find another way to go back”

design change

Prototyping “back” function

This was an essential part of prototyping that I forgot to do as I was focused on prototyping the flow of each task in one direction. Lesson learned!

usabiltiy test results

before & After

100%

Success Rate (Direct + Indirect)
Compared to 85.35% before

9.7/10

Average Intuitive Score
Compared to 6.8 before

suggestion

Interacting with users during a workout

“... it would be nice to be able to interact with them about the workouts through the app. Now we share via text or in person, but I think it would definitely be more motivating to engage through the workout platform!"

design addition

Sending/receiving a nike nod

Similar to Peloton’s “hi-fives”, I wanted to test out sending Nike Nods during a workout. An example nod could be a cheer icon that appears momentarily on Nike Buddy’s screen.

This was a new task I wanted to test out. Although I did not have a previous prototype to compare it with, I was pleased to find out there was a 100% completion rate.

usabiltiy test results

before & After

100%

Success Rate (Direct + Indirect)

7.9/10

Average Intuitive Score

04 Prototype

prototype

nike Buddies final prototype

05 reflections

reflection

Always think of the user, every step of the way

For me, testing my prototypes has always been the most eye opening experience in the design process. Forgetting the prototype back to the main menu was an example of how it is easy to forget what it feels like being the user. I was focused on success paths, that I neglected what one path would take to start over.

reflection

Good design takes time

When starting this project, I was really excited to get everything going. Although I did not have a final solution in mind, I felt passionate to find it in a short amount of time. In a bootcamp, I suppose this feeling is a good thing given the timeline students have to complete this project. However, I found that taking breaks (ie not working on weekends or holidays) was extremely helpful in letting my brain relax and producing better work.