Blu, helping women with infertility — a UX case study
How incremental design and research can inspire, educate and connect women struggling with infertility.
Funny enough, I grew up in the world of fertility. My father and uncle are both specialists in the field, and I spent my childhood running around doctors offices, going to conferences, and moving pictures of women’s embroyos from the passenger seat of my Dad’s car in order to sit down. When asked in kindergarten what my Dad did for a living, unable to fully comprehend how to say fertility, I just said he got women pregnant (my parents got a call from the school).
It’s a space I’m familiar with. I understand not only the lingo, but the importance of the sensitivity around the subject. So when I was assigned my latest client, BluDiagnostics, I was really excited to work in the family field.
Even in 2018, women’s fertility is an incredibly sensitive topic. Women are expected to get pregnant, to have children, and when unable to do so, are lead to believe something is wrong with them.
Treatments are incredibly expensive and invasive, and don’t always lead to pregnancies. BluDiagnostics is creating breakthrough technology to solve the timeless problem of infertility tracking by providing women and couples with an easy way to monitor key clinical indicators of female fertility.
BluDiagnostics has created a product that analyzes a users spit sample, and provides estradiol and progesterone levels on a daily basis. These are the two major hormones that show a woman’s fertility levels. While this product doesn’t solve infertility, it does give users a better understanding of their fertility, and what to do next.
The Challenge
BluDiagnostics needs a mobile app to work with the product. As well as a way for users to log their daily information, it would also need to show trends in their levels. The client also requested a community forum for users to be able to discuss their concerns, goals and accomplishments with women going through a similar situation.
The Plan
I was assigned two team members to handle this project, and was designated as the Project Manager. As such, my role was to handle communications with our client, manage our schedule to ensure that our product was finished on time, and allocated tasks to the other team members. We had 2 weeks to provide our client with a high fidelity, clickable prototype. I broke down what we needed to get done into two phases: Research & Design.
Research
We needed to better understand the space, the users, our client and the competitors before getting into any design.
- Competitive Analysis
We considered competitors not only fertility apps, such as Kindra and Glow, but other apps that connected to a medical product, such as 23&Me. There is a wide array of available resources and apps out there for users. Even among fertility tracking apps, there is a lot of diversity in the content and use.
There were two apps that we focused a lot of attention on: Ava and Kindara. They are the most similar to the app that we are creating in that both have physical medical devices that connect to the app.
Doing a competitive analysis gave us a lot of insight. We knew what was out there in the space, what users were used to seeing, what designs were industry standard, and what products are provided. From this, we can determine what we want to include, and what we don’t, in our final product, and how it will stand out in the market.
2. Market Research
My team members and I found it very important to understand the space of infertility as well. What is it that effects women’s fertility? What are the different cycles that a woman goes through? How can fertility be tested? What is the process like for someone going through infertility treatments?
Having the answers to these questions gave us an idea of what our users go through, and what is required on the app in order to give our users the best information.
3. Expert Interviews
A large goal of this product is to give users the chance to share their information and data with medical professionals. As such, I wanted to hear from specialists in the field about their experiences interacting with clients, what they think of these devices and apps, and what their concerns are.
From these conversations, we gathered some key takeaways:
- There is a lot of false information out there about fertility
- Experts distrust a lot of apps because they “don’t speak to the individual”
- Clients are recommended to visit a medical professional about fertility issues once every 6 months
- Seeing a medical fertility professional depends on availability and affordability
- Professionals find graphs most useful when explaining medical information
- Support groups are especially helpful for people struggling with infertility
4. Stakeholder Interviews
We conducted an hour long interview with our client to gather a better understanding of their product and their expectations of the app. We needed to know
Who is the target user?
How does the user interact with the product?
What are your business goals?
And much, much, much more
5. User Interviews & Research
Through our research, we found that this is a huge issue among women, and we wanted to get in touch with some women struggling with infertility to get a sense of what they find important when interacting with an app.
We sent out a screener survey on different social media sites, slack channels, reddit forums, etc. Through that, we reached out to approximately 20 women, and eventually conducted 3 user interviews. We focused on 3 topics when interviewing our users: What do they use, what are their pain points when going through infertility treatments/apps, and are they involved in community groups/forums.
We also took a look at the numerous forums, community pages, and Reddit forums that women facing infertility issues visit to see what their concerns are, what they are using, and what they talk about.
6. Whiteboard Exercise
To get from our research findings to establishing key features and user flows, I created an exercise. On a whiteboard, with my team members, we wrote lists: who are our competitors, what do users like about the competitors, what do they dislike about the competitors, what are our clients main concerns, what are our users main concerns, and what are experts main concerns.
Keeping all of this information in mind, we started planning out the key features and layout of the app. As we went along, we made sure that our ideas and design addressed all of the concerns laid out, and included everything that our users liked.
7. Key Features & User Flows
The whiteboard exercise helped us narrow down our app into 4 main sections: Dashboard, Community, Education & Account.
Dashboard: Available only to users who have purchased the product, where users log in their daily information, and where a user goes to find data and trends about their cycle/levels.
Community: Made up of groups created and managed by the bluDiagnostics team, where users can go to discuss issues and ask questions.
Education: Information provided and approved by the bluDiagnostics team.
Account: Users can edit their information, purchase the product, and get support.
From there, we went through some user flows to ensure that the features are all manageable and easy to navigate.
8. Stakeholder Interview & Iterations
On the last day of our research week, we reconnect with our client and gave them a rundown of what we have done so far. They had a few tips they wanted to include, such as show which part of the cycle the user is in on a graph, but otherwise were excited and ready to go.
Design
You still with me? Good! I know research was a lot, but it goes to show how important it is to me to understand the market, the client and the users. After all, without all that work, the design part is really just a shot in the dark.
Speaking of design, let’s get to it. (We’re almost done, I promise)
- Wireframing & Sketching
As project manager, I thought it best to split up the screens between a single team member and I, and the third member focus on visual design. 3 minds inevitably will create different looking screens, so it was imperative that one person was in charge of the final look of the product.
Breaking it down by feature, there were some elements I wanted to make sure were included.
- A lot of information would need to be entered on a regular basis, and through research, we found that dials were the quickest and most user friendly.
- We wanted to stay on brand, and so used blue as our main color, as well as a lot of circles, similar to the company’s logo.
- The community section should feel similar to a social media site’s newsfeed, and the option to write a new post is similar to Twitter’s format.
- The menu to go to different features of the app should be at the bottom, as it is most easily navigable for users on a mobile device.
2. Low Fidelity Prototype
We used Sketch for our product, and started building out the pages. Once my team member and I were done with a section, we sent it to our visual designer to review and make adjustments.
As you can see, we focus our style on blue and off blue colors, and tried to avoid harsher angles by rounding our shapes.
3. User Testing & Iterations
Unfortunately, we were unable to conduct user testing with our core users, but we did test a few cohorts of ours. Some of our key takeaways were concerning the design of the interface, and the length of the information provided.
4. High Fidelity Prototypes
Unfortunately, this part really fell to our Visual Designer, who knocked it out of the park. In support, my other team member and I gathered content, photos, etc. to fill in the pieces.
5. Animation
With my background in digital media, I felt really comfortable (and excited) about being able to animate the app. I used Principle, and went through each page and transition. I wanted the animations to feel light and playful to the users.
Bonus: Branding!
When we first talked to our client, we discussed the name of the app, and what they thought it should be. They were unsure, and left it to us to come up with a name. Considering how much we had to tackle in such a short amount of time, we didn’t make it a priority.
The more we worked on the project, and saw of the space around us, without even specifically planning on it, we settle on Blu. Why, you ask (as did our clients)? Blu is playful without being flippant, easy without being casual, and can be seen as a simple nickname of the medical device product. They are together, but still separate entities.
Final Prototype
Research and design has lead to our final clickable prototype, created in Principle (my hate and frustration eventually turned into a deep passion and admiration for this software).
Takeaways
So what did I learn from this 2 week, mad rush? A lot of things. New skills, new information, a newfound love (hit me up Principle). But something that stands out the most was empathy.
As a UX designer, I’m taught that empathy is the most important part of our trade. However, when you are down in the trenches, trying to get screens and wireframes and interviews done on a tight schedule, empathy can frequently be overlooked.
With such a sensitive topic, I found empathy refused to be missed.
One of my user interviews was with a woman who has been trying to get pregnant for close to a year. She recently suffered a miscarriage, and found it frustrating that she couldn’t enter that information into any of the apps that she uses.
When she said she had a miscarriage, I didn’t know what to say. Do I empathize as another human being, sorry that she had to lose something so precious? Or carry on with the interview?
I choose the second option. She moved on to discuss her frustration about the apps, and I didn’t feel I should delve deeper into such a personal subject. But throughout this project, I often thought of her.
I wanted to do right by these women who are struggling, not just with infertility, but with the stigma of it. I created this for them.
If you enjoyed this case study, and I really hope you did, I encourage you to check out my work at ksurrey.com, and connect with me on LinkedIn.
