Reinvent at-home workouts with Nike, your personal trainer

Team

Charmaine Qiu
Elysha Tsai
Francis Park

Role

Motion Designer,
UX Designer

Duration

7 weeks,
‍Spring 2022

Skills

Motion Graphics
UX Research
UI/UX

Concept

Focus on Form Today.
Own Your Workout Tomorrow.

Guiding all athletes through their own workout journeys, Nike brings back personalization and flexibility into the remote environment. Through data-driven recommendations and workout modification capabilities, Nike allows users at all stages of fitness expertise to redefine home training with the ease of a simple, guided conversation.

Challenge

Why Nike Fitness Club?

Exploring digital experiences
 that may be enhanced with AI and conversation, our group looked into journeys that thrived with the presence of a human companion, such as personal fitness. Although exercise is a highly personal and physical endeavor, an increase of remote modalities and cautiousness in public spaces has heightened a sense of impersonality in this problem. The need to bridge the gap in at-home fitness became clear.

View Full Documentation

Problem Space

Customer Pain Points

While Nike Training Club currently offers a robust selection of trainer-led videos and resources, it lacks the essence of personalization that is hard to achieve in remote experiences. Recent app reviews further highlight an overall frustration in the process of searching and following trainer-led videos.

CUI Opportunities

Current NTC Experience

To better understand the functionalities of NTC, we mapped out the site-flow from onboarding to post-workouts. Through the process, we highlighted specific UX pain points and potential design opportunities for CUI.

User Journey Map

At-Home Workout Experience

Beyond analyzing the NTC, we mapped user journeys that highlighted goals, actions, emotions, and CUI interactions. Dividing the workout portion between guided videos and customizable playlists format, we hoped to further portray the  distinct user scenarios based on specific goals.

User Research

Personas

From our user research, we defined our two main personas as the beginner athlete and the experienced athlete. Designing for a broad range of experience levels was appropriate not only for NTC’s existing functions but also for Nike’s mission to “bring inspiration and innovation to every athlete in the world.”

Building Scenarios

Mapping Conversations

To figure out the distinct states of our Nike CUI, we brainstormed conversational flows based on the personas. The flow were mainly divided into onboarding, scheduling, execute workout, and post-workout, and we analyzed CUI states that were best applicable for specific moments in the conversation.

Concept Development

Storyboarding

Our video follows Kate, a young woman interested in improving her athleticism from the comfort of her home. As she continues to work out, Kate grows from a beginner athlete following trainer-led video workouts to an experienced athlete who can customize workouts on the fly. It is only with the Nike intelligent assistant and the curated recommendations, guidance, and flexibility that Kate is able to advance from focusing on form today to owning her workout tomorrow.

Visual Identity

Form & Personality

We initially explored diverse forms that revolved the logo by reshaping the swoosh through segmentation, distortion, and repetition. Eventually, we realized the challenge would be to create a form that conveys a dynamic conversational assistant rather than another static representation of a logo, while making sure it does not pose any visual distractions.

Identity

Motion

After many iterations, we observed the greatest potential within stroke and line focused visual that were dynamic and adaptable when transforming into various states. The energy embedded within the lines also resembled body movement, athletic gestures, and even shoe laces, which intrigued us. Bringing Nike’s colors, we eventually generated a unique, abstracted swoosh logo composed of lines that would flexibly loop and intermingle when switching states.

Interfaces

Integration of CUI

Based on the final script illustrating our CUI, we developed a user flow for the mobile interface following the user’s journey from Today to Tomorrow. We carefully studied the flow of the NTC app, and integrated functions of the CUI into screen designs.

Identity

Design System

When designing the app interface, our team studied the design system of the NTC app, and adapted the styling into our CUI screens. We created new UI elements like cards and buttons that further followed the established visual system of the app.

Interfaces

Interface Design

Key design decisions were made based on the conversational needs for both trainer-led videos and whiteboard workouts. For guided videos, we designed the CUI to fit within a landscape view that feels most natural for those watching videos. Conversely, we added customization features to whiteboard workouts, so users may add, remove, or replace exercises on the fly.

Interfaces

Key Interactions

When designing the interactions on app screens with the integration of the CUI, we kept in mind that the elements will function during both voice command and physical interaction.

1. Save specific exercise

Add the purchased product to the inventory by scanning the QR code and receive rewards for registering with the app.

2. Receive immediate feedback

Add the purchased product to the inventory by scanning the QR code and receive rewards for registering with the app.

Start Whiteboard Workout

Flexibly increase Intensity

Find Alternative Workout

Schedule workout

Reflection

Our group not only worked on visual concept, animated that visual concept, conceptualized our concept to begin with, filmed for almost 6 hours, created a video, designed additional print materials, and got crazy granular with our 30+ revisions to our script, but we also got to experience finding a context for our design. Given the nebulous prompt of designing a CUI with no constraints for who and what, our group got to explore what we were personally interested in. Though that left us in a challenging space of trying to facilitate guidance and personalization, it was a gratifying experience to think about ways that we could reform Nike’s platforms to renew their values in a completely new medium. Asking ourselves the questions about creating something that doesn’t exist in a way that would integrate so naturally into a brand that is so established was an ambitious but necessary exercise in getting familiar with design as a package deal of visuals, strategy, and innovation.