Health Is The New Wealth— Designing an app that would modernize Pilates
A little bit of context
For this project, we were asked to create an MVP for a native app that would help people live a healthier life.
During this (really) weird period of time, health has taken a whole new meaning. Since Coronavirus, people realized how much they should take care of themselves, both physically and mentally.
This trend around wellness is not new though and will likely become more and more important in the next few years. According to the Global Wellness Institute “The global wellness economy is currently valued at $4.5 trillion.”(2018 data)
But what is wellness ?
According to the National Wellness Institute, wellness is considered, “an active process through which people become aware of, and make choices toward, a more successful existence”.
Wellness covers various sectors such as (non-exhaustive list):
- Personal Care, Beauty and Anti-Aging
- Healthy Eating, Nutrition and Weight Loss
- Wellness Tourism
- Fitness and Mind-Body
- Preventative and Personalized Medicine and Public Health
The area we decided to focus on during this project is Fitness and Mind-Body. Why is that ? Well, figures speak for themselves : “The physical activity economy will surpass $1.1 trillion by 2023.” (Global Wellness Institute research studies)
Why choosing Pilates ?
According to the Study The effects of Pilates and yoga participant’s on engagement in functional movement and individual health level. Eun Ju Lim1 and Jeong Eon Park (2019) : Recent research continues to support the assertion that exercise is an important foundation for good health and quality of life. Duggal et al. (2018).
As forms of exercise, Pilates and yoga each have been demonstrated to have direct benefits on both physical and mental health through improvement of posture, flexibility, muscle tone, cardiovascular function, weight management, and stress reduction. In elderly women, Pilates was shown to improve functional autonomy, static balance and quality of life (Siqueira Rodrigues et al., 2010)
There we go, we found our subject !
Now, let’s do our own research…
Quantitative data
At the beginning of this project, we decided to begin with an online survey that would give us more information about people actually practicing Pilates.
The survey was made up of 17 questions and we obtained 77 answers.
Here are the main insights we got :
- They are mainly women from 26 to 65 years old (87%)
- 51 of them see Pilates as complementary to their regular sports routine
- 40 of them said that what they liked the most about this practice was the awareness of their body and the benefits it had on us (posture, breathing, relief of persistent pain, better performance in other sports…)
- More than 75% of them want to keep track of their evolution
- More than 60% of them wish they could practice more often, whether because it’s too expensive, or because they don’t have enough time to take physical courses
When asking them what they would expect from an app around Pilates, we had quotes such as :
“Discipline and guidance for an autonomous home practice, complementary to practicing with an instructor”
“ Quality in the explanation of the exercises”
“ Free, with targeted exercises”
“ Options regarding the constraints (intensity, time etc…)”
“Further information about the Pilates method”
but also
“No idea, I need a teacher to help me have a good posture”
Qualitative data
At this stage, we were already aware of the needs and motivations of people practicing Pilates. However, in order to have the whole picture, we dug a little bit deeper and performed Job To Be Done Interviews*, both to casual Pilates people and Pilates instructors. (5 people in total)
*Job To Be Done is a framework used to find opportunities to improve or create a new product by taking into account the context around which users interact with a product.
What we learned during these conversations confirmed what we already discovered thanks to the survey, but also gave us a major insight for this project:
Pilates is not sexy, and definitely not as popular as yoga.
Whether it is because people don’t really know about the practice yet, or because they see it as a soft practice for “older people”, the point is that they wish Pilates could be a little bit more fun.
That also explains why one of the two Pilates teachers we interviewed told us that they tried to make Pilates a little bit more trendy, but putting some music during the courses.
At this point, we needed to use a visualization tool to help us sort out all the data we gathered so far. Therefore, we downloaded all the information we got from these interviews into an Empathy map* as follows :
* Empathy Map : Looking at the world through users’ eyes
Empathy map is a collaborative tool used to synthesize rational and sentimental aspects of our users through their situations, acts, feelings and emotions.
Thanks to this tool, we identified a clear lack of information about Pilates. Also, we realized that at first, users thought it was a soft practice but then, they were surprised with the intensity of the exercises and said that they felt more active and had better performance in other sports. They also like listening to music during their practice.
Time to wrap up !
After this very insightful research phase, it was now time to crystalize it into one problem statement, as follows :
Active and curious people missing information about Pilates, need a way to find attractive digital classes in addition to their regular sports routine because they want to feel better physically and mentally, without spending money and time on physical classes.
Now what ?
Feature prioritization
From that problem statement, we organized a group ideation session in order to define what features should be included in this MVP.
It gave us a lot of good ideas. Too many ideas actually. Because we want above all to avoid featuritis (see the image below), we had to prioritize.
First, thanks to the Buy a feature method*, we were able to spot what were the most valuable features for our users.
Buy a feature is a prioritization method that consists of listing out all the features, assigning them a price (based on relative cost to develop them) and asking the users to buy them using fake cash.
(For this specific case, we decided to get free from technical constraints and therefore, gave the same price to each of the 13 features.)
Then we used the MOSCOW method in order to know what is vital for this MVP, the “Must Have” :
- The live classes for users who want to get corrected by a teacher.
- The replay videos for users who want to exercise easily, whenever they want, but still with explanations of the different exercises.
- The filtering system so that they can access the content that correspond to their constraints.
- Some instructive cards about Pilates in order to fill the gap of information.
- Follow-up statistics about their practice.
User Flow
Before getting into sketching phase and in order to ensure the product is easy to work with, we developed a user flow that represents one of the paths that could be taken by a user while interfacing with the app.
Here is a simplified view along with some side explanations :
Basically, the user will be able to browse some of the live classes, replay videos or personal programs adapted to their sports practice (personal programs feature was not developed in this MVP) as well as get information about Pilates on the home page.
The Videos Tab, accessible from the bottom navigation bar, will host all the replay videos, with a possibility to filter them by length, level, intensity, boost and type of music.
After completing some workouts, the user will get the chance to track his progress thanks to the Statistics tab.
Designing the solution
Validating the flow with Mid-Fi Wireframes
We first started designing in Mid-Fi and after some usability tests, we were able to spot the major issues with the flow. Here are some examples of the iterations we did :
Home page
In the V2, we made sure to delete the play button on the live videos so that users don’t think they can play the video whenever they want, as they can do with replay videos. We also put emphasis on the fact that they had to register to the live session by adding a call-to-action button.
We also added a preview section of the replay videos on the home page so that they can access the videos easily without having to go through the bottom navigation bar.
Videos Page
We realized that the overall organisation of the Live Videos was too similar to that of the Replay videos, which was confusing for the users.
Therefore, we decided to organize it differently in order to dissociate the two sections and also, replace the filtering icon by a label because it was not clear enough.
Now that we validated the main flow and features of the app and adapted the design according to Usability Testings insights, it was time to create the visual universe of the app.
Let’s talk UI !
Creating a visual atmosphere
Athletic — Modern — Informational
Those are the attributes we want our design to be associated with. Indeed, not only Pilates is a genuine sport in itself, but it can also be perceived as modern and trendy. And because people don’t know much about Pilates, we also want our app to be informational.
That’s what we tried to convey in this Mood board.
We can’t avoid the fact that Pilates is mostly associated with relaxation and soothing atmosphere, and that’s ok. The point was to acknowledge that, while adding another layer to it : sportsmanship.
Therefore, we mixed pictures of nature and enlightened places in a soft color scheme, with just a small touch of punchy red as a reminder of the dynamic aspect.
In terms of actual UI elements, this translates into rounded shapes (both in fonts and components), and two accent colors (punchy red for active state and soft green for inactive state) used in icons and buttons.
We also wanted to give a lot of space to video thumbnails as they are the visual cues that will actually motivate users to click on videos and practice Pilates.
Finally, the neon effect was used in the Stats part of the app in order to drive the desire to progress and remind the tracking apps and dashboards.
Dark Mode yes, but accessible !
Those UI elements lay on a dark blue background that softly darkens as you reach the bottom of the screen, so that the accent colors in the bottom navigation bar have enough contrast with the background.
Designing in dark mode was a choice that could help us convey the cool and stylish tone, necessary to address the youngest audience (millennials).
Yet as designers, we know that particular attention needs to be paid to text contrast in dark UIs. In order to make sure that our design respects the accessibility guidelines in terms of contrast, we used the Stark plugin in Figma and here are the results (for both body font color on lighter background and red accent color on darker background) :
Indeed, Web Content Accessibility Guidelines (WCAG) call for “the visual presentation of text to have a contrast ratio of at least 4.5:1,” except for large-scale text, which should have a contrast ratio of at least 3:1. It’s also good to know that WCAG 2.0 endorses the choice of level AA as the objective of global accessibility policies, level AAA being relevant only for certain projects, depending on the specific content concerned.
So Far, So Good !
Final Hi-Fi prototype
Enough talking, it’s now time to reveal our final hi-fi prototype (although no design is ever really finished).
Thinking about Error state
Helping users recognize, diagnose, and recover from errors is the 9th Nielsen Heuristics that we need to keep in mind when designing an experience.
According to Nielsen Norman Group : “Error messages should be expressed in plain language (no error codes), precisely indicate the problem, and constructively suggest a solution.
These error messages should also be presented with visual treatments that will help users notice and recognize them.”
Here is what it looks like in the Pilates Core Workout App if the user selects too many filters.
Checking the desirability
At this point, we wanted to make sure that our brand attributes and values were actually reflected in our app. In order to do so, we organized a desirability test.
Desirability testing is a (both quantitative and qualitative) method used in the late design phases in order to assess users’ attitudes toward aesthetics and visual appeal. This is done by selecting a certain number of mockups capturing all the different interface and style directions the solution could pursue, showing them to a sample of participants and asking them to choose between 3 to 5 adjectives to describe the best what they saw (every participant is given the same grid of adjectives).
All these adjectives tend towards one & the same value : Competency.
Modernizing Pilates ? Challenge done !
Well… not entirely
Next steps
Although the values we wanted to convey are fully anchored in our application, there are still some improvements to do…
If we were to continue on this project, we would perform more usability testings focused on the use of the burger menu, considering that all those information (mostly links to Social Media and Settings) could be integrated inside a user’s profile, that could eventually be merged with the stats Tab in order to alleviate the overall design and experience.
Because our mission was to design an MVP we would also develop new features such as : the premium version for regular users, the addition of a calendar in order to help users organize their sessions, the creation of a community in order to deepen the sharing around Pilates practice and the Programs for more personalization.
Well done everyone, if you’ve reached this level, it means that you lost 8000 calories just reading this article 💪 !
