Health Med Responsive Mobile App

Health Med is a Mobile application that takes care of people’s health. Its main features are pill reminder and medication tracking.

My role
UX/UI designer

Tools used
Figma, Adobe Illustrator, Adobe Photoshop, Optimal Workshop

Scope
Jan. 2022 – April. 2022

What I did
Competitive Analysis, User Research, Information Architecture, Mobile design, User Journeys & Flow, Card Sort, Sitemap, Usability Study, Product Design

The Problem: How can we help people take better care of their health to live more fulfilling lives?

The challenge
I set out to develop a Mobile Application that would support health care and ensure a full and long life.

The Background
The healthcare industry consists of those companies that manufacture medical products or provide services including prevention, diagnosis, and treatment of illness or other health issues, and rehabilitation.

The Industry
The healthcare sector is one of the largest and most complex in the U.S. economy, accounting for 18% of gross domestic product (GDP) in 2020.
The healthcare sector benefits from a strong system of medical research and development, in cooperation with the higher education system and the technology industry.

The Iterative Process of Designing Health Med

When working on Health Med, I have adopted the Double Diamond Strategy which breaks the design process into four stages: Discover, Define, Deliver & Develop. I found this process particularly powerful in validating design decisions, allowing enough space for creative exploration while giving a focus point to come back to.

DISCOVER

What's there: Health care and Health Med

I conducted a competitive analysis of healthcare apps with a focus on UX analysis: to evaluate their navigation, layout and overall usability. This helped me understand what Health Med had to deliver to differentiate itself from the competition.

Here’s a list of competitors:
MyTherapy Pill Reminder, Pill Reminder & Medication Tra, Medication Reminder, DailyDose: Pill Reminder.

I also did a detailed SWOT analysis of the competition and found their strengths and weaknesses, which greatly helped build Health Med’s competitive advantages.

User Research: Can you walk me through your process?

It was time to see what healthcare enthusiasts thought about the competitors. Equipped with the preliminary research discoveries, I conducted 3 user interviews with people who have different levels of experience with healthcare apps. My research goals were:

1. To understand the general attitudes and processes.
2. To uncover what (common) difficulties people might face.
3. To discover if they use any apps or websites to help them achieve their goals.

DEFINE

The Research Analysis: Moving Forward

After the Research phase, I reexamined my assumptions based on the insights from the User Interviews. It was clear that:
After the Research phase, I reexamined my assumptions based on the insights from the User Interviews. It was clear that:
• People are looking for an app that will be secure and won’t let them down.
• They require contact and good support.
• They require the application to be easy and accessible to users.
• They want to be able to accurately monitor medication intake.

Revision of Problem Statement

I revised my hypothesis problem statement to align better with the users’ needs and goals.
Healthcare apps’ users need to find the right app for their needs. They expect to receive quality service, flexible app, user-friendly navigation, security for their personal data, and this to help achieve their goal.

User Journeys: What would Dimitar’s experience with Health Med be?

Informed by each persona’s experience, attitudes & goals, I have created User Journey Maps to outline the processes needed to achieve their individual goals within Health Med app. This allowed me to focus on possible critical pain points and plan how to address them in the following design decisions.

User Flows: How would Dimitar go about add a medicine on Health Med?

I set out to map out their User flows. This step helped me keep the design user-centered, by showing me what pages or screens of the app will be needed from the perspective of my user personas.

Sitemap after Open Card Sort.

Before starting to work on initial sketches of each feature, I visualized the Information Architecture of the app into a sitemap, based on the user flows. The first version of the sitemap was tested through an Open Card Sort.

DEVELOP

Wireframing: From sketches to first clickable prototype.

Ones the Sitemap information architecture was decided, I began sketching paper wireframes progressing them.

Mobile Low-Fidelity Wireframes

Mobile High-Fidelity Wireframes

Usability Study:

Focusing on navigation and main features, I designed clickable prototypes for Mobile versions of the responsive web app. It was tested in a usability study, conducted remotely with 4 users. The issues, discovered in the usability test were addressed and fixed.

Problem

“I need to add strength and units to the medicine.” – Samuel

Solution

Problem

“I need to add a reminder to the health tracker.” – Ulia

Solution

Designing the Look & Feel of Health Med: Style Guide

Health Med app has a stylish and practical design that aims to help people use it easily and affordably.

I used the Style Guide as a starting point and developed a more detailed Design Language document. It’s purpose is to ensure consistency and communicate the language of Health Med app to designers and developers.

DELIVER

Final Showcase.

When I started working on this project, my goal was to create an app that would help people with their health. The main goal was good menu navigation, clean look, easy access and modern design. I believe Health Med app has achieved the goals as it has its own distinctive style and branding but also offers an easy user journey for customers and their health.

Mobile Prototype