– Case Study

PillReminder App and Reponsive Website

The product

PillReminder is a Portugal-based organization focused on healthy living. The organization needs a tool to help people manage when to take medicine. PillReminder’s main target users include adults who are concerned about taking their medicines correctly on time for a better quality of life.

Claudia Machado

The problem

In Portugal, the vast majority of the population is made up of elderly people. PillReminder’s strategy team identified the general lack of knowledge about the importance of taking medicine correctly and the influence it has on treatments.

The goal

Design an app and a responsive website that will improve education on the topic of life quality and help people manage their medicines.

Project duration

October to Dezember 2021

My role

UX designer for an app and responsive website for PillReminder from conception to delivery.

Responsibilities

Conducting interviews • Paper and digital wireframing • Low and high-fidelity prototyping • Conducting usability studies • Accounting for accessibility • Iterating on designs.

Design Process – Design Thinking

Empathize

Define

Ideate

Prototype

Test

01. User Research

I used data from various reports on how to take medicine correctly to develop interview questions, which were then used to conduct user interviews.

Most interview participants reported feeling stressed with the amount of medicine they take and do not know how to manage. The feedback received through the survey made it very clear that users would be open and willing to work to eliminate stress if they had access to an easy-to-use and intuitive tool.

Interview questions

  1. Is there some part of the process of entering the reminder to take medication on time what users are crashing on?
  2. Can users insert a reminder for medicine easily?
  3. How long does it take for a user to create a reminder to take the medicine?
  4. Are the medicine type options easy for the user to choose?
  5. What can we learn from the steps users took to set a medicine reminder?

Pain points

Acess: Pleople want easy access to add reminder of medicine.

Acessibility: App for reminder medicine dont use of color that make accessibility-friendly.

IA: buttons and icons that are not clearly labeled or easy to understand.

Personas

Amanda is a busy work who needs reminders to manage the pill because they want take pills on time without stress and worry.

Amanda persona
User flow - PillReminder

User jorney map

Mapping Amanda’s user journey revealed how helpful it would be for users to have access to a dedicated PillReminder app.

02. Starting the design

I used paper wireframes, digital wireframes and low-fidelity prototype to test design ideas and user flows. I also carried out a usability study to test the “inicial product experience”.

Paper wireframes

I did a quick ideation exercise to come up with ideas for how to address gaps identified in the competitive audit. My focus was specifically on create a simple reminders to take medicine on time features.

Paper wireframe PillReminder
Digital wireframe PillReminder

Digital wireframe

After ideating and drafting some paper wireframes, I created the initial designs for the PillReminder app. These designs focused on personalized reminder to users to help manage their medicine.

Low-fidelity prototype

To prepare for usability testing, I created a low-fidelity prototype that connected the user flow of insert a reminder.

User flow - PillReminder
Usability study PillReminder

Usability study

Findings from the usability study helped guide the designs from wireframes to mockups and  revealed what aspects of the mockups needed refining.

03. Refining the design

I create mockups and high-fidelity prototype to test design ideas and user flows. I also carried out a acessibillity to test and give users the “end product experience”.

Mockups

Based on the insights from the usability studies, I applied design changes like providing a clear section from the home screen to add Medicine after “Sign Up” that specifically use items available in “+”.

After usability study PillReminder
After usability study PillReminder2

I applied design changes like providing a clear section from the “New Medicine” screen to choose time that specifically use time available in “Choose date”.

Additional design changes included add an option to “Choose Color” to the “New Medicine” page, and providing a clearer indication of colors name.

After usability study PillReminder3
User flow high fidelity - PillReminder

High-fidelity prototype

The final high-fidelity prototype followed the same user flow as the low-fidelity prototype, including design changes made after the usability study.

Accessibility considerations

People deserve equal access to information, services and products, which is why accessibility is so important.

Accessibility PillReminder
PillReminder Final

Final output

04. Responsive webdesign

With the app designs completed, I started work on designing the responsive website. I used the PillReminder sitemap to guide the organizational structure of each screen’s design to ensure a cohesive and consistent experience across devices.

Sitemap

Sitemap
Responsive website

Final output

The designs for screen size variation included mobile, tablet, and desktop. I optimized the designs to fit specific user needs of each device and screen size.

05. Going forward

Impact

Users shared that the app made taking medicine at the right time easy.

A quote from peer feedback:
PillReminder app helps people manage medicines effortlessly and intuitively. 

What I learned

I learned that each step of the design process is important and that they must be aligned with the user’s specific needs, helping me to find workable and useful solutions.

Next steps

next steps PillReminder

Thank You For Watching!

If you’d like to see more or get in touch, my contact information is provided below.