For this project, I was prompted to create a minimum viable product for a lifestyle app that solves a problem of my choosing. After doing some preliminary research, I chose to create an application that syncs users’ fitness routines with their menstrual cycle.
Overview:
Sole designer, responsible for the entire design process from research to prototyping.
Responsibilities:
Timeline:
80 hours.
Project type:
Designlab case study.
The problem: Many people report that their energy levels vary greatly throughout their menstrual cycle. Because of this, becoming and staying active throughout different parts of the cycle can be challenging at some times, and far easier at others.
The solution: Cycle-syncing with Tides optimizes users’ well-being by tailoring workouts and wellness to their unique menstrual phases, fostering a harmonious approach to fitness and health. Maintaining a wellness routine that honors the different phases of the menstrual cycle helps users balance hormone levels, capitalize on energy levels, and can even reduce menstrual symptoms.
I started with doing desk research to gain some basic knowledge on the menstrual phases and what energy levels look like throughout each, as well as some recommendations for activity and nutrition throughout each phase.
I then created a survey in order to gather data from real people, in regards to their menstrual cycle and how it affects their activity levels, and how tracking that information may be valuable to them.
I did gain some insight into other applications that the participants use for period tracking and fitness, but found there were no other apps that sync the menstrual cycle with fitness.
Research Methods:
Out of 11 survey participants, 91% said that their fluctuations in energy levels during different menstrual cycle phases impacted their exercise routines.
Utilizing an affinity map to condense like-data, I also gathered the following information:
Accurate cycle predictions are very important to users.
Users would expect to input their own symptoms/data in order to get accurate personalized predictions.
Users want a way to be able to know when they are going to feel differently/have different energy levels due to their menstrual cycle. This would enable them to optimize workouts and prepare different nutrition plans, creating a wellness routine specifically tailored to them.
Key Insights:
“More sophisticated advice beyond "do yoga and walk" in your luteal phase, and more info for different levels of athleticism - is this what the US women's soccer team does? I doubt it.”
“I struggle to find exercises that are 'comfortable' during a cycle, as most of my workout is pretty hard/intense - when I'm on my period, I have to completely stop working out because I feel so tired weak - so maybe a guide on how to stay active - even when cramps - cravings -moods happen.”
“I have not used a single app that addresses both of these, so it would be helpful to have exercise recommendations on days that my energy feels lower.”
Once I had gathered all of the information from my surveys and created an affinity map, I created two personas to capture different users that would use an app like this.
Personas:
Samantha represents moderately active users who would like to increase activity, but need guidance as to how to optimize fitness while honoring their cycle.
Alex represents users who do not identify as cis-gendered. Alex wishes that there was a more inclusive app out there that doesn’t use gendered imagery or language.
How might we enhance the user experience to make cycle-syncing with workouts and wellness insights intuitive and personalized?
HMW Questions:
How might we create engaging features that encourage consistent user engagement and adherence to personalized fitness plans throughout different menstrual phases?
How might we effectively integrate menstrual cycle tracking into the app, providing valuable insights for users' fitness routines?
With my personas, HMW questions, and responses from survey participants, I gained a deeper understanding of features that were essential to a product like Tides, and mapped out my “Must Haves".
Must haves:
Period tracking elements such as: calendar, symptom recording, menstrual phase.
Workout recommendations based on energy level.
End-of-day check in to collect data on users activities and symptoms.
Feature Prioritization:
With my users in mind, I moved forward to my ideation process. I began with sketching out content areas on a Home Screen, then drafted up a high-level site-map.
These provided a basis for sketching out other key screens.
Ideation:
The Tides name represents the ebb and flow of the menstrual cycle and its’ accompanying wellness needs. My main goal for branding this particular app was to ensure inclusivity, mostly in the language and overall feel of the app. This included avoiding pink and purple color schemes, and being mindful of not gendering language used within the UX copy.
Branding:
When moving onward from sketches to wireframes, I mainly focused on creating content that closely represented how I wanted my final iterations to look. Adding such content allowed me to visualize my final product and utilize a grid, ensuring consistency throughout my design.
Wireframes:
While moving from mid to high fidelity wireframes, due to some feedback, I made some changes to the structure of some of my screens and task flows.
Iterations:
Once I completed my high-fidelity screens, I created prototypes for key task flows using the Figma Prototype Tool, and conducted usability tests through Maze in order to gain as many participants as possible in my limited amount of time. Participants were 12 individuals, and they were asked to complete three task flows. I measured completion of task, reported ease of each task, and time on task.
Below is the second task flow, where users are asked to log a variety of menstrual symptoms.
Usability Testing:
My first task had the highest misclick rate of 74.8%. Users reported not knowing which icon in the navigation bar to select.
In the first task, most users wanted to select the “arms” filter at the top of the page. While this isn’t an inaccurate path to take, I had not foreseen that users would want to take this path and therefore did not activate this button in my prototype. This seems to be where the misclicks happened the most.
Key Findings:
Based on my findings from my Usability Tests, and some suggestions from users, I made the following iterations.
Priority Revisions:
This project, being centered around a topic I personally care about, was very enjoyable for me. However, because this topic was one that I had many ideas for, I had to learn the importance of prioritizing what features are essential to my users. There were a lot of different aspects to cycle-syncing that I would have included if I had more resources and time. I would also have gone more in depth with my research, both in the discovery and usability testing phases.
Next Steps & Conclusion: