Your address will show here +12 34 56 78
Migraine Assistant App

UX/ UI Design

Meet Migraine Assistant App

Migraine is an extraordinarily prevalent neurological disease, affecting 39 million men, women and children in the U.S. and 1 billion worldwide. 


Although we don’t have an exact answer yet, a number of potential triggers have been identified. There is no cure to migraine. 


In this project, I tried to find out a way to help migraine sufferer to prevent or reduce the frequency, duration, and pain intensity of their migraine attacks

-1-

Empathize
The Challenge

Migraine is the third most prevalent illness in the world affecting 1 billion people worldwide. However, this demographic of migraine sufferers is heavily underserved by mobile health applications, with only 0.2% of migraine sufferers using a migraine app. But why? A major opportunity exists for an application with the right strategy, and the right balance of features and functionalities to lead the market, while having a positive impact on the health of migraine sufferers.



  • To understand how people with migraine currently manage or monitor it.

  • To identify factors that trigger people’s migraine.

  • Understanding the latest innovations in migraine apps to learn about features and possibilities.

Uncovering Insights & Identifying Needs

After conducting the user interviews, I created an empathy map to synthesize the information gathered and distill the responses and gain a deeper understanding of each user’s distinct experience with migraine.

Using my user interviews in total, I plotted them to the four quadrants of the empathy map: say and do, think and feel, hear, see. Each color on the map represents a user. From there, I grouped the responses to common themes. I looked for patterns, themes, similarities, and contrasts. Doing so helped me uncover insights from my observations and move towards identifying implicit user needs.

Meet Lydia

From the mapping, I was able to get a clearer idea of what the persona’s various characteristics. Lydia represents the goals and behavior patterns that I witnessed from the user interviews.

Research

Most people monitor their migraines by using a paper migraine tracker or try to memorize.
Migraine Tracker Benefits
  • Track the intensity and duration of the pain associated with each a migraine and anticipate the symptoms related to the next onset
  • Learn how to prevent or reduce the severity of migraines by identifying triggers and taking medications
  • Record symptoms related to migraines
  • Develop a Migraine chart that provides a monthly overview of symptoms, triggers, and treatments
  • Text Hover
Competitive Analysis

The main promise of migraine apps is to provide migraine sufferers with a way to better manage their condition, decreasing the chances of migraine attacks, of headaches intensifying into migraines, and of the condition becoming chronic.

To begin this project, I spent a few hours getting up to speed on migraine apps and trends within the headache health space. I also researched wearable devices and apps with wearable sensor integration. I learned that there are a few migraine apps on the market. The apps cover a broad variety of approaches and specializations. To help identify the market segment that most directly aligns with Migraine Assistant’s positioning, I conducted a competitive analysis. This gave me the opportunity to look for ways Migraine Assistant might differentiate itself and provide unique value to users.

 

Research and Interviews' Summary

My findings led me to conclude that in the hopes of helping to prevent future migraines, keeping track of potential triggers and pre-headache symptoms is recommended. As each individual person might experience a different set, any migraine sufferer can track their any triggers and possible patterns in their migraines in a migraine diary.

-2-

Define
Defining the Design Problem

Taking the insights and needs from my empathy map and persona, I translated them into POV (Point of View) statements and then HMW (How Might We) questions. Reframing the insights and needs I identified in my research allowed me to turn them into clearer invitations and challenges for design. 

Project Goals

After conducting research, it’s time to define the challenge and examine solutions. I started by deriving business goals from the Migraine App brief. After this, I used Lydia – the persona – to define user goals. The common goals between business and user goals became the foundation of the first iteration. 

Solution

Keeping in mind the benefits for knowing what triggers your migraine is the first step to reducing the frequency of your migraine attacks. 


Migraine Assistant would like to help users record and identify triggers of migraine, migraine symptoms, migraine medication, migraine frequency and duration, pain intensity and location, and other lifestyle factors so users can improve their migraine condition.

Information Architecture

 

App Map

Informed by the features and priorities outlined in my product roadmap, I created an app map showing the content architecture proposed for Migraine Assistant.  

User Flow

Following the app map, I created a user journey for logging into the app or signing up as a new user. This diagram illustrates the steps involved in completing each task. With the user flow, I was able to address the users’ needs before I began the visual design process to ensure that I was able to create a good and functional product.

UI Requirements

Referencing the screens I’d mapped out in my user task flows, I considered high level and detailed requirements that the app and each page would need and outlined them in a UI Requirements document. This served as an outline of sorts for me as I designed the key screens for the user flows.

-3-

Ideate
Brainstorming

Brainstorming

Brainstorming

  • Text Hover
  • Text Hover
  • Text Hover
  • Text Hover
Wireframe

For my wireframe, I focused on on 2 aspects of a migraine.

– First having an option to record your migraine. In my interviews, most people said they do not know their triggers. They thought their symptoms are not the same every time.   

– Second users have access to the Assistant page who can help migraine sufferers to find Doctors, answer questions about migraine and other helpful information to reduce pain intensity.

 After completing the low fidelity frames, I then brought my mid these screen to InVision and built a mid-fidelity prototype to share with users. Testing the app’s design at this stage, before any visual design had been added, allowed me to get feedback from test subjects that was focused around the concept, organization, flow, and interactions of the app… 

  • Text Hover
  • Text Hover
  • Text Hover
  • Text Hover
Branding and UI Kit

From this UI kit, it unifies the vision with all elements involved that creates the brand identity. The color palette here with more saturation is to create a darker theme to be more comfortable to interact for migraine sufferers who have light sensitivity. It gives a more soothing feeling. I keep mindful in choosing colors so that they don’t disturb nor distract users. The selection sections takes a main presence in the app which makes it easy to be in track on different options, while give the users enough information if needed without feeling confused.

-4-

Prototype
Prototype

Going back to my wireframe, I applied the colors, styles and icon illustrations outlined in my style tile to create a higher fidelity version. I integrated distinct graphic icons throughout the app to provide strong visual cues and opportunities to understand content without needing to closely read text. I brought these wireframes into InVision once again, to create a prototype that offers another opportunity for user testing before going further with the site design and implementation. 

-5-

Test
Usability Test

I developed a usability testing plan and defined my test objective and goals. I created a script with 3 scenarios with tasks for test participants to attempt to complete. The test focused on 4 tasks:


  •  Navigate through the onboarding to set up an account.

  • Record an attack

  • Navigate to the home screen and then back to the “See the previous records”.

  • Go to summary page of previous records and edit or complete them.


TAKEAWAYS

One participant made more errors than the others. I found it especially valuable to see how he interacted with the app: quickly skimming and tapping through pages– he seemed rushed and stressed. This emphasized to me the importance of making sure visual hierarchy and cues are employed to minimize user errors and frustration, especially since this individual may represent a state users could likely be in when interacting with the app.

However overall, the general consensus was that Migraine Assistant App was simple, straightforward, and easy to understand. Participants felt that it fit within a genre of apps familiar to them, and they were able to navigate and understand hierarchy of the app overall. 

Insights + Recommendations 

To synthesize my findings, I created an affinity map. I took the observations and results from my user testing sessions and created sticky notes for each observation and data point. I then sorted them as patterns, successes, problems, or observations. From there, I translated that content into insights and finally made a list of prioritized recommendations for the next iteration, outlining actionable next steps.

High Fidelity Prototype

After usability test, I applied the recommended changes as outlined in my high fidelity prototype. I decreased the pain severity options to help users select from them easier. I also revised how selected items display related to the “Select Your Options” pages to visually make it simpler.

In general, I tried to design a user friendly app to help users record and identify triggers of migraine, migraine symptoms, migraine medication, migraine frequency and duration, pain intensity and location, medications for migraine, and other lifestyle factors so users can improve their migraine condition.

To better integrate and emphasize Migraine Assistant’s ability to offer help users know what triggers their migraine because this is the first step to reducing the frequency of migraine attacks. 

I brought these wireframes into InVision once again, to create a prototype that offers another opportunity for user testing before going further with the wearable design and implementation. 

  • Text Hover
-6-

Next Step

With more time, I would like to further develop the emphasis on Migraine Assistant’s wearable technology that allows users to track their vitals and other signs (like tracking quality of sleep) that could contribute to migraine at anytime.

To make this assistant interactive to get info about options which users do not know is another phase of designing this app.

My user testing revealed that at least a portion of users find this aspect of the product particularly valuable and interesting. Developing those aspects of the app further would provide focus and help create a more defined point of distinction for the app.

SEE MY OTHER CASE STUDIES

 

PAN AM

PAN AM Redesign UI/UX Case Study

Chase

Chase Personal Finance Management

KAUS

KAUS Insurance UI/UX Case Study