hormony

hormony is a responsive web application focusing on monitoring and tracking female hormone health. The focus is to educate users via vetted articles and open discussion about how to understand and live in harmony with their hormones.

tools

Figma
Adobe Illustrator / Photoshop
Optimal Sort
Usability Hub
Notion

MY ROLE

User Research
Information Architecture
Prototyping
UX Design
UI Design

Timeline

UX Bootcamp
10 Month Solo Project
2022-2023

challenge

How can we create a tool that allows people who menstruate to feel more in control of and connected to their personal hormonal health?

Context

“Female patients and people of color are more likely to have their symptoms dismissed by medical providers,” reads a recent New York Times article. Unfortunately, I was once one of these patients, which prompted my research for this student project to understand the status quo of female health.

Solution

Research

According to white papers and articles regarding the current FemTech market:

  • An estimated 75% of people with periods do not understand their hormones
  • 80% of women suffer from hormonal imbalances
  • More than half of women believe depression is a “normal part of aging”

A competitor SWOT analysis allowed me to identify potential opportunities that seem to be under-utilized by competitors such as:

  • Entering the LGBTQ+ space
  • Clarify that information and articles are fact-driven and vetted
  • Adding a community feature such as a chat features

User Interviews

LINK TO AFFINITY MAP

I first conducted quantitative research to collect general data regarding user needs. I conducted 2 separate anonymous surveys with a total of 45 unique responders.

Following this, I continued with qualitative research in order to understand the motivations and needs of my user. I conducted 5 user interviews of women between the age of 34-44.

survey results

As the potential users displayed a varying spectrum of personality traits, I defined the following important user characterizations:

Refining the Problem Statement

Now that I understood users’ motivations and needs and have a base understanding of the market, I was able to solidify my problem statement in order to begin developing hormony:

Our users need a way to approach, understand and directly address the symptoms of female-hormonal shifts because by understanding the causes and effects of hormonal health—physically, mentally and emotionally—the user can help themselves to reduce hormonal disruption to lead a more balanced life.This will be achieved with vetted educational and newspaper articles, a robust community forum, and flexible personal tracking and note-taking abilities.

Synthesizing Research

In order to validate navigation principles, user scenarios and task flows were explored to visualize how users would interact with the web app. These flows enabled me to focus on the Minimal Viable Product scenario and happy path in order to develop important functionality and troubleshoot ideas.

Synthesizing findings from user interviews, surveys and the competitor analyses, it became clear that the following key takeaways would define the functionality of the web application.

To synthesis real-life scenarios where users would need access to hormony, I developed various user journeys in order to better understand how and when this app could fit into users’ lives.

Defining Structure & Features

develop & organize

After many iterations defining the website’s main functionality and two rounds of closed card sorting, the site map started to come together in a way that was both intuitive and in-depth.

It was important that there would be available content in the not-logged-in state, but since the focus is to input and track health information, ultimately the bulk of the website exists once the user creates an account thereby enabling bookmarks, saving and recall. Data privacy was also considered in order to build the site in a way that would reduce discomfort, hacking and leaks.

Wireframing & Prototyping

Beginning with low-fidelity wireframe sketches, I started to conceptualize the functionality of the website starting in a mobile scenario. Working mobile-first allowed me to set size minimums early and see how the website would look in the highest case-usage possibility.

Testing

A first round of usability testing helped test if navigational paths made sense and was intuitive. This process allowed me to check NNG’s Usability Heuristics and easily identify pain points that needed immediate attention. Using Affinity and Rainbow mapping, I was able to identify critical errors using Jakob Nielsen’s severity rating to correct in the high-fidelity prototype.

Reiterating

After revisions, which focused on accessibility, green design practices and Material Design / iOS design recommendations, I asked colleagues to peer review the web app before preparing the MVP for beta launch.

I’ve highlighted the progress, learnings and changes for two features:

  1. The evolution of tracking/the health log
  2. The introductory welcome screen

High Fidelity Design

From usability test results, and continual reiterations, I implemented suggested and researched changes across the entire prototype in order to prepare hormony for beta-launch. The goal was to continually finesse the website until it felt like a minimum viable product.

Visual Design Development

Relying on multiple methods of design theory and development—Gestalt visual design principals, Material Design 3 & User feedback—I developed the visual design for hormony. The User Interface (UI) Design is intuitive and based off iOS and Android design standards and guidelines.

I created a Brand Guideline to define all the visual elements together. In order to create the brand, it was important to first define the voice, tone and visuals. Non-gendered colors and imagery were chosen in order to create a neutral and approachable aesthetic. The tone is empowering, smart, succinct and educated.

No items found.

Learnings

This concept fills a real need in the hormonal health tracking market and I intend to speak with developers and specialists to talk about the viability of building out hormony.

I’m also considering additional features. In the original iteration of hormony, one of the key functionalities was an expert advice feature to allow users access to a hormonal health specialist. As this would require more research, vetting, and policy knowledge, and user’s were unenthusiastic about virtual appointments with specialists, this feature was removed. But, as mobile healthcare continues due to the ongoing pandemic and the need for specialists—who may be in different parts of the country (or world)—continues to grow, expert advice/assistance could be reconsidered during an upcoming phase or iteration.

Ideally, hormony would remain in a beta phase for 6 months to 1 year while I continue to test metrics and run user testing. This beta phase would be important to allow adjustments to increase accessibility, streamline processes, add content and make sure to listen to my users’ feedback constantly.