Art direction, design, and UX for a mobile app designed to get in you and out of the gym efficiently
Workout apps are a dime a dozen these days, with everyone from Chris Hemsworth to Peleton to Nike telling you they can get you the ideal body with just a download (and a nutrition plan, a new pair of sneakers, an exercise bike that costs as much as a used car, and whatever else they might be able to upsell you on, but I digress). But what if there were a fitness app that would let you target certain muscle groups while keeping you on schedule so that you’re in and out of the gym efficiently?
That was the idea behind SmartFiit, a project I worked on initiated by a bodybuilder who saw a need for a workout tracker that would help users save time in the gym. He had the idea to produce an app that would guide you through creating a workout to fit an allotted timeframe with an accompanying timer so you could get in and out of the gym on your schedule. I was brought in by the development firm to lead the design and UX efforts.
I was able to start on the project at an early phase to help with naming, branding, and art direction before diving into the user experience aspects. We decided on the name “SmartFiit” with the double i’s referencing High Intensity Interval Training (HIIT). The initial aim of the app was weight lifting, but future plans included the possibility of expanding to other cardio and calisthenics workouts. The identity for the app was created with a sporty, athletic feel in mind, and a navy and orange color palette was decided on to set it apart in the crowded fitness app marketplace.
The client came in with an idea of the general features they wanted to include, but a limited budget meant that we unfortunately couldn’t allocate too much time and effort into user research. I used a simple survey form with a group of about twenty fitness enthusiasts to get a sense of what fitness apps they were using, what their needs were in a workout app, and any additional features that would be desirable. The responses showed that a good number of potential users liked the idea of being able to get pre-planned workouts and that few apps on the market presented adequate tracking and workout history, both items that we wanted to include as core components of SmartFiit.
I also created two simple personas to help frame the problem, one of an experienced bodybuilder and another of a person who was new to the gym. This helped us evaluate the terminology and exercises from different perspectives and make sure the app was accessible for people of varying skill levels. We discovered that a lot of terminology would be rather foreign to a novice user and discussed integrating video examples showing how to correctly perform exercises into the app. The scope of the project didn't allow for in depth exploration of how we'd implement video examples, but it would definitely be a priority for future iterations.
I wanted to use prototypes to test out a few features, primarily different methods of recording workouts. My research showed that most workout apps use either numeric keypad entry or stepper controls to enter weights and repetitions, but it occurred to me that a slider might be a more effective way to adjust the weight used on an exercise with a stepper used for repetitions.
I used Principle to create simple prototypes demonstrating each method then did some guerilla testing to get user feedback. Users overwhelmingly preferred the slider for entering weight, finding it far faster and more efficient than the stepper. As a user established a workout history the app could also use that data for more efficiency, defaulting to a previously used weight and rep count so a user’s adjustments during their workout would most likely be minor.
The final solution based on user feedback was to go with a stepper to enter repetitions (which would generally only vary by a few reps) while using the slider to record the potentially more widely variable weight used on each set.
I met with the client several times to talk about what they wanted the app to be and how our user surveys lined up with that. The user surveys indicated a desire for pre-planned workouts and workout tracking above all else, so based on that data we narrowed down the app into 5 main modules consisting of a user feed, a logbook for seeing your past and scheduled workouts, a store for purchasing influencer workouts, an activity tab to view graphs of your progress, and the primary screen for loading and creating workouts.
The client initially suggested the idea of a floating action button, something that many fitness enthusiasts would be familiar with from the popular My Fitness Pal app. I dismissed the idea at first, but after evaluating how it was used in other applications realized that it might be an appropriate use case for the primary workout button in the app. Having a main button with multiple options would allow a user to quickly choose to create a new workout, load an existing one, or plan their week from any screen in the app. The navigation would need to be further tested and refined, but in initial tests users responded positively.
My final deliverable to the client was a clickable prototype built in Principle that allowed a user to move through the different screens and test the workout functions. The plan moving forward is to use the prototype to demo in a promotional video and Kickstarter campaign to fund development of the actual app.
If I have a chance to continue working on the project, I'd like to invest more time into the functionality of the workout module and in particular how a user would plan their workouts for the upcoming week. I created a quick mockup of this screen for the prototype, but moving forward I'd want to do some prototyping and user testing to find the best possible method of scheduling workouts.