StriveFit is personal training marketplace. Users can hire trainers for periods of time and have them create personalized workout routines. Personal Trainers can find more clients and use the iOS app to create and send programs.
In the past few years I’ve gotten really close to the fitness industry, having designed apps, web apps and websites both for beginners and professional athletes. StriveFit seemed like a fun project.
Fun, but challenging. Most fitness apps (iOS or Android) actually rely on a web-based dashboard where trainers can go an create the routines. The actual mobile apps are used for the clients to view those workouts and… train.
However, for StriveFit, we couldn’t rely on anything — both trainers and clients would do all work solely on the iOS App. They’d have to create the workouts in a small screen, get paid through the app and more.
The product manager involved in the project had done a scoping phase before I joined. My first action here was to review the existing documentation, and later on interview the client to get a good grasp of what he was trying to accomplish. Since I had a lot of background experience in the industry, I had a great understand of the market, competitors, user needs and other areas that might have taken significant time to research.
It’s important to note this doesn’t mean research didn’t have to be done (Always talk to users, always understand the business), simply that we could move faster through it.
We took the time needed to create a solid foundation. Issues that arise later in a project’s life often stem from something done wrong at these early stages, so I always try and make sure all the existing knowledge is shared and that the team (managers, client, engineers and other designers) is on the same page.
Once we were confident we had a good grasp at:
Then we decided to move on to wireframes and start to visualize how specific interactions would play out within the parameters of an UI.
I’m definitely not being paid to promote UXPin, but I have to emphasize how much I love this tool. It has a great library of base elements, it’s versatile and makes it super easy to collaborate with the client and team members. Not having an offline mode absolutely sucks, but I’m confident they’ll address this at some point.
With the wireframes, we started off with the most important interactions, and after various iterations to get them sharp, we progressed through the remaining areas. Some of core things we had to get right:
The workout creation tool for trainers was probably the trickiest part. How to make sure searching for exercises (or creating new ones) and organizing series, reps and workouts into programs is easy to do in a screen with only a few inches?
After a number of iterations, we finally arrived at a prototype that, even at this level of fidelity, enabled users to accomplish their goals. The client and I were very satisfied and the engineers were on-board with the technical requirements.
The next step was to move on to the mockups.
Since the wireframes provided a really solid foundation, working on the mockups was a smooth ride — we used iOS’ San Francisco, a perfect fit for this project, and a color palette with orange as the key color; which works very well with fitness products.
The mockups were light and minimalist — in a good way. Trainers would likely use this on the go, in between training sessions, and clients would be at the gym looking up their programs in between sets. The clean interface and large elements were intentionally designed to facilitate use in those scenarios.
I’ll include a few mockups below — which should give you a good sense of the general look and fell.
It’s always a great feeling to be excited to use something you’ve designed. This is the case with StriveFit — I’m keen to try it out and use it when I go to the gym.
The client was really happy, engineers confident it could be built within the timeline, and the testing sessions we ran were overwhelmingly positive. All in all, I can definitely say this was one of the most enjoyable projects I had the change to work on in during this year.