Blume flower logo.

UX/UI Case Study: Blume.

Marina Avagyan

marinaavagyan05@gmail.com
 

Project Overview

Image of a group of women in pink shirts.

My project for an app, Blume, aims to, broadly, address women’s health. Because women’s health is sometimes neglected in less prosperous and underfunded areas, it would be helpful to create an application that educates women on their bodies throughout different phases in life whilst fostering online connections with other women to gain perspectives on common illnesses, conditions, etc.

In order to differentiate, the app will focus on additionally suggesting possible treatment options for women, with natural/milder alternatives. Because the app cannot directly prescribe anything, the treatments will only be suggestions of options based on research. Due to most healthcare professionals rarely discussing side effects of such treatments, the app will also include health risks that come with each option whilst offering alternatives.

As expected, the target audience consists of women. These women fall within a reasonable age range, encompassing individuals over the age of 18 due to specific topics discussed on the app. Socioeconomic class is not an issue, as the features on the app should be accessible to a range of class backgrounds.

Project Research

My research for this project began with finding issues pertaining to equity in society. I searched through various topics, ranging from Men's Mental Health to College Readiness, outlining disaprities in each category. Creating a mindmap (see below) helped me organize several disparities, eventually coming up with an idea for each category. For women's health, my researched takeaways led me to broadly brainstorm an app idea that allows women to track health related concerns, including appointments and reminders.

As stated previously, the app is intended to focus on helping women gain knowledge on health concerns, treatment options, as well as treatment risks and alternatives. This is based on a few, key research points. For one, women are often underdiagnosed and undertreated for various health concerns (a common example being heart disease). This is due to the fact that heart disease has historically been studied in men. Moreover, other diseases such as endometriosis and PCOS are commonly under-researched and under-treated. The app I intend to design will be focused on addressing such issues where health is often neglected.

My research also consisted of Competitive Analysis, in which I looked for similar apps that delievered the same product to consumers. To no surprise, there were plenty of applications made for women. These include Clue, Flo, Maven Clinic, Peanut, etc. What most of these apps offer is simple services, such as health tracking and appointments with online medical practitioners. In order to differentiate, I created a small niche which dealt with treatment plans with natural alternatives. Knowing there are many women who struggle with finding natural, temporary remedies for their illnesses, it felt right to specialize in offering treatment options,

MindMap1 MindMap2 Examples of apps for women

App Design

Health App Design System Example Pink Color Palette Task Flow

Knowing I was working with a health app for women above the age of 18, my main objective was concerned with delivering a simple, familiar, user-friendly interface for those who may or may not be familiar with newer applications. In order to achieve this, I began with researching design systems and patterns used in health related apps. This built the later framework for my prototypes. Beyond internet searches, I took inspiration from apps I own myself, one being Instagram. The Log In/Registration process for Instagram is very simple and straightforward, making it a good reference point.

I also worked on deriving a feminine color palette that included a range of tints and shades. Using Adobe Color, I independently worked through different values, tones, and saturations of pink (a color associated with femininity) to create a contrasting yet cohesive blend for my app. I aimed to purposefully avoid pairing pink with other colors, such as greens, blues, and such, as I found this would create visual chaos. My app itself would offer features in which individuals can join conversations, forums, and even create posts of their own. These features, especially the ability to publish posts, would undoubtedly incorporate other colors which would feel xcessively childlike and almost "messy" had the base of the app been widely colorized.

To ensure some sort of path or outline for tasks on my app, I made a brief Task Flow diagram that would help me figure out how one of my tasks would appear. Though this task is not yet included in the high fidelity Figma prototype, it served as groundwork for understanding how functions would or should be carried out. Above is an image of my task flow. Starting from the top right rounded rectangle and working our way down in the directions of the arrows allows for an idea of how some tasks can potentially function.

Prototype Frame 1 Prototype Frame 18 Prototype Frame 43

Tasks For Users

Our app prototype features approximately four tasks that can be completed in the beginning stages of account creation. These actions range from Registry to Setting a Profile Photo. In a bit, we will explore more elaborate steps users can take within the app.

Some of these tasks include:

  1. Register an Account
  2. Log In
  3. Recover a Forgotten Username/Password
  4. Select a Profile Photo as a part of the Registry Process

Usability Testing & Further Development

In this final section, we will briefly discuss the usability testing that occured in order to enhance my prototypes and designs. My testing consisted of SWAT Analysis, personas, as well as real individuals who went through my prototypes and completed specific tasks. This yielded favorable results. Much of my feedback, some of which is listed in the section below, helped me clarify and simplify various aspects of my design. For example, initially, it was difficult for users to pinpoint what my app was about (a health app for women), which led me to incorporate wording and imagery that would convey a clearer message. To access a full UX Report on this case, click the following link!

SWOT Analysis Persona 1 Persona 2 Persona 3

If I could go back and have a bit more time, I would definitely work to include more tasks within the app itself, as opposed to the majority being registration forms and log in information. I would also incorporate one or two more colors in my framework, perhaps a muted olive green or a desaturated mustard yellow. I would, overall, work with increasing depth and dimensione to my content in any form whilst conducting broader research.

 Feedback throughout development: 

"Hi Marina, Your prototype follows the steps you've outlined. I like the color you chose for the background, as well as the font color and size. My only gripe is that the title (YOUR HEALTH COMPASS) doesn't have spaces between the letters. I think it would be easier for users to read if the letters weren't so close together. Overall, you've done a good job." - Anonymous Classmate

"My first impression is the nice calming color scheme that feels very cohesive and feels appropriate for the demographic. I like the white space and how you used it, it makes things feel simplified. I am not sure what I am signing up for, although it is clear it is health-related. The Create Username screen is very clear and feels simple and easy to sign up. The next text in the pink colored button has low contrast with he background and is hard to see. The log in seems like a link, but it doesn’t give any feedback as to why it just makes the register button blink blue. I think this is a really good start though and like the feel of the design a lot." - Anonymous Classmate

"Hi Marina! After checking out your prototype, my first impressions are positive! I really love the design and everything looks very professional and well made! One element that I think can be improved is the 'log in' text is very small and could be hard for someone on a phone to click on. Especially if they are vision impaired. There's other places in the app that also use the same style of small text that can be clicked that could also be changed up a bit to be easier to click on. But overall the prototype is very well put together, and nothing else is popping out to me as a concern." - Anonymous Classmate

"Hi Marina! Your app is designed very cute while also looking professional. The colors look really nice together and I like your font choices. The login/registration process is very clear. I also appreciate the different gender options. Great job!" - Anonymous Classmate

Summary

This project was quite rewarding in a myriad of ways. From being a stepping stone between education and hands-on application, to providing ample practice with various UX/UI principles/research as well as prototyping tools, the case study serves as a successful ending to the semester.

The most informative part of this work was working with Figma and recieving feedback, in and outside of the classroom, to further build on my design and conduct research. Figma allowed me to create high fidelity prototypes, and feedback allowed me to bridge gaps in my designs that I would not have noticed otherwise.

I had the wonderful opportunity of not only working closely with several education aspects from this semester, but also researching potential equity fields in which there are disparities. Therefore, this project led me to build on important research and design skills.

Image of fists in the air.