Fitness Goal in Your DMs

From your friend Candice to Imagine Dragons, talk about whoever or whatever you’d like with the social features in your new fitness app

The Project Query:

The mock scenario given revolves around a mobile friends & family health tracking app created by a supposedly well-established company that wants to implement new messaging features to create sustained engagement and user retention. The context being that so far, their userbase tends to only use their app for about 3 weeks before their usage starts to teeter off.

The Remedy:

Heartbreak is a great motivator for the gym the same way the gym was a great motivator for me to work on solving the user retention issue by designing not only just a messaging feature but an entire social media aspect into the fitness app. My learning curve so far as a studying UX/UI designer has felt accelerated ever since I’ve learned to play to my strengths.

Research:

As per usual, one of the first steps to designing an app is to study what competitors are already doing. The main goal is to take a look at where they excel and where they fall short, and then taking that data to figure out the best ways to improve on their strengths and weaknesses. Before that though, asking yourself, “what are the users’ needs?”

Defining User Needs:

  • Users that would choose to use a fitness app are users who need structure and incentives

  • App needs to be easy to use but still a lot of fun in order to keep engagements and user retention high

  • Large portion of userbase will likely be beginners who need the extra support structure and experienced users who are eager to share their accomplishments and participate with others

Competitors’ Strengths/Weaknesses

-Productive Habit Tracker-

Positives: Friendly vibes; Articles for reading; Fun original graphic designs; Mental health help

Negatives: Glorified digital self-help book; Dark theme doesn’t fit graphics; Aesthetics induce drowsiness

The app offers different programs you can partake in, but unless I already have my own source of motivation, the app doesn’t offer much on its own.

-Fitlist — Gym Workout Log-

Positives: Bright color scheme is invigorating; Allows sharing of achievements publicly; can see friend’s achievements; Message potential

Negatives: Too basic; Boring vibe; Achievements are small text-based posts with little to no interaction opportunities

The app gives a taste of what the business goals of what our project is striving to do but ultimately falls short with its overly minimalistic design and lack of aesthetic choices.

-Map my Run-

Positives: Bright color scheme; Friends/sharing system; Incentivizes users to post photos of their fitness achievements for others to like and comment

Negatives: No real messaging capability; Could do more to promote user interactions

Very good show of sharing accomplishments which allows the app to incentivize users to continue engagement but lacks in options to do so

-Nike Run Club-

Positives: Bright color scheme; Articles and Plans; Leaderboards between friends and community

Negatives: No sign of messaging capabilities; not clear what adding friends on the app allows users to do besides leaderboards

The app has a lot of features which could be deemed useful for some users but offers little to no functionality in terms of user-to-user engagement that we are looking for

Design Process:

Creating a Company Name & Visual/ UI Style:

I knew the company name couldn’t be something complicated or generic. To really emphasize on keeping the company’s business goal in mind I eventually settled on the name Post-Fitness. As for figuring out the visual design style, I already knew based off of the competitor research I did that it had to be something bright, minimalistic, and fun-ctional.

Sketching User Flows:

I originally had started with sketching how I wanted my app’s frames to flow, and I began to sketch until I remembered that I am not creating an app from scratch. It was very difficult for me to picture the user flow properly before having a basis of what the app would look like before having taken the pre-existing concepts given to me to create a new shell.

After looking at the rough mess of a user flow I had sketched, I made the decision for myself that I would create a low fidelity home page for the new fitness app, and from there I would then one by one add the features until everything was complete.

Low Fidelity Wireframes:

As I had said previously, I decided to create a homepage first and add all the features that I believed it should have on the homepage and this is what I ended up with. I decided that the main focus of the app, based on my research and the limited information from what the scenario had told me about what the app can do, this home page design is what I ended up with.

Then once I had the home page taken care of, perhaps because I’ve spent such a large part of my life creating my own brands through social media, the rest came to me so naturally.

High Fidelity Prototype:

By the time I had finished modeling all of the high-fidelity frames, I had ended up creating a few more frames that I felt were ultimately missing from the low-fi wireframes. As a minimum deliverable product, I made sure the prototype had all the frames I deemed relevant to the social media features I had the responsibility of designing for and leaving out the fitness portions of the app for which I was not disclosed the details of.

Usability Testing:

As an app is never complete until it’s had its rounds of user testing, and I’ve found the most effective and simultaneously time conservative method is commentary-based testing with posttest interview.

  • Test prep: prepared interview questions and specific tasks for test users to perform before letting them freely browse prototype.

  • Commentary testing: noting users live feedback can garner insight that users may not remember to speak of by the end of testing and needing to recall what anecdotes they may have wanted to share.

  • Interview: laying down pre-written interview questions to collect specific information needed to understand quality of user experience.

Synthesizing Results:

While the testing conducted does not ultimately give adequate data to deem whether or not the fitness application would be used, the overall user feedback for the social media aspects designed for this project served to meet its desired effect.

All participants felt:

  • The social aspects of the app feel comparable to social media platforms they enjoy using regularly

  • The interface performance was simple and easy to use without sacrificing aesthetics

  • Users only concerns were more relating to the actual fitness programs available than with the UI itself

Some users were able to help point out small errors like back buttons being too small to press, navigation bar being awkward, and not having access to view more comments, all of which were patched. Most insightful piece of user feedback was that the program rating system needed an overhaul, so I went back to create a reviews section for potential users to be able to give more in depth ratings on the app’s fitness programs.

Another change I made based on user feedback was changing the follow button which was originally hidden behind a menu overlay to being right on the profile page instead, which in hindsight makes a lot more sense.

Debrief:

I had a conversation with another designer the other day where we talked about how there can be ethical and non-ethical design formats because design ultimately boils down to “how can I design something that will trigger a dopamine response in the user’s brain in order to retain their app engagement”, and this project really dove deep into that idea. Social media ultimately is designed to get users hooked by incentivizing them with the possibility of garnering attention for themselves as we are, ultimately, only human.

The more I design, the more I find myself falling to my own little cycles of dopamine traps whenever a project of mine concludes in a way where I can feel proud of what I’ve accomplished. Maybe it’s a start of an addiction, or maybe this is what people call passion.

Test The Post-Fit Prototype Yourself!