Back to top
WelHub health app on iphone screens with medical care background

Overview

WelHub is a health and wellbeing app that allows individuals to access personalized health and medical information, seek professional help, and receive community support to alleviate their physical and mental health conditions. The interface is simple and intuitive, enabling users to easily interact with different features.

My Role

  • UX/UI designer
  • UX researcher

Tools

  • Pen & paper
  • Figma
  • Miro
  • Optimal Workshop
  • Writemaps

Timeline

  • 4 Months

Problem Statement

Our health and wellbeing app users need a way to access reliable resources and health professionals because they wish to maintain a life-work-health-wellbeing balance in this digital stressful age. ​​​​​​​We will know this to be true when we see more users with varying needs are seeking help and see progress in their physical/mental health state.

The design process

empathize

  • Competitive Analysis
  • User Research
  • User Research Insights

define

  • Personas
  • User Flows

ideate

  • Sitemap
  • Wireframes

prototype & Test

  • Mid-Fidelity Prototype
  • Usability Testing
  • Challenges & Insights
  • Affinity Map

refine

  • Improvements
  • Design language System
  • High-Fidelity Prototype
  • Design Evolution
  • What I learned

empathize

Competitive Analysis

SWOT Profile

HealthTap logo 2HealthTap logo 1

Strengths

  • A wide range of categorized resources
  • Accessibility and affordability to health consultations

Weaknesses

  • Poor/Stale user interface design
  • Incomplete information on some subjects

Opportunities

  • Access to dietary and fitness resources such as yoga practice
  • Join/receive community support via groups and events features

Threats

  • Telemedicine website such as WebMD, ZocDoc, and BetterHelp.
  • Some specialty-focused blogs or social media pages users visit on a daily basis.
A snip of high-fidelity screens.

User Research Insights

  • Tracking and analyzing health data is considered essential.
  • Joining support groups and communities is a key interest for 80% of interviewees.
  • Users want a seamless experience in finding and connecting with healthcare professionals.

define

Personas

Mia

Age 35
Occupation Fashion Designer
Location Pearl City, HI, USA

A fashion designer and TikToker known for her unique style and creative designs. In her boutique, Mia strives to create a space that promotes self-expression and empowers individuals to embrace their unique identities.

a young woman in lavender dress with flowers on background

Goals & Needs

  • Self-care and mental health
  • Anticipate and prepare for PMS.
  • A supportive and uplifting community
  • Access to accurate and reliable women health resources

"I believe in spreading positivity and kindness.“

Susan

Age 62
Occupation Retired teacher
Location Oakwood Heights, PA, USA

Susan is married to John, who has been diagnosed with dementia. They reside in a tranquil suburban neighborhood where Susan is recognized for her active and independent lifestyle.

a senior woman sitting

Goals & Needs

  • Stay active and maintain good physical health
  • Enhance overall quality of lifeand maintain independence
  • Tracking tools to monitor her physical activities, sleep patterns, and overall well-being
  • Stay informed about the latest health and wellness trends and practices

“I love reading books to get information on various health topics.”

WelHub mobile mockup

ideate

Sitemap

First, I conducted an open card sort, and the results were perplexing rather than fulfilling. Then I carried out a closed card sort study. The outcomes indicated that the cards were mostly organized into categories as originally intended in the sitemap.

Wireframes

welhub low-fidelity wireframe screens 1
welhub low-fidelity wireframe screens 2
welhub low-fidelity wireframe screens 3

prototype & test

Mid-Fidelity Prototype

welhub Mid-fidelity screens 1
welhub Mid-fidelity screens 2
welhub Mid-fidelity screens 3

Usability Testing

I prepared a test plan and a test script, recruited test participants from my network, and conducted both moderated in-person and moderated remote usability tests. The goal is to evaluate the usability and learnability of the app's core features for new users representing Mia and Susan.

Challenges & Insights

  • During testing sessions, I encountered an instance where a participant veered off-topic. Politely redirecting their focus on the task and expressing my willingness to address their concerns after the test became a valuable strategy.
  • People's tech learning styles differ, and I recognized the need to be patient and guide them through the steps.
  • Notably, all participants demonstrated increased task efficiency when testing the second platform, highlighting the consistency of my design and the advantages of a mobile-first approach.

Affinity Map

I used post-its and a sharpie to transcribe the usability test recordings into brief notes in order to create an affinity map on the wall. This process was quite fun and enjoyable for me. I identified usability issues and gathered user feedback on the design, functionality and overall user experience.

After that, I created a test report including the usability test results in the form of a rainbow spreadsheet and metrics.

WelHub High-Fidelity mockups

refine

Improvements

Issue 1

Confusion between My care and My info to log menstrual cycle (High)
Suggested change: transfer health and medical log from My info to My care.
Evidence: all participants clicked on My care instead of My info to log their menstrual cycle. 

improvements issue 1

Issue 2

Feature not functioning Support group (High)
Suggested change: create flow for Support group feature to bring it to life.
Evidence: all participants clicked on Support group to join a group or a community.

improvements issue 2

Design Evolution

As I reflect on iterative designs I've completed on my WelhHub application project, I'm reminded of the journey my design has undergone. One of the most noticeable aspects of improvement is the user interface (UI) and overall user experience (UX) of the project. Early versions evolved through user testing, accessibility check and peer reviews in design collaboration. I was able to make adjustments to create a smoother and more user-centric experience.

Throughout the design iterations following user testing and collecting feedback in design collaboration, I refined the home screen by incorporating components from resources such as Material Design, adjusting the navigation bars, which now feature icons accompanied by labels, and adding leading icons to items for a more intuitive design approach.

Similarly, I refined the design by incorporating essential information and eliminating unnecessary elements that could overwhelm users. I also made buttons more comprehensive in their content to assist users in achieving their goals. Furthermore, I made the specialist card more concise and presented reviews as list items. Another enhancement I introduced was the 'read aloud' functionality, which improves accessibility.

welhub High-Fidelity screens

Prototype

Try it!

arrow down

Learnings

  • This project reinforced the significance of conducting thorough user research. By engaging with target audience and understanding their needs, preferences, and pain points, I was able to make informed design decisions that truly resonated with users.
  • I learned the importance of an iterative design process. It's not about getting it right on the first try but continually refining and improving based on feedback and testing. Each iteration brought me closer to an optimal solution.
  • I realized how effective and time-efficient it is to clearly define the objectives and provide a more detailed explanation to the participants.
welhub mockup

Thank you!
Would you like to see more?

arrow down

Other Projects

meeSera real state website on different screens with a city background

UI/UX Design

meeSera

A real estate responsive web app

LVEB hero image

UX/UI Design

La vie est Bella

A dog daycare responsive web app

Let's work together!

Get in touch and drop me a line.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.