Winx

Tracking made delightful

Winx is my personal project that is rooted in the belief that women's hormonal health management needs to be made more inclusive and supportive. Winx is a response to the shared experiences of both men and women in both my professional and personal circles. Having heard frustrations that are repetitive and often misunderstood I set out to create a space where individuals, including myself, can navigate their needs with the right kind of support. Winx is a reflection of my commitment to blending technology with empathy, addressing the nuances of hormonal health in a way that's personal, inclusive, and empowering for both men and women.

Conduct foundational research to:
- Understand hormonal health challenges and the needs of the target audience.
- Study state-of-the-art features provided by existing hormonal health management apps.
Strategize ideas to cater to the needs of a diverse audience.
Design an intuitive user experience to meet key expectations.

My Role

User researcher and UI designer (solo-project)

Project Scope

6 weeks (july-Aug, 2023)

Tools & Tech

Figma, Figjam, HTML, Adobe Illustrator, Adobe Photoshop

The Problem

Men and women who face challenges related to hormonal health issues require an inclusive and supportive platform to effectively navigate their concerns. The current landscape lacks a comprehensive solution, hindering individuals and caregivers from managing hormonal health needs smoothly.

The Approach

Following the Double Diamond framework, our approach began with comprehensive research, diving deep into user interviews, competitor analysis, and heuristic evaluation during the "Discover" phase. This led to clear problem definition with "How Might We" statements in the "Define" phase. In the "Develop" phase, we brainstormed solutions, focusing on onboarding, card design, and sharing flows. After creating prototypes in the "Deliver" phase, we worked collaboratively with the client to bring our recommendations to life during the "Implement" phase. This systematic approach ensures a comprehensive solution to Deets' challenges.

The Outcome

Here is a snapshot of the HiFI UI mocks of the Winx app. Listed below are the key features:

Home Page:
- A snapshot of the user's hormonal health status, featuring key insights and trends.
- Easy access to mood tracking, symptom recording, and partner support features.
Symptom Logs:
- Detailed tracking of physical and emotional symptoms, facilitating a comprehensive overview of health patterns.
Calender:
- An integrated calendar displaying cycle phases, mood fluctuations, and symptom occurrences.
News and Updates:
- Curated news articles related to hormonal health, providing users with relevant and up-to-date information.
Community Forum:
- A community forum for users to discuss shared experiences.
Partner/Caregiver Support:
- Shared Calendar: A shared calendar for partners to stay informed about the user's hormonal phases and receive timely alerts, fostering empathy and understanding.
- Educational Resources: Accessible information and resources to help partners better comprehend hormonal health challenges.

The Approach

As Winx is a personal project and being closely associated with the issue as a woman, I consciously resisted the urge to confirm my personal biases. I used the double-diamond framework as a guide to ensure I followed a structured approach throughout. The profound complexity and under-discussion nature of hormonal health issues motivated me to invest significant energy in user research and I ended up generating a wealth of data from both men and women. After understanding existing market perspectives, I conceptualized ideas and transformed these into practical mockups that kept inclusivity and empathy at its core.

Discover

User research and

Understanding the problem space

Personal Interviews

Details:

4 Personal interviews conducted (3 female, 2 male)
Age group: 15-65
Interview duration: 45 minutes

Interview Objectives:

Explore the experiences of diverse individuals in managing their hormonal health.
Understand the perspective of partners and caregivers regarding their role in supporting women's hormonal health.
Gain insights into the unique needs, challenges, and preferences of women and caregivers.

Key Insights:

Mood management and psychological wellness are significantly limiting for women in the menstrual age group.
Women experience challenges in effectively communicating their hormonal health needs to partners and caregivers while navigating through challenging phases of their cycle.
Men find it difficult to understand women’s hormonal health needs owing to the lack of relatability and awareness.
Women using hormonal health apps find it difficult to customize the app’s experience based on their unique needs.
Mothers need a way to educate their teen daughters on healthy hormonal health management practices.

Surveys

Details:

21 Male respondents and 19 Female respondents
Age group: 15-65
Survey duration: 15 minutes

Key Insights (Male Respondents):

94% of men believe there is only moderate to low awareness among men in general regarding women’s hormonal health issues.
84% of men believe their loved ones find it challenging to communicate hormonal health issues effectively
78% of men believe women need emotional empathy more than other forms of hormonal health support.

Key Insights (Female Respondents):

70% women are looking for better ways to track their hormonal health.

85% women face pre menstrual symptoms including erratic moods, food cravings and physical discomfort.
75% women want to be able to include their partner in their hormonal health management.

Competitor Analysis

3 competitors analysed:

Flo (100M+ downloads, 3.25M reviews)
The Period tracker (100M+ downloads, 4.47M reviews)
Clue(10M+ downloads, 1.23M reviews)

4 Personal Interviews

19 female and 21 male Survey Responses

3 Competitors Examined

Partners/Caregivers POV

Women's POV

Partners/Caregivers POV

Women' POV

CASE STUDY

Define

Synthesizing the research

to generating actionable insights

Affinity Map

I segregated women's and partner's pov into two different groups (peach for women and grey for partners/caregivers).
It was surprising to see the contrasting perspectives of the two groups especially men and women regarding the impact of hormonal health.

Example:

Woman#1: “Emotional support is something that I crave when I’m on my period, I feel like I can cry about the silliest thing. My partner feels confused”

Man#1:“I so want to be able to help her cope with the mood swings but I don't know how”

Empathy Map

I created an empathy map to organize findings from affinity map into a thought/feelings chart.

My primary focus was on delving into the profound emotional and behavioral triggers, recognizing the heightened emotional sensitivity surrounding hormonal health.

Persona

Having conducted insightful interviews with women navigating hormonal health challenges and partners seeking a deeper understanding of these issues, I successfully crafted three personas. Click on the image to explore all three:

#1 Ararav Singh- A supportive empathetic fiance.

#2 Rajal patel- A young high performing scholar

#3 Ellie Jones- A tech enthusiast working mother of 4 girls

Customer Journey Map

I crafted detailed customer journey maps for Arav Singh, Rajal Patel, and Ellie Jones.

For instance, Arav's journey here involves a moment of curiosity and empathy when he notices his fiancée using a period tracker app. This sparks his interest, prompting him to explore the app himself to comprehend how such tools operate and how they can contribute to supporting his partner.

Develop

Building, Testing and Delivering the Final Solution

How Might We?

In the process of generating How Might We (HMW) questions, I identified a set of 8+ inquiries. However, I observed that many of these questions can effectively address two central HMW objectives, encapsulating a broad spectrum of open-ended inquiries.

Crazy 8s

I led a brainstorming session with a few designers and developers in my personal network and was able to come up with some really cool ideas.

I narrowed the quick wins into two groups each addressing the respective How Might We inquiry.

MVP Matrix

Key ideas from crazy 8s ideas proceeded to go onto a prioritization matrix. I used importance vs satisfaction matrix to prioritize essential features that can be shipped as MVP. By evaluating the satisfaction level of users against the importance of corresponding concept, I was able to tag ideas as:

Hygience factors- Must-haves, the absence of which will lead to user drop-off

Motivators: Value adds, the presence of which will aid user-conversation.

Story Board

I created a story board to illustrate one of the key ideas stemmking from How Might We 2.

In this scenario, Gabby experiences PMS symptoms and expects understanding from Ray, who is initially confused. Ray discovers a hormonal health management app tailored for partner support. As Gabby records her moods, Ray receives alerts and educational content, fostering a deeper understanding of her cycle phases and enhancing their communication.

Low fidelity Wireframes

I designed low-fi wireframes for concepts prioritized for MVP.

Home Page: With a cycle phase dial and cycle summary

Community Page: Discussions regarding topic of interest.

Logs Page: Predefined symptom logs

Calendar Page: View and update cycle calendar

How Might We design an easy and simple experience for the users to log and review period and associated symptoms?

How Might We strengthen support systems for users to feel empowered and empathized with during their hormonal health challenges?

Deliver

Building, Testing and Delivering the Final Solution

Branding

I decided to go with a primary color that is soft and calming to promote a sense of tranquility and empathy

Neutral secondary colors to avoid gendered perspective to the interface

Bold and sharp accent color to add sense of importance

Site Map

In this site map, I organized key pages and features to follow an intuitive hierarchy. I aimed to maintain a clear navigational flow and connectivity between each section.

Mockup Iterations

I conducted ongoing usability testing throughout the design process, leveraging valuable user feedback to refine and enhance the user experience.

A pivotal moment came when the initial version's usability test revealed shortcomings. I started a complete UI overhaul resulting in a more intuitive and well-received final product in subsequent usability tests.

Hi-Fi prototype

As the main screens reached optimal design, I extended the design to complete the core user flows.

Click here to checkout the working prototype.

Before

After

Key Learnings

Confirmation bias is real and goes deep:

As Winx was a personal project, I knew I would carry quite a few personal assumptions about how people approach conversations about hormonal health. To investigate this psychology more deeply, I drafted a few initial hypotheses that I strongly believed were real. The goal was to test the hypotheses and uncover the truth values. From my research, I was confronted with the stark reality that my preconceived notions were not only challenged but, in some cases, entirely contradicted.
For Instance:

I hypothesized that men are inherently reluctant to communicate about hormonal health issues, while women actively seek their involvement. Contrary to this belief, men displayed genuine interest in understanding and supporting women in their hormonal health journey. On the other hand, women, perceiving a lack of interest from men, were hesitant to initiate conversations.

This made me understand the importance of allowing the research to reveal nuanced and sometimes unexpected truths to a more comprehensive and accurate understanding of the problem space.