Fitter is a very early stage startup that suggests fitness activities to athletes on a mobile app. Think Tinder for fitness events. Fitter is using machine learning for smart suggestions based on user preferences. We were tasked to design onboarding process and profile screens for the app. Co-founders of Fitter were ready to apply for Y Combinator soon after the end of our sprint project with newly designed screens for their swiping mobile app.
Competitive l Comparative analysis
Since Fitter`s particular niche market is athletes, we realized, there were not many mobile applications that offer fitness events to this target market. Most of the companies we looked at offer variety of different events including fitness category. We also looked at fitness apps for workout plans like Nike and some swiping apps.
Survey
56% of athletes participate in fitness events multiple times per month
94% are more interested in the event if they know their friend is going
Card Sorting
Originally, Fitter had 4 categories of fitness related events: Endurance, Outdoors, Fitness, Sports. Each category has a variety of subcategories to choose from when looking for events. We conducted card sorting to see how users will group different types of events and came up with slightly different categories based on results.
Personas
Empathy map
Interactive onboarding vs questionnaire
Ideation & Iteration
We wanted to make a difference for Fitter and make their onboarding process fun and seamless experience. When using swiping apps, people don't hesitate to swipe through a couple of options. We came to an agreement with the client that it shouldn`t be required for users to create an exact athlete profile during onboarding by going through 12 questions. Instead, we wanted to offer to choose from event categories they are interested in and start swiping, Fitter then will be able to learn their preferences since they use machine learning.
Iteration #1. Paper prototype
It was challenging to test swiping mechanic with lo-fidelity prototypes and even with Invision prototype, users were not able to perform card swiping and seemed very confused. The situation changed when we built an interactive prototype with Flinto.
Key takeaways
・Introducing the app and swiping functionality while onboarding
・Idea of indirectly visualizing interests of our 3 personas
・Realized that Tinder might not be the best inspiration (Not the best use of screen real state)
・Swiping apps are often limited in navigation and are kept very simple
Usability testing with flinto prototype showed
・People often don’t read instructions
・Little details make a big difference
・Users were still confused about swiping
and needed more visual explanation
Tour
The idea based on 3 personas mentioned above
Functionality tour
Little animations help user to understand swiping mechanics without reading instructions
Interests
Interests are presented as cards for consistency. In order to make sure that user is swiping to the right direction and not just swiping we needed to stop the user after the first category and confirm the choice.
Fitter is searching for events based on your interest near you.
Swiping events
User can start swiping through events while Fitter is learning user's preferences. User can change categories and narrow down the search by using filters.
Logo Redesign
