![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/adf0460c-c116-4ee5-b421-13baf3fe7e59_rw_3840.png?h=bcc781c21a8320c9c45cd9aa07c6a6bb)
phases is the new approach to menstrual health.
Not all people who menstruate are women, yet all period apps are for women. This contributes to the dysphoria and discomfort that non-binary and transgender individuals face. Menstrual cycles are more than just the period phase. Each phase has its own personality and contributions to overall mood and health.
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/0ae88cb3-5519-45e5-b2e3-5573738f9b4c_rw_3840.jpg?h=11a5e7b3c8b04284046ef1ec3ffb7ce9)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/c7734715-b9f5-4b16-a5ff-edca72dbb2e1_rw_1200.gif?h=aa94d801c33d3ce6c0e20f631cd431ec)
phases educates the user on each individual phase and how to best support their body, in an inclusive non-judgmental way.
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/4e627043-6c00-451e-bda7-264e7436dba6_rw_1920.png?h=8cc52c8d8c6400402439d7b0da170aa5)
Overview: UX, UI, Design Research, Illustration, Product Design
Collaborators: Ashton Bennett, Trinity Sosa
Tools used: Figma, Illustrator, Photoshop, After Effects
Project goal: Create a platform that educates and assists the user through their menstural cycle in a friendly way.
Platforms: Mobile app, smart watch
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/e38a4fae-8f54-4431-aad5-bc6c2ab22a87_rw_1920.png?h=2439f0945d5703d017c4bcc0eaeb89a0)
To conduct user research on our audience, a survey of 50 people was ran. The survey was shared on social media and amongst peers.
71% are between 21-25 years old.
75.9% identify as lgbtq+ counting identity and sexuality 24.1% are hetero normative.
19.4% reported they were knowledgable on the cycle phases, 67.7% reported somewhat aware of cycle phases, and 12.9% not at all.
45.2% respondants had concerns of their mental health, 41.9% had physical symptom concerns.
83.9% claimed they are interested in learning how their cycle affects them.
Takeaway
Based on the survey results, the apps taget audience will be people 18 to 35, have gendar neutral branding, and have a stong focus on mental and physical health that educates the user on optimizing their cycle.
How do we do this?
• avoid feminine language and colors
• gentle health suggestions
• not focus on period and conception
• make each phase identifiable and purposeful
How do we do this?
• avoid feminine language and colors
• gentle health suggestions
• not focus on period and conception
• make each phase identifiable and purposeful
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/d16c8442-2ddb-4a89-a943-4bed58e80bf0_rw_1920.png?h=df723bd535c7e48509f01aa3de067b5b)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/722f602a-3a6a-46a9-92d5-9b85020fe0c7_rw_1920.png?h=19d03b86ab8861de9f1f4bfb71f6e2d1)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/f4180e3c-5b40-484e-81f1-a4d170137ad5_rw_1920.png?h=471b8f8093c1a0ca188cf96c35de5016)
Unique selling point
The majority of menstural tracker applications currently on the market primarily focus on conception and the period phase. phases stands out due to it's ability to have a broader target adience, and have it's primary intention be educating and improving the over all well being of the user, while also tracking the period phase. The competitor menstural apps also include feminine color palettes and language, which excludes people who don't identify as feminine.
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/b0ca227a-7540-41a6-b070-c188d76eb774_rw_1920.gif?h=b79e01340cdbd0fd0415028fcf3647a8)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/c1d8c022-a512-4134-a741-dd9d40deac3c_rw_1200.png?h=d7917aeb7ed9d72530432a0ff495ed51)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/4b0eb5e5-59c0-494e-b95c-477d8c17a786_rw_1200.png?h=15cff7d0d8a6ff2184867dacda2f687a)
The phases color palette and typography was chosen with the intention of being educational, gender neutral, and friendly.
Loading screen
When the phases app is launched, the characters for each phase phase greet you. The phases illustrations are a reflection of the mental and physical aspects of each phase. Putting a character to the phases makes the app approachable, and a confusing topic more understandable.
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/07fc0b3c-c3ea-4688-9ceb-734f32b2beb2_rw_600.gif?h=1ffd077e33407e0e3f7ff101bc1865f3)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/e7656d37-7da1-4d22-8ed4-32b7fd6540da_rw_600.gif?h=a08539a00fdae3537cf3e4c699a04477)
Meet your phases
After analyzing our user research, we noticed majority of survey respondants had little knowledge on the other phases, or only knew about the period phase. Introducing the phases before logging into the app gives the user brief background information on the four cycle phases. The user can swipe through the stackcard to the log-in screen at their own pace.
Create an account
After the user goes through the introduction screens, they are prompted to put in background information that will help phases understand them better, and modify responses / suggestions. The home screen is color coded to what cycle phase you are currently in, and gives the user reccomendations based on their current phase.
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/50c7ac0f-69b0-4700-8c0b-ceadb992e0cb_rw_600.gif?h=19cd88f2e4890b07888660da70196e45)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/dd86b8b6-5b59-454b-a7af-5ebbb61865d6_rw_600.gif?h=7373f7442fb29d7c2bc2b0460f3482bb)
Log period
In the check-in screen, the user can log their period by moving the sliders to tell phases key aspects of their period like the duration, flow and pain. This way, phases knows what foods, exercizes or activities to reccomend.
Phases predictions
After the user logs their period, phases generates what the user could experience for the rest of the month. This way the user can check back and notice patterns or see what phase is coming up next.
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/aad40dcf-bb0b-4d03-a07a-d24571970019_rw_600.gif?h=a77e1bf77b4cbfc9c78f0104e1ca09cf)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/e0419a40-da48-4d4e-9001-6e9f43e53d3b_rw_600.gif?h=c61f69c74a06f16a27a89f0669466916)
Symptom tracker
Users can help phases better understand their symptoms in each phase by using the sliders to show how severe their mental and physical symptoms are ranging from one to five. The notes portion is for any symptom not listed the user has concern of.
Insights
Each phase gives the user reccomended activities like selfcare, meditation, or exercises that cooperate with the corresponding phase. For instance luteal may be light stretching and walking while follicular is more streneous workouts. The journal tab is kept in every phase so you can reflect on how you were feeling during different parts of your cycle.
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/beb6f7a5-fdb8-49eb-b9dc-cdfc9becadc0_rw_600.gif?h=91237b69000a7c59905c182b805ce364)
![](https://cdn.myportfolio.com/5597eedf-6cec-40f4-b7f4-305d33949ca3/78348de2-9a18-4335-9b12-b6a226adaf74_rw_1200.gif?h=57b6b197a178c73d93766727b24fc900)
In the future..
With more time and resources, the phases application would cover the cycle phases along with endometriosis, PCOS, PMDD and how to physically and mentally cope with the effects of period disorders.