Date
30 days
Role
Visual + UX Designer
Type
Responsive Web App
Software Used
Figma
Date
3 mos
Role
Visual + UX Designer
Type
Mobile App
Software Used
Figma
Date
30 days
Role
Visual + UX Designer
Type
Responsive Web App
Software Used
Figma
Project Overview
Background
For my last project for the Google UX Certificate Program I was assigned to create a responsive web app for social good. This project would involve me creating both an app, and a complimentary website.
The Product
I created RemindMe. RemindMe is a fabricated nonprofit organization committed to aiding people of all ages stay organized during their patient journeys. RemindMe’s medication reminder app and responsive website that can offer users a simple and easy-to-understand way to schedule and track their medication subscriptions day-to-day.
Research & Empathizing
Foundational Research
According to my research, there are several factors that contribute to 50% of people in the US not taking their medication properly – yes, 50%. Among them were: fear of side effects, forgetfulness and a simple spirit of rebellion. With this information, I wanted to hone in on what might be the 1 or 2 main reasons I can address in my design.
Interviews
I came up with 9 interview questions to conduct user interviews. I reached out to friends, family and peers to collect a cohort of 5 people, ranging from ages 20–69, that I knew took prescribed medication.
Questions asked:
- What do you do for a living?
- What do you use to remind yourself to take your medicine?
- How many medication reminders do you miss on average every week?
- What is the #1 reason why you think you forget to take your medicine?
- Do you have any medical issues that would increase the probability of you forgetting your medicine?
- Would you consider yourself busy person?
- Do your friends and family know you take prescriptive medication?
- What are you typically doing when you forget to take your medication?
- What are you typically doing when you remember to take your medication?
User Personas
I created 2 user personas that were informed by the identities, demographics and interview answers of my interviewees. Meet Chidera and Sage. Chidera typically used a calendar or planner to remember to take her medication while Sage typically used her phone’s reminder or alarm function.
(click to enlarge)
User Journey Maps
(click to enlarge)
After creating my user personas and getting a better sense of who I was designing for, I decided to create journey maps for each persona. I love using journey maps because they really allow me to empathize with my users’ emotions – which guide their decisions – and assign solutions that directly respond to them.
Note: At this point in my research, I knew my design would not be able to respond to the shame some might feel with taking prescribed medication. However, I made it a note to make their experience as easy and non-disruptive to their life as possible.
User Pain Points
Here are the user pain points that stood out to me during the interviews
(click to enlarge)
Competitive Audit
I decided to conduct a competitive audit to identify the weakness, strengths, gaps and opportunities in the medication reminder market. Each app I studied had their own fair share of strengths that I knew I would be able to reiterate and possibly incorporate into my design.
I audited: (1) Medisafe, (2) Round Health, (3) MyTherapy and (4) Lady Pill Reminder.
Between the 4 competitors, there was virtually every feature a user could ask for. Medisafe was the strongest app. It had a clear and simple calendar display and extensive features that made it stand out from the other apps I audited. Nevertheless, it appeared to me that Medisafe’s target audience were users that already had a desire, energy and drive to remain super organized about their prescribed medication.
(click to enlarge)
What MY Users Need
As I learned from my interviews, my users were not happy they were taking medication in the first place. These were not users that were enthusiastic enough to utilize all of the features Medisafe had to offer, like their “Updates” tab that tells their users the latest news in the medicine world. My users needed something designed for their emotions, that they only had to think about when they take their medications for 30 seconds out of their busy days.
Defining the Goal
Problem Statement
The problem at hand became clear…
Chidera and Sage are hardworking, passionate people that need a simple, easy-to-use app that allows them to schedule and remember to take their medication because they want to remain healthy people.
The Goal
I had 2 goals, one for the mobile app and one for the responsive website to accompany it.
App Goal: Create an easy-to-use mobile app, with a simple interface and UX that allows users to schedule, remember and track their intake of their prescribed medication.
Site Goal: Create a website to compliment the RemindMe app that communicated the nonprofits mission, solicited donations and allowed users to export their tracking reports.
Prototyping
Information Architecture
(click to enlarge)
I mapped out the information architecture and chose to use a hierarchical structure to organize the information. I planned for the app to begin on the schedule page, and have 3 other main pages: reporting, the medicine list and settings.
Paper wireframes
(click to enlarge)
I started to ideate design solutions with a Crazy Eights exercise. I decided to take the progressive enhancement approach, so I started with building out my mobile app.
Digital wireframes & Lofi Prototypes
I built out digital wireframes and developed a low-fidelity prototype to use for a usability study. My prototype was composed of 3 complimentary user flows that would allow the user to add a new medicine to their schedule, edit a new medicine, and delete a medicine. Here were my 2 guiding principles:
(click to enlarge)
Usability Study
Usability Study
After creating my low-fidelity prototype, I conducted a usability study with the goal to find out if my app was easy and intuitive for my users. I wanted to answer the following questions:
- Does the app deliver to the user an intuitive user flow and overall experience while scheduling medication?
- Are there parts of the user flow where users get stuck?
- Are there any features we can add to the app to enhance the user experience
Findings
Here are the insights I gathered.
Note: Participants made several statements about there not being icons on the footer navigation menu for my lo-fi prototype. I wouldn’t consider it a major insight of the study since I always had plans to update the design with recognizable iconography for my high fidelity prototype. Nevertheless, it was my mistake to not incorporate some sort of iconography for the sake of the study.
Refining the Design
My Reiteration
My next move was to develop my high-fidelity prototypes while reiterating my designs to respond to the insights from my usability study.
(click to enlarge)
Inspiration
I’ve been insured by Kaiser Permanente my whole life. My dad worked there for 30 years, busting his butt to provide for our family. Anytime I think of anything medical I think Kaiser blue and white branding.
Visual Design Elements
Next came my time to reiterate my designs based on my insights from the usability study and create mockups and a high-fidelity prototype.
(click to enlarge)
High-Fidelity Prototype
Here is the mobile app’s main user flow: scheduling medicine. Check out the prototype!
(click to enlarge)
Mobile App Mockups
(click to enlarge)
Desktop Site Mockups & Prototype
Here are the mockups for the app’s complimentary website that allowed users to export their tracking reports and learn more about the nonprofit. I created high-fidelity prototypes for the mobile phones, tablets and desktops. The prototype has 2 main user flows: (1) export tracking report, and (2) submit a donation.
(click to enlarge)
Mobile Site Mockups & Prototype
(click to enlarge)
Tablet Site Mockups & Prototype
(click to enlarge)
Accessiblity
Takeaways & Next Steps
What I learned
I had the most fun doing this project, and I learned a ton!
Moving forward, I might be able to garner better insights from my usability study participants by incorporating iconography. It’s possible its absence distracted my participants from offering other insights.
Not every user's emotion can be responded to. Design can only do so much when it comes to taking away the shame people might feel about their need for prescribed medication.
Competitive audits are so important. My competitive audit not only gave me the foundational inspiration for my designs, but it also understood what my users DID NOT need.
Next Steps
The next steps in this project would be to build out a few more features that can simplify the user experience:
- A feature that allows doctors to add prescriptions directly to the user’s account on the app to circumvent users having to setup their reminders themselves.
- Add a scanning feature that will allow users to upload medication and dosage information via scanning the barcode on their vials.