Nike Training Club

The Nike Training Club app provides users with a variety of workouts. An augmented reality (AR) feature is proposed within the app to help educate users on fitness machines.

Overview

Add a Feature

(Student Project)

Project Type

UX Designer, UI Designer, Researcher

My Role

Timeline

2 weeks

Whether its people who are new to the gym or go infrequently, better instructional tools are needed to teach them proper usage of fitness machines.

The Problem

Background Research

Currently, there are several instructional tools inside and outside of the gym but are these tools sufficient in teaching an unfamiliar gym individual?

Internal Tools:

  • Personal trainers

  • Instruction decals

  • Organized fitness classes

External Tools:

  • YouTube/Instagram/TikTok videos

  • Google

  • Friends who frequently go to the gym

The Interviewees

  • 5 participants

  • Age: Mid-20s

  • Mix of male and female

  • Experience in the gym: beginner to advanced

User Research

Nature of the Interview

  • Remote (Google Meet)

  • After work hours (5pm - 8pm)

  • 30 minutes long

Key Findings

The instructional decals convey how to operate the machine in its most basic form, but gym users would like more in-depth information including:

  • Proper adjustments (e.g., how far back the seat should be, bar placement, etc.)

  • Most effective positioning (e.g., foot placement, hand placement, etc.)

  • A video showing a person performing the movement (rather than two images on the decal)

The Product Direction

How might we improve the way people learn how to use fitness machines at the gym?

The Solution

Currently, the Nike Training Club App gives users a variety of workouts and utilizes videos to instruct users on different drills. An augmented reality (AR) feature is proposed to give users a full instructional experience in the gym. This AR feature allows a user to gain instant information on a machine at the gym by using a user’s phone camera to identify the machine then provide tips and instructions on how to use the machine.

Information Architecture

In order to properly integrate the new feature, several flow paths were reviewed but only two were selected including:

  • A new overflow menu item called “Machine Tips” that allows users to view an extensive list of fitness machines and access the new feature.

  • Integration of the feature into an existing workout plan.

In initial visualizations of the solution, the two flow paths were drafted with wireframes created for machine tips, machine details, AR view, and the integration in an existing workout.

Let’s Visualize The Solution

Sketches

The high fidelity screens were created using the initial wireframes alongside the UI design and branding of the existing Nike Training Club app.

High Fidelity Screens

Usability Test Results

A set of usability tests were conducted on the users from the interview phase of this project. The two key flow paths were tested and yielded the following results:

Successes

  1. Users appreciated the detailed information in the Machine Instructions screen.

  2. This feature targets people who are new to the gym or do not go frequently.

Requires Revisions

  1. In the Machine Instructions screen, users would rather see The Movement before the General Tips on how to use the fitness machine.

  2. If a user is using the feature through an existing workout, they may not know how to locate the machine.

Design Iterations

  1. The Movement card within the Machine Instructions was moved above the General Tips card.

  2. The View Machines in AR button was repurposed to View Instructions and machines that the feature can identify have been separated from the rest of the equipment used within a workout.

Before

After

The Final Design

Next Steps

  1. identified opportunity to utilize AR but should look into incorporating a more realistic AR simulation in prototype.