HealthPal Mobile App

UX Case Study
Project Background Image
My Role
Design Team Lead
Product thinking
Design Coordination
Target audience
Healthcare Consumers/Patients and Medical Practitioners in Nigeria
COLLABORATORS
Product Managers
Product Designers
Web Developers
Year
2022/2023

Problem Statement

There is inactivity from quite a number of Altschoolers on the Slack platform and in their respective learning circles and some students struggle with interacting with other students and learning from them.

What is AltCamp?

An Ed-tech Platform and Community that facilitates peer-to-peer learning and sharing of knowledge among Altschoolers and other tech enthusiasts. Users can ask questions, give answers and also test their skills. It is a platform designed and built by Altschoolers for Altschoolers.

Who are Altschoolers?

Altschoolers are students of Altschool Africa, an educational diploma program designed to train students with the skills and knowledge required to launch their tech career.

Design Process

design process

User Research

Research was conducted by sending out surveys to Altschoolers who are the core target audience in order to validate/invalidate existing ideas we had and also align the goals of the web app with the needs of the target users.

The students of the 3 schools (engineering, product and data) in Altschool Africa participated in this research.

The major deciding research question was: "What are the current challenges you're facing with the peer-to-peer learning experience at AltSchool?"

Research Findings

research key results

HIGHLIGHTING THE PROBLEM

It was important to define the problem so as to design a solution that is useful and valuable to the users. Synthesizing the research results helped in achieving this.

Below is the Empathy map stating out the pain points and needs of the users.

Empathy mapping

CONCEPTION OF IDEAS

Information Architecture

As part of the ideation process, it was important to draft out the structure of the features the platform will have in a way the user will easily access and also navigate seamlessly. There are 11 tabs with 3 major categories as seen below.

Information architecture

PRODUCT IDEAS

The team came up with ideas and features that can help facilitate peer-to-peer learning and interaction. The features are listed below.

1. Community Feature

The Community Feature to aid learning by allowing users to ask questions and get answers from the community of track-specific students. A user can ask questions or give answers to questions they may. This is track-specific which means this tab is dedicated to students learning the same tech skill plus all instructors.

community page

2. The Feed Feature

The Feed Feature to facilitate interactions among students of all tracks and between instructors and students. Unlike the community feature, the feed feature is for all the learning tracks in order to boost interaction among all the students.

Feed page

3. The Quiz and Skillboard Feature

The Quiz and Skill Board Features to test user’s knowledge and track personal learning progress. The quizzes are track-specific and self-paced. They are broken down into the subskills of the user's track.

The skill board shows the progress and points accumulated in the quizzes

Quiz pageskill graph feature

4. Learning Circle with Ranking Feature

The Learning Circle Feature With Ranking, the additional ranking feature is to show the active participants in a specific circle over a period of time. It is quite difficult to track the activity of students in learning circles on Slack but this feature shows the top and active students.

Learning circle

5. Learning Resources Feature

The Learning Resources Feature is also track-specific in which students in similar learning track can share and receive resources and materials that are useful and beneficial to career growth.
A tab is dedicated to this for easy access when any of the resources might be needed.

Learning resources

The Link to Live Project

Click here to view the live project

My Role
Product thinking
UX Design
Target audience
Healthcare Consumers/Patients and Medical Practitioners in Nigeria
COLLABORATOR
Full Stack Developer - Wisdom Elue
Year
2023

WHAT IS THE BYTES BLOG

The Bytes Blog is an online platform where individuals can share their thoughts, knowledge, and experiences through posts and articles. It helps users to express their thoughts, ideas, engage with readers through comments, and create a community of like-minded individuals.

Features of the Blog

1. User Registration and Authentication: Visitors can create accounts and access personalized profiles.

2. Blog Post Creation: Users can effortlessly compose, format, and publish their blog posts.

3. Categories and Tags: Content can be organized into categories and tagged for easy discovery.

4. Commenting System: Readers can engage in discussions through the built-in commenting system.

5. Social Media Integration: Posts can be shared across major social media platforms.

6. Search Functionality: Users can easily find specific blog posts using the search feature.

7. Manage Interests: Users can select and filter the category of posts they would like to receive on their timeline.

Landing Page

This serves as the entry point to the blog, providing a brief overview and enticing visitors to explore the content. It highlights the value of the blog, and encourages readers to delve deeper into the articles and resources available

Landing page Image

User Registration and Sign In

This serves as gateway to personalized experiences that allow users access content, save preferences and inetrect with other users.

User Registration Page

Home and Content Page

This displays the content and blog posts from different users and the category of content can be switched and filtered. The users also have access to their profile through the nav bar on the home page

Home Page image

Creating a Post and Article

This shows the process involved in creating a post.

Adding a post and article Page

Commenting System

This allows readers share their thoughts and opinions and also engage in discussions through under posts.

Commenting System Image

User Account and Profile

This allows users manage and edit their profile and set their preferences.

Profile Image
MY ROLE
Product thinking
UX Design
Prototyping
Usability Testing
TARGET AUDIENCE
Healthcare Consumers/Patients and Medical Practitioners in Nigeria
TIMELINE
2 Weeks
YEAR
2023

Problem Statement

Healthcare systems in Nigeria suffer from limited accessibility, long waiting times and the compulsory need for physical presence, leading to inconveniences even for people who are in need of medical advice.

Additionally, scheduling appointments and finding suitable healthcare professionals can be time-consuming and frustrating.

Nigeria is currently placed at 142 out of 195 countries
according to a Lancet report's ranking of health systems performance using healthcare access and quality as its criteria.

Introducing HealthPal

HealthPal mobile application is a healthcare mobile app that aims to make healthcare more accessible to users through virtual consultations with doctors and also streamlining appointment booking processes. It aims to provide users with a platform to consult with healthcare professionals remotely.

Design Process

Design Process
MY ROLE
User Research
Ideation
UI Design
Prototyping
Usability Testing
Target Audience
Online news sites and social media news consumers.
TIMELINE
2 Weeks
YEAR
2023

Problem Statement

Online news dissemination is one of the means of passing information to a significant number of people within a short time but the quick spread of false information through social media platforms and other online news sites has become a huge challenge in recent years, causing a decrease in reliability and credibility of online news.

Research has shown that people have started losing trust in online information as it is difficult to distinguish between a fact and a rumour.

What is Daily Truth?

DailyTruth Mobile App is a digital solution aimed at promoting the dissemination of accurate and verifiable information with the intent of combatting the spread of false information.

The app aims to address the issue of misinformation by providing users with a platform to fact-check news articles, social media posts, and other online content in real-time.

Design Process

User Research

I conducted research in order to understand and gain insights into the frustrations/pain points associated with the causes and spread of false information, align the goals of the App with the needs of the users thereby ensuring a balance between the solution the app will offer and the needs of the prospective users and to validate/invalidate existing assumptions and replace them with facts based on the responses from the research.


The research was conducted through surveys and interviews and some of the deciding questions were:

1. Tell me about a time the news you read online turned out to be false. How did you handle it?

2. Based on your experience, do you believe online news is reliable?

3. Have you ever shared false information unknowingly? If so, what steps did you take to correct it?

4. What do you believe are the main factors contributing to the spread of false information online?

Research Findings

Pie chart showing research results
Pie chart A is for the question “What is your go-to platform when you want to read the news?”

Pie chart B
is for the question “Do you read news on online sites and social media?”

Pie chart C
is the question  “Based on your experience, do you believe online news is reliable?”

I also used the Affinity Diagram method to group similar responses to Survey Question 8 which is “What do you believe are the main factors contributing to the spread of false information online?”.

Research Findings

Research Insights

After carefully synthesizing the data, I got these insights:

1.
A high percentage of people read news/check information on social media and online news sites and this highlights the growing trend towards digital news consumption.

2. Inadequate verification of news and an insufficiency of credible sources contribute greatly to the spread of false news.

3. Online news sites are losing credibility and reliability because distinguishing fact from rumour is becoming difficult.

4. The suggestion of an app that will help reduce and combat the spread of false news and also help its users verify information excites the audience and they look forward to it.

DEFINING THE PROBLEM

I defined the problem based on user research and the analysis of the results from both the survey forms and interviews.
Defining the problem helped me streamline the pain points and needs of my users which helped in making design decisions.

The UX deliverables I used to define the problem are:
1. User Persona
2. How might we approach (HMW)

User Persona

User Persona

How Might We (HMW)

1. How might we help users to distinguish verified news from false information?

2. How might we help users verify news/information?

3. How might we reduce the spread of false information?

My willingness to provide answers to the above questions prompted me to brainstorm and draft out design solutions that will help nullify the problems stated.

MAKING DESIGN DECISIONS

After synthesizing the research data and defining the problem, I started making sketches and brainstorming ideas that can serve as good solutions to the defined problem(s).
I came up with different ideas based on my interaction with the interviewees and synthesis of the survey results and brainstorming sessions.

These ideas are written out in sticky notes below:

Ideas for the app

After writing out the above ideas, I used the following UX deliverables to bring my ideas to life.

1. User Flow Chart
2. Wireframes

Userflow ChartMid fi WireframesStyle Guide

User Research

I carried out research with target users to understand their pain points and challenges regarding healthcare, to validate/invalidate existing assumptions and also align the goals of the App with the needs of the users thereby ensuring the App meets the users’ needs.

I conducted the research for the two user types which are; Doctors and Users (people in need of medical help) with more focus on the users for this case study.

Research Methodology
1. Surveys through Google Forms
2. Interview

Research Findings

After conducting the research, I grouped the similar pain points and frustrations of the respondents. This is to have a good understanding of users’ pain points and needs.

Research Findings
Nigeria is placed at 142 out of 195 countries according to a Lancet report´s ranking of health systems performance using healthcare access and quality as its criteria.

Insights From Research

After synthesizing the data, I was able to get these insights:

Research Insights

dEFINING THE PROBLEM

To streamline my focus on what the problem is, I synthesized the research data from both the survey forms and the interviews. This is to keep my design decisions user-centered.

The UX Deliverables I used to define the problem are:
1. Empathy Map
2. User Persona

Empathy MapUser Persona

BRAINSTORMING IDEAS

After synthesizing and defining the problem, I came with ideas that can help solve the problems.

Ideas for the App

User Flow Chart

After coming up with ideas that will meet the users' needs, it was important for me to draft out a flow that would enable users access and navigate the App seamlessly.

User Flow Chart

ITERATIONS AND TESTING

I tested some of the mid fi wireframes with some users. The purpose of the testing was to ensure my design decisions were in sync what what the target users need and to also test the accessibility of the designs.
I asked the testers to go through the consultation and booking flows.

The outcome of the testing informed my final designs as seen below.

Usability Testing
Usability Testing 2Usability Testing 3

Style Guide

Style Guide

FINAL DESIGNS AND SOLUTION

1. Virtual Medical Consultation

Virtual medical consultation which includes chat and video chat features to help users have access to healthcare and medical advice irrespective of their location in Nigeria and also getting a doctor's report for recommended test or prescription from the doctor in cases where a test is not necessary. The flow is streamlined in a way that doctors are grouped based on their departments. That way, a user can select the precise medical department they will like to consult from and choose preferred doctor based on the doctor's profile, reviews or ratings.

Virtual Booking FlowVirtual Booking Flow

2. Appointment booking system

From the research, long waiting period and time factor contribute to why some people delay visiting hospitals. The appointment booking system aims to ease this frustration by streamlining booking processes in which registered hospitals are listed on the app and users can book doctors from the departments of a desired hospital. The preferred date and time are chosen by users and the fully booked dates are blurred out.

The proximity of the user to the hospital location is also displayed.

Appointment BookingAppointment Booking

3. Prescription and Medication Reminder

This is an additional feature that users can use to set reminder for prescribed drugs by doctors in-app or an external prescription.

medication reminder

Onboarding Screens

Onboarding Flow

Some screens from the Doctors' View

Doctors' view

Prototype

Click play to watch the Prototype

Success Metrics of the App

1. Enhanced Access to Healthcare: Monitoring the number of virtual consultations conducted through the app will highlight the app's impact on expanding healthcare accessibility.

2. Increased User Engagement: Measuring the number of active users, session duration, and frequency of app usage will help assess user engagement. Higher engagement indicates that users find value in the app's features.

3. Improved Health Outcomes: Tracking patient health outcomes, such as symptom resolution, reduced hospitalizations, or improved chronic disease management, for individuals who utilize the app for virtual consultations, will help determine the impact of the app on users' health.

Learnings and Takeaway

Working on this project helped me to further understand the importance of healthcare and the experiences different people have had or are having with healthcare systems. Understanding this helped in my decision cycles.

Yet again, the design thinking non-linear approach helped in breaking down the problem and highlighting the target users' needs.

Overall, I am glad I worked on this project as good healthis an integral part of life.

DESIGN SOLUTION

1. News/Information Verification System.

Since DailyTruth might not exactly be able to filter what users hear or read on other news platforms, this news verification system will help users check the verification status of news or information they might have heard or seen somewhere

News Verification Process

2. Distinguishing features for verified or unverified news and Limiting the sharing feature of news to the verified news only.

I was able to achieve this by adding a verified icon for verified news and putting a caution icon for unverified news that might have been uploaded on the app. This will enable users to identify verified news and unverified news easily.

The share icon was only designed for verified news alone. What this means is, users will not be able to share the news that does not have confirmed sources out of the app. A piece of unverified news can not be shared. This is marked out on the screens below.

key features of the app

3. Reporting/Flagging feature

Users can report suspected false information on the app. Such reported/flagged news will be reviewed by the DailyTruth verification team and action will be taken based on the final findings in which the news might be brought down or reconfirmed to the user as verified news.

Flagging Of News

TESTING

I conducted usability testing to find out how accessible the app is and how fast the participants can perform the set of tasks without any difficulty.

The major layout I changed was the positioning of the search bar because 3 of the participants had difficulty searching for news/pieces of information as they did not see the search bar on time. I moved the search tab to the tab bar for more visibility and access.

The changes made are shown on the screens below.

Usability Testing

OTHER SCREENS

Onboarding Flow

Dark Mode Designs

Dark Mode Designs

Other Projects

An image that leads to the project
AltCamp Web App
Web UX Case Study
An image that leads to the project
The Bytes Blog
UI Design
An image that leads to the project
DailyTruth Mobile App
Full Case Study