Strong Strong Friends

Turning a website into an app for an improved user experience.

Mobile App
View the Prototype

Overview

Project Overview

Strong Strong Friends currently has a web based weight training program, and an active Facebook community where people support each other and offer advice on form. Using the website on mobile at the gym can be a bit cumbersome and as a user myself, I kept thinking about all the ways an app would improve the experience.

For example, Strong Strong Friends provides great resources in the form of animated GIFs and YouTube tutorials, but accessing these while working out can be cumbersome. There is also no way for users to track progress and weights used digitally. In addition, the way subscribers currently use the connected Facebook group was really interesting, and could be even more powerful if it was integrated into the app.

The prototype I've designed offers a fully integrated digital solution for using all of SSF's programs, easily accessible resources and video library, as well aggregation of all of Strong Strong Friends social media feeds. In addition, I introduced the idea of the Form Check forum so users could take the conversation they are already having on a third party platform into the app.

Objectives

  • Make the program more useable at the gym.
  • Let users track their progress by inputing the weight used and auto-populating a suggested weight for each exercise.
  • Develop an integrated solution for receiving feedback on form.
  • Make resource library accessible and easy to use while exercising.
  • Aggregate all Strong Strong Friend's social media feeds into one place.

Target Demographic

Target demographic included current subscribers to the program, people who are new to exercising or don't exercise at all, and those who are already very comfortable lifting weights.

Project Note

This was a speculative project for my own amusement, and part of coursework for DesignLab.

Process

Research

  • Competitor Analysis
  • User Survey

Empathise

  • User Personas
  • Reviewed member comments on Facebook and other Social Media Platforms

Define

  • User Flow
  • App Site Map
  • Task Flow

Design

  • Ideation and Sketching
  • Low, Mid, & Hi Fidelity Wireframes
  • Low and Hi Fidelity UI and Prototype

Test

  • Two Rounds of User Testing
  • Refined According to Results

Research

Competitive Analysis : Strength Training apps

I began by evaluating a variety of apps that offered strength training and workout programming. I was interested to see how they handled social connection, user input, and transitions between resources and the workout program.

Nike Training Club
  • Preset programs or class/video based, with a variety of workouts : bodyweight, yoga, HIIT, strength training
  • No option for user to track weights used
  • User can see past workouts
  • Time based - each move is performed for a certain amount of time
  • Clean interface and lots of on brand images
  • Tons of free content
Strong
  • Example routines available
  • Also allows users to make up their own workout, add weight amount, reps, and RPE as well as previous weight
  • Workout library with illustrations to show lifts and moves
  • Lots of personalisation and note options
  • Dashboard with history view
  • Integrated macro tracker
Sheiko
  • Powerlifting program based Boris Sheiko’s training philosophy.
  • Overview with graphs
  • Linked Youtube videos to show moves
  • User can input weights used. Program builds on last weights used so user knows where to start
  • In general, interface is clean but navigation
    can be confusing
  • Area for user to input workout notes
Strong Lifts 5x5
  • Simple app to keep track of weight amount using the 5x5 program
  • Nice simple interface
  • Easy to get started, no complicated login process
  • Workout history overview
  • Area for user to input workout notes
  • No resources for learning more about the lifts.

Summary of Findings

Every app reviewed had a companion Apple Watch app. Nike had the nicest instruction, with dedicated short videos on how to perform the moves. Of all the apps, Strong was the most complicated and flexible app, with many options for workout programming, note taking, and even macro tracking. It was an all encompassing fitness app. The Sheiko app was suitable for people who want to follow a power lifting program, adjust the weights, and make minimal notes. It’s not intended for users who want to design their own program. StrongLifts was a simple app meant to take the place of paper and pen.

User survey findings

A user survey was posted online in the Strong Strong Friends Facebook group, on Instagram, and on another weightlifting and fitness Facebook group. Everyone who took the survey did some kind of exercise regularly, with almost 60% working out at least four or more days per week.

  • Users wished for more training options and more social connection in the apps they were currently using.
  • Favorite features included tracking, workout previews, and the ability to customise.
  • 2/3 of respondents kept track of their workouts and progress in some way, and 60% used an app for this.
  • Respondents  overwhelmingly look to social media for exercise education and inspiration.
Read the full survey analysis here.

Empathise

User Persona

This user persona is based on the demographic for Facebook group for Strong Strong Friends, combined with results from the user survey conducted during the research phase. Active members of the Facebook group are predominantly women with an interest in weightlifting for overall strength and health, as well as breaking down the stereotype that women should eat as little as possible and be as small as possible.

Define

task flow

In the task flow, I explored the information architecture for the app, and looked at how all the features would work together. The tasks were divided into four main categories, all accessible via a dashboard.

User Flow

The user flow expanded on the task flow byimagining how the user would move through the app while working out, and how they would approach different scenarios. It was vital that moving between the workout screen and the resources was effortless and intuitive because the environment where they would be using this feature (the gym) was likely to be filled with distractions.

Design

Lo Fidelity wireframes

The low fidelity wireframes began as sketches before moving on to the computer. In this step I focused on iterating and brainstorming ideas for the workout screens, since this seemed to be the most complicated part. Based on my research, it was equally important that users were able to both view instructions and input data, so I lead with these two things.

Mid Fidelity wireframes

During the mid fidelity wireframe process, I did another round of testing to make sure users were able to effortlessly navigate the app. This mid stage testing was invaluable because we were able to pinpoint problem areas in the workout flow and navigation. Specifically, users were unclear about the structure of the workouts themselves. In the high fidelity version, these issues were eliminated.

Here are the complete mid fidelity user testing results.

A closer look at the specific changes made after testing is here.

Test and Iterate

Testing Method

We performed two sets of testing with low and high fidelity prototypes. The testing demographic included people familiar with the workout program, people who exercised regularly with workout apps, and people who did not workout regularly or have experience with apps.

Findings

In the first round of testing showed that users wanted to tick off each exercise as it was performed, even individual exercises in a circuit. Our original hypothesis was that this would be tedious, but user feedback told us that this was motivating and led to a feeling accomplishment.

In the low fidelity prototype there was a bit of confusion about the structure of the workout program. We created a new screen that gave users an overview of the workout, adjusted the navigation, as well as the workout input fields to help with this confusion.

Conclusion

The biggest challenge of this project was designing an intuitive user flow for the workout structure, and making sure the instructional resources were easy to access. It would be interesting to explore are whether users prefer to use the social aspect integrated in the app, or if they would rather use traditional platforms for this.

High Fidelity Prototype

Other Projects