CASE STUDY / UX

Better Health Starts with Better Health Education

Unleashing AI's Potential to Foster Personalized Achievement in Health and Wellness

TIMELINE

4-Months

ROLE

UX Researcher, UX/UI Designer, UX Writer

TOOLS

Adobe XD, Photoshop, Illustrator, Figma

PROJECT BACKGROUND

Introducing Olive! But hold on, let's take a step back. Allow me to introduce you to the source of inspiration behind Olive. The initial idea for this web application originated from the project brief I chose during my participation in the Immersion program within CareerFoundry's UX Design Bootcamp. This assignment tasked me with creating an inclusively designed, responsive web portal (app). The primary goal was to offer comprehensive health and wellness information while also providing users with a platform to store their medical records and appointments.

Allow health-conscious individuals to log in to a responsive health and wellbeing portal to record their health and medical information, and access general physical and mental wellbeing features.

INSPIRATION >>

HYPOTHESIS

"If an app provides personalized guidance tailored to the unique needs of each individual, then it is more likely that they will maintain inspiration and motivation, ultimately leading to positive results. I believe that incorporating AI capabilities will better personalize, thereby enhancing the user experience."

RESEARCH GOALS

With my hypothesis established, I proceeded to try to answer the following questions:

What motivates users to lose weight?
What hinders their motivation?
What support and tools do they desire?
What pain points do they encounter with wellness apps?

USER INTERVIEWS

Continuing my research phase, I directly engaged potential users. After distributing an initial insights-gathering survey, I virtually met with four potential users. In these sessions, I asked questions covering their health conditions, attitudes, and wellness experiences. Some questions asked were:

Are there any medical conditions that might hinder your capacity to manage weight, engage in physical activity, or maintain wellness?
What obstacles, whether actual or perceived, act as hindrances to you taking the initial steps towards wellness or adhering to a wellness plan?
Concerning wellness education (such as understanding calorie dynamics, the role of protein, the long-term benefits of mobility exercises, etc.), how influential is it in your ability to sustain a wellness plan?

Some pain points reported were:

"Limited time without having help with daily responsibilities."

"Difficulty finding exercises that won’t aggravate conditions."

"Difficult to find motivation without a partner."

"Not being informed of any result when working toward a goal is discouraging."

WHAT I LEARNED
Initially, my solution focused on tracking medical costs and considered a reduction in these expenses as a measure of success. However, the feedback from users led me to pivot in a slightly different direction. The early communications confirmed my belief that integrating artificial intelligence into Olive's functionality could offer more value in both the short and long term. The quest for reliable information to achieve fitness goals can be quite frustrating, and enhancing Olive with AI to transform her into a comprehensive resource was met with enthusiasm and emerged as a central concept.

CONCEPTUALIZATION >>

USER PERSONAS

To better comprehend my users' viewpoints, I synthesized data from surveys and interviews. This formed a comprehensive understanding of their identities, usage context, motivations, and challenges. This resulted in the formation of a couple distinct personas, with the primary being—

Layla, the Ultimate Caregiver

Layla, my primary persona, perfectly represents my target user demographic. She deals with weight issues and daily fatigue while juggling demanding caregiving responsibilities, leaving her little time for health research. Layla mirrors a significant portion of users facing similar time constraints due to caregiving duties, whether it's for parenting, a spouse, or elderly parents. Her situation makes her an ideal representative of my intended demographic.

“You’re doing something and you’re not seeing the results and no one is telling you the results—that’s more detrimental.”

IDEATION

With my persona in place, I pondered creating a solution that would be both helpful and engaging for Layla. Before visualizing my concepts, I needed to understand the significance with a clear problem statement.

Layla needs a way to create a healthier lifestyle to improve overall health without the pressure of lengthy workouts and food calorie tracking.

We will know this to be true when we see an increase in average calories burned and/or activities completed and reduction in joint pain on a regular basis.

INFORMATION ARCHITECTURE

Before delving into the design of my web portal, my first step was to grasp the crucial content that required sharing. For the initial assessment, catering to both the user's requirements and project criteria, I prioritized four key features:

Dashboard
Medicine tracking
Fitness and meal tracking
Education

These selections formed the basis for devising a well-founded user flow. Through a card sorting activity involving anonymous volunteers, the flow was refined to better synchronize with real-world user expectations.

Original flow based on assumptions about how users would interact

Revised flow based on user feedback received during a closed card sort exercise

MOCKUPS

The moment arrived to infuse vitality into my concepts. I initiated the process by generating rapid prototypes and outlining my ideas using my iPad. Once I had a clear sense of the path I was heading, I progressed from low-fidelity mockups to mid-fidelity iterations, gaining a more comprehensive perspective on them. These, in turn, paved the way for crafting high-fidelity wireframes, which were poised for eventual testing.

Lofi mockup of 'My Meds' screens

Midfi mockup of 'My Meds' screens

WHAT I LEARNED

In this phase, I gained a deeper understanding of potential user struggles through persona development. I realized the application needed to be more than passive – it should collect user input upfront via a comprehensive questionnaire. This approach would enable proactive tips, serving as a source of motivation like a virtual cheerleader, and continually adapt for a more personalized experience.

ITERATION >>

PROTOTYPING

With a design mocked up it was time to move on to the testing phase. I used Adobe

XD to pull everything together and create my first functioning prototype. I created a test plan with a simple goal of assessing the mobile prototype’s:

Learnability
Efficiency
Elimination of pain points

In addition to identifying usability friction points, some capabilities I wanted to confirm were:

Medication logging
Accessing workout from scheduled wellness plan
Accessing education library
Satisfaction with offered features

USABILITY TEST RESULTS

Five tests were conducted successfully, and despite encountering minor challenges, all participants expressed overall satisfaction and found the prototype easy to use. Feedback was evaluated through the process of affinity mapping. The issues that arose were categorized and evaluated using Nielsen's severity rating scale for usability problems. The most significant problems were documented in a report prioritized and resolved in the next iteration.

“ I think this will be a great app!”

—Potential user

WHAT I LEARNED

Usability testing not only revealed the challenges my users were facing, but, more importantly, it also brought to light missed opportunities that could enhance the effectiveness of my app. It became evident that by reorganizing certain categories, I could significantly enhance the user experience and ensure that users do not overlook key built-in functionality.

EXPOSITION >>

VISUAL PRESENTATION

Before further testing, it was vital to define the web portal's visual style. A more lifelike experience would yield higher-quality feedback for my iterative changes. This involved selecting colors and their meanings, a font family reflecting the app's tone, and visualizing Olive.

I generated multiple logo options, experimented with colors and mood boards, and gathered unbiased feedback to make informed decisions about the most effective style for my web portal.

Original logo options

BRANDING

After contemplating the emotions I wanted to evoke and ensure they harmonized with the purpose and objectives of the application I settled on a primary color palette that leans towards bluish-green, accompanied by a reddish-orange shade.

Blue, widely associated with healthcare, and green, symbolizing health, nature, and growth, were combined to unite these concepts

Reddish-orange retains the essence of the heart symbol in the logo while conveying warmth and excitement

Olive is the vibrant heart and soul of the Ask Olive app. Serving as the app’s primary personality, she is the delightful main character with whom users engage, bringing a world of healthy possibilities to their fingertips. As such she should feel relatable, so I scraped the fun and childlike version for a more mature iteration.

Original Olive

Final Olive

To complete the visual aesthetic of the Ask Olive web portal , I formulated a series of UI guidelines and documented them in a couple of references for future use.

Brand Style Guide

Design Language System

PEER REVIEW

I revamped my prototype in Figma, applying these stylistic changes and refining it based on the new guidelines. I then shared my work for peer review via Slack, gathering volunteers for feedback. While most comments were positive, noting minor overlooked improvements, some substantial criticisms arose due to a misunderstanding that the prototype targeted a native app. Still, I found valuable suggestions that I either incorporated or noted for future use.

ACCESSIBILITY REVIEW

The most recent review I conducted focused on ensuring accessibility, so that all types of users can benefit from this app. Based on this assessment, I made adjustments in the following areas:

Color contrast
Font sizes
Spacing

WHAT I LEARNED

Coming from a design background, this area was relatively familiar to me. However, what I discovered during this journey was the paramount importance of ensuring accessibility. These eye-opening revelations enabled me to implement changes that go beyond aesthetics and instead focus on enhancing the overall user experience for everyone, not just those who might face unique challenges due to different abilities.

SOLUTION >>

MEET OLIVE!

Ask Olive has transformed into a comprehensive web portal application that seeks to leverage AI to cater to the needs of individuals grappling with health and wellness challenges. After completing a thorough questionnaire, users gain the opportunity to receive personalized meal and fitness plans aligned with their specific requirements. The days of scrutinizing article credibility for helpful advice are over. Users can simply ask Olive at any time, receiving not only answers but responses tailored to their unique health conditions and insights from repeated interactions.

'Olive' facilitates medication management, hosts a repository of health resources, encompassing articles, fitness videos, and alternative meal plans. Moreover, it fosters community building by enabling users to connect with friends within the app.

Following months of empathizing, defining, ideating, prototyping, testing, and iterating, I've crafted an application that not only fills me with pride but fills a need that arose during the research phase.

ROUND 1

ROUND 2

FINAL (CURRENT)

View Full Prototype

demo

OVERALL LEARNINGS

Throughout this process, I've gleaned a couple of lessons—and not just about the process itself:

A significant number of individuals feel neglected when attempting to enhance their fitness due to the limited consideration given by most apps to those dealing with chronic illnesses or conditions that present exercise challenges. It's crucial to ensure they feel acknowledged and to provide them a voice in their personal journey. This app is dedicated to fulfilling that role. Consequently, obtaining continuous feedback from this specific demographic will play a pivotal role in the app's success.
I can't profess a genuine concern for the well-being of those often overlooked without integrating accessibility into design. I hadn't previously considered factors like color contrast, font size, or element spacing. Moving forward, I'll incorporate these and many other considerations into every phase of a project.

CONCLUSION

For many, meeting wellness goals can be challenging. It's not merely a matter of calories in versus calories out. Numerous factors, including genetics, physical condition, psychological aspects, and learned behaviors, come into play. The average person often lacks the necessary training and knowledge to navigate these complexities. Having access to an app capable of swiftly accessing, analyzing, and providing guidance holds the potential to significantly transform one's life. That’s because better health starts with better health education.

Just ask Olive!

Back