Spark

Spark is a fitness motivation app that tracks users’ goals, gym routines, and offers motivational resources.

Overview

The Challenge

Fitness and motivation are almost synonymous with each other, you can’t have one without the other. However, so many people have the desire to go to the gym yet lack motivation. This eventually leads to people abandoning the gym and giving up on their fitness goals.

The Solution

An app that would keep a user’s motivation for the gym strong. This would be done by having the user set a concrete goal(s), create/ manage workout plans, and have access to motivational/fitness content. Having a long-term goal in place allows a user to see their progress over a period of time. Having a clear goal visualizer will increase a user’s motivation, gym attendance, and will give the user something to continually work on.

Process

Understand | Ideation | Sketching/Guerilla Testing | Wireframes | High Fidelity| Usability Testing | Refine

Duration

5 Weeks

Understand

Primary and Secondary Research

The research started quantitatively with screener surveys. These surveys created a database of users to reach out to in the future for further research. Additionally, this research yielded interesting statistics regarding users’ pain points in the gym. Following the surveys, qualitative research began in the form of interviews. The information gathered here was invaluable to the project down the line

Analysis

From affinity mapping, personas, and empathy mapping, it was found that all long-attending gym members had a concrete goal in place. This allowed them to track their progress, see improvement, and increase motivation. New gym members are often identified as having more vague goals like “I want to lose weight” or “I want to put on muscle”. Those who started with vague goals experienced not seeing results, burnout, and eventual lack of motivation. This isn’t to say long attending gym members did not struggle with motivation. Long-attending gym members had trouble keeping track of their progress over time.

Ideation

Choosing an App

It was decided that a goal-tracking/fitness-tracking app would be the solution to users’ lack of motivation with fitness in the gym. An app was decided because users would always have their phones on them while working out at the gym. This would allow a user to painlessly log progress on their goals and fitness

User Flows

Following ideation, user flows were created. These user flows served as a crucial step in establishing the general layout and structure of Spark. By mapping out the various user journeys and interactions within the product, I was able to define the fundamental design elements and user experience of Spark. The user flows also allowed me to identify and address any potential pain points or usability issues before moving forward with the development process. Ultimately, the creation of these user flows laid the foundation for the successful development of Spark.

Sketching & Guerilla Testing

How’s this supposed to work anyways?

Sketches were created, following the user flows. Guerilla testing was conducted on these sketches and it was found that users would like to hold more than one goal, participants needed more explanation as to why holding a concrete goal is important, and users had trouble accessing more details regarding their goals.

Wireframes and High Fidelity

Let’s Get This Show on the Road

Taking in the data from guerilla testing, wireframes were created. These went through a round of feedback from other designers, then a high-fidelity mockup was created. With this, basic usability was created.

Wireframes

High-Fidelity V1.

Usability Testing

Let’s See How this Think Works

Usability tests were conducted with 5 participants pulled from the previous screener survey. They were asked to conduct several tasks along the app’s red routes. There was a lot of data collected in this section, as the app was still at a very basic level. The main issues encountered were that participants did not understand the motivation page (later changed to the resources page), participants were not sure of the meaning of the goal page, participants were unsure how to adjust/manage their workout plan, and participants had trouble differentiating sections of the app, due to its color scheme.

Spark V2 & Usability Testing

One More Time!

The feedback was taken in and a new version of Spark was created. This included clearer labels for users, better accessibility, and a new color scheme. A secondary usability test was conducted. All usability issues were inconsistent and minor.

Scope and Constraints

There was a limited time frame for this project to be completed. As a result, there is more research to be done, more time should be placed in the UI for accessibility and user testing, and more pages should be created.

I was the sole designer on this project. Therefore, the usable versions of the app are on the most basic scale, through previewing software. Additionally, feedback from devs would be necessary in order to fully flesh out the functionality of this app.

Outcomes and Lessons

Working on Spark helped me develop my skills with user research, taking in feedback, research analysis, UI design, and usability testing.

One of the main lessons I took away from this was to not get too caught up in small details and to focus on the original user analysis. Throughout the process of creating Spark I would often get hung up on small details, designing these details to death, ultimately creating something that was not along the line of the original vision. This came through with the first round of usability testing on my high-fidelity design, which eventually led to a drastic UI redesign on my second round of high-fidelity design.