2022
3 Weeks
Adding a feature, UX & UI Design
UX/UI Designer
One of Nike's missions is to build strong communities through various initiatives. Serving this mission, the Nike Run Club (NRC) application enables its members to become a part of a running community by participating in challenges and events, and inviting their friends and other people to compete.
The social features that are currently presented in the app are virtual in nature. The only opportunity for users to compete in real life through the app is to participate in events that are hosted by Nike. However, events don't happen that often and most of the time they are being held in big cities whereas smaller cities are left behind.
After doing preliminary research and talking to some users of the app, I learned that some of them would like to be able to meet other people in their area for group runs in real life. According to recent studies, group runs help athletes to feel more motivated, get a sense of purpose, and perform better than running solo.
Meet4Run feature that is seamlessly integrated into the Club section and enables users to find other runners in their area for group runs.
I started the research by analyzing the market of the most popular running applications. After familiarizing myself with the features and reviews of NRC’s direct competitors - Strava, RunKeeper, MapMyRun, and also the indirect one - AllTrails, I got a better understanding of what they are the most valued for by their users and how they compare with Nike Run Club.
Another part of my research was devoted to going through Nike Run Club users' reviews on AppStore and GooglePlay to learn what they think about the app. The majority of the reviewers complained about bugs from the recent updates. But I also found a few fresh comments about making the app more sociable.
To better understand NRC users and their needs, I conducted User Surveys, which provided useful qualitative and quantitative data on how they interact with the app, what they value the most in their experience, and which areas they would like to improve.
User Interviews enabled me to dig deeper into the users' emotional world, learning more about their motivations, wants, and pain points.
As a result, I found the direction to move on with the design of the new feature.
What is the users' experience with the NRC app?
Do users need a social feature?
Is there anything else that is more important for users to be improved in the app?
Why do users choose NRC out of all other running apps?
Participants: 7
Age: 24-35
100% participants value the NRC app for its time, mileage, and pace metrics
57.14% of participants chose the NRC app because they like the brand and its products
57.14% of participants feel motivated when running with others
57.14% of participants would like to have an opportunity to meet other people in their area for group runs
42.86 % of responders participate in challenges with friends and other people
28.57% of participants are not satisfied with the community features currently presented in the app
After getting an insight into users' perception of the app as well as their wants and needs, I created this persona, which encompasses all valuable characteristics. This helped me to think more about how I can address the need for meeting like-minded individuals in a user's area for group runs in my future design.
Equipped with the image of the user, I developed a User Journey, highlighting the major points of Emma's interaction with the app during her attempt of getting a social running experience. This helped me to define functional requirements for the new feature as well as visualize and therefore better understand the pain points that need to be solved in the future design.
Building the Sitemap of the Nike Run Club app helped me to visualize the Information Architecture of the application and to discover the best place for the new feature. Since all the community-focused features such as Leaderboard, Events, and Challenges, are located in the Club section, the Meet4Run feature, being social in nature, would seamlessly fit in this landscape.
The next step was to develop a User Flow to get an overview of a user's interaction with the feature and to evaluate the efficiency of the interface I was about to create.
Once I identified the most important pages to design, I began sketching various screens, which I would later translate into Mid-Fidelity Wireframes.
I aimed to balance the existing style guidelines of the NRC app and my new addition to ensure the feature’s smooth integration and native look.
The wireframes include the welcome screen, the screen with the map for looking for locations of meet-ups, the screen with a list of meet-ups, the map view of meet-ups, and the description of the chosen meet-up.
One of the biggest challenges was to balance the existing style guidelines and a new addition to the app. Nike Run Club experiments with the styling of similar sections and adds some playfulness, which might seem inconsistent at the first glance.
However, after exploring the app in more detail, I realized that all those variations harmoniously co-exist and are overall consistent. Therefore it was crucial to maintain this "consistent chaos". Putting all elements together into the style tile helped me to achieve the goal.
After studying the Nike Run Club's styling guidelines, I began creating Hi-Fidelity Wireframes. It was crucial to follow Nike Run Club’s existing styling, information hierarchy, and color scheme.
When the feature is rolled out, the users can access it right from the feed on the homepage.
Another option is to find Meet4Run in the club section, which is located in the main menu at the bottom.
After users read some info about the feature (or just skipped it and scrolled down), they will find the "Explore Meet-Ups" button, which will lead to the screen where they will be able to either create or join the meet-up after entering their location.
Once the user entered the location, they will see the ad with the local meet-up and also some meet-ups labeled on the map. They will also get the option to view the list of meet-ups, which is located below the map.
The meet-up screen, where users will be transferred to after choosing the meet-up they are interested in.
After designing additional Hi-Fi prototypes, I conducted remote Usability Testing with 11 users through Maze.
All testers successfully located the feature and were able to complete the missions with an average success rate of 82%.
The main pain point was finding the list of meet-ups and also choosing the specific meet-up on the map due to the small size of the labels and their color.
My initial decision in choosing those specs was dictated by the NRC styling guidelines for similar elements. However, after discovering that this solution results in a disruptive user experience, I decided to explore other ways to improve the experience without disrupting the existing framework.
01. I made the accordion with the list of meet-ups more visible by placing the widget above the map.
02. With labels, it was a bit of a challenge because I wanted to preserve the shape and color that the Nike Run club uses for similar elements. The final result was adding a shade and increasing the size of the labels.
I also added more information to help users make decisions easier and faster.
Introduced a new social feature that enables users to meet like-minded runners in their area for group runs
Athletes in smaller cities will find friends that share their passion with more ease
Nike might deepen their collaboration with local governments on building stronger communities by encouraging local meet-ups
