Overview
Solution
Research
Ideation
Design
Iteration
Reflection

EasyMed

A mobile interaction checker leveraging deep learning to predict drug and food interactions, empowering and educating users on multi-drug use.

Recognizing the widespread use of multiple drugs among older adults, we created a mobile interaction checker for drug-to-drug and drug-food interactions. I led stakeholder interviews, user needs analysis, and multiple design iterations to create an accessible app, empowering the elderly to be more confident about their medications.

Team

2 UI/UX Designer
2 Front-end
2 ML engineer
1 Back-end engineer

Timeline

8 weeks (May - June 2022)
🚀 The project was developed and shipped

Awards

Design Intelligence Awards (DIA)
Microsoft Responsible AI Hackathon
AI+UX Design Contest

Role

End to end product design
-
Problem Identification
- User Research & IA
- UX, Visual, Interaction Design

Problem

Usability issues within UT is currently hindering users from efficiently completing their tasks and results in increased engineering hours spent on privacy-related work.

Solution

I led the design of the homepage, optimized search, and improved the node details page, ensuring a more efficient and seamless data annotation process.

ProblemDid you know multi-drug use is prevalent among the elderly?

During our visit to the UCSD Senior Medicine Center, we were struck by the prevalence of polypharmacy among elderly patients, where they concurrently use multiple prescribed and non-prescribed medications with limited awareness of potential side effects and drug-food interactions.  This issue is compounded by factors such as an aging population, the presence of multiple chronic conditions, a fragmented healthcare system, posing challenges in medication management.

SolutionEasyMed is here to ease your concern about Polypharmacy

After a 8-week sprint, our team created EasyMed, a mobile interaction checker using state-of-the-art AI like Azure's text-to-speech, Google's barcode scanning, and advanced food recognition algorithms.

All-in-one Home Page

Through EasyMed's homepage, users can effortlessly check for drug-drug and drug-food interactions, access curated daily articles on polypharmacy, and access personalized pill reminders.

Check drug-to-drug interaction

Effortlessly search or scan a drug by barcode to check interaction details with meds in your list, stay updated on side effects and food interactions, and add to list for future reference.

Check drug-to-food interaction

Just snap a photo of your food items or product barcode, and the app performs a thorough analysis, alerting you of any potential adverse interactions with your list of medications.

My Drug List & Drug Reminders

Keep a detailed drug list for future reference during doctor visits, and receive customized medication reminders to ensure timely and accurate dosing.

Explore

Access personalized articles to enhance your understanding of polypharmacy, with the option to filter articles by category and enjoy interactive quizzes for added engagement and learning.

Success Metric & ImpactPositive feedback from users

First Place & Bonus Prize
EasyMed secured first place among 760 global participants and earned the Best Integration of Responsible AI bonus prize for best exemplifying Microsoft's commitment to Responsible AI principles.

Featured OnlineEasyMed has been showcased on the Microsoft Azure Developer Community platform, and received recognition on Facebook (@MSFTDev.US) and Twitter (@MSTCommunity).

High User Satisfaction
Task success rate:
94.44% (34/36, benchmark: 78%)
NPS:
80% (4 promoters, 1 passive)
User satisfaction:
100% (3 highly satisfied, 2 satisfied)

Research Many older adults are at great risk for major interactions

To understand the current landscape of the problem, I researched extensively online and found that many adults mixed drugs together and the problem is even worse for older adults since they are often taking more than 5 drugs for various medical complications.

Yet, medical professionals often lack the time and resources to provide comprehensive explanations and consider all aspects of a patient's medical history

To collect qualitative data on how different stakeholders perceive adverse drug interactions, we conduct 6 in-depth interviews with 2 older adults, 1 adults with multi-drug use and 1 without, and 2 healthcare practitioners and here are the key insights:

Given the vulnerability and minority status of older adults, we strive to prioritize their needs while also considering the needs of healthcare professionals and the general public.

Healthcare Professional
🌟Elder Adults

General Public


How might we

“Build a platform that allow users, especially older adults who are taking multiple drugs together, to check and educate themselves about poly-drug use side interactions so that they can avoid damage to their health.”

Competitor AnalysisNo products address drug-food interactions in a personalized and user-friendly manner, particularly for older adults.

After evaluating 5 websites and 5 mobile competitors, it's evident that most of them exhibit usability issues such as information overload, poor UI design, and limited functionality. Recognizing the importance of this, the inclusion of severity levels and explanations for these interactions would greatly enhance usability and user experience.

Ideation With limited resources, what might be essential for us?

Synthesizing research findings, I brainstormed 17 features and narrowed down to 6 P0 features we want to implement first based on impact, hackathon requirements and implementation cost.  (See Brainstorm Doc)

Design Principles  

Keeping our core users in mind, I utilized the Usability Heuristics and the Microsoft Responsible AI principle as the guideline for our design.

Accessible DesignProper font size, use of icons and visual imagery

Privacy & Security
Password protection & Username resetting

Help & Support
Onboarding guide and confirmation windows

Transparency Include disclaimers and warnings

Sketches Ideate and gather quick feedback

I sketched quickly on iPad for quick iterations and discussed with team members and our instructor for feedback.

High-Fidelity PrototypingKey considerations when crafting age friendly designs

Legible font

  • Use text size that are legible ranging from 14-22px
  • Use Inter, a Sans Serif type to increase readability
  • Icon with text for less confusion
  • Ensure the touch zone is big enough

Ensure color contrast

  • Ensure proper color contrast by passing at least the WCAG AA standards and mostly passing AAA standards
  • Checked the design would be friendly for color blind people.

Simple Interactions & Detailed Guidance

  • No difficult or hidden interactions since older adults are typically less familar with technology
  • Comprehensive Guidance, Step-by-Step Support, and Error-Recovery Tooltips to Aid Users
  • Clear and big CTA buttons

User TestingDetermining our priority

Participants
To validate our research and identify relevant problems, we invited 5 participants to test our prototype including 2 older adults, 2 healthcare professionals, and 1 oridinary adult.
Mythology
We first asked them a set of semi-structured interview questions to gain general background information. We then asked them to finish 6 tasks, observe their performance,  and asked follow-up questions to learn their thoughts. The plan and results are attached here (See User testing plan)
Insights
We used an affinity map to group the feedback and determined what we can improve given the limited time and resource. (See map and priority matrix)

User Testing & IterationDesiging for better accessibility

Participants
To validate our research and identify relevant problems, we invited 5 participants to test our prototype including 2 older adults, 2 healthcare professionals, and 1 ordinary adult.

Mythology & Analysis
We conducted semi-structured interviews to gather background information and evaluate task completion. We then use affinity map and priority matrix to group feedback and identify key areas for improvement. (User Testing Plan, Map and priority matrix)

Research Insights

Before

After

Participants reflect that it's hard to understand the complicated medical terms.

Side effects are presented without explanations

Offer explanations for medical terms from notable sources

Why I use a bottom sheet?
Bottom sheet offers context and information without disrupting the reading experience.

How can users learn more?
We obtain definitions from authoritative sources, and users can access them with a single click.

Research Insights

Before

After

Older individuals had a hard time reading the long text and understanding the severity

Long paragraphs of text for users to read and comprehend

Users can listen to the text and visualize severity levels using graphs and tags.

How is text-to-speech implemented?
We utilize Azure's Cognitive Services for greater accuracy.

Colors Indicators
Color indicators are employed to aid user comprehension of severity levels, with red signifying severe interactions and orange indicating mild ones.

Research Insights

Before

After

Users feel at lost about what the app does when they first entered

First time users go to the sign up page directly.

We will start with an onboarding tour to guide users on how to make the most of the app.

Techanical ImplementationThreading all things with design

Since the logic of our app is complicated involving ML model caculation, back-end storage and front end demonstration, my role is to thread all components together into one compact app. This figure shows how our app works technically.

Reflections Designing for older adults is a valuable experience

Designing AI products is challenging yet fulfilling
Designing AI products is both challenging and rewarding. It differs from traditional product design, requiring consideration of principles like the Responsible AI framework for reliability and inclusivity. Effective collaboration with various stakeholders, including front-end, back-end, and ML engineers, is crucial to align product goals with user needs and implementation costs.

Worthwhile to design for accessibility
Designing for accessibility has been highly rewarding as it allowed me to empathize with the challenges older adults face with technology. This experience has inspired me to explore designing for other groups that require special attention in the future..

Future WorkBring More Value to Users

Refine AI Model
We would like to refine our machine learning model to support analysis of allergen and dosage information in relation to interactions.

Personalized Support
Add more features such as medication reminders, search by text, and food image recognition.

MyChart Integration
Integrate with digital health record system like MyChart for more transparency in data sharing between patients and physicians

Back to top

You might also want to see