Health & Wellness App

Case Study

Project Overview

Brief

To create a wellness app that will help the user track their progress and push them to commit to a healthier lifestyle.

Solution

A Skincare App that acts as your personal Skincare assistant. By providing a personalized regimen with explanations as well as detailed product recommendations the app would cross into the intended blue ocean of a more personalized and educational skincare experience.

Role

UX Researcher, UX/UI Designer

Team

Cynthia Santos

Timeframe

9-Day Sprint

Tools

Figma, Miro, Maze


Discover


The Client

For this solo project, I set out to implement a feature that would add value to the user experience of an already highly adopted app.

The National Wellness Institute is an organization founded in 1977 with the mission of providing health promotion and wellness professionals unparalleled resources and services. They define wellness as an active process through which people become aware of and make choices toward, a more successful existence

Secondary Research

Per Statista, in 2019, the Beauty & Personal Care market realized revenue of US$505 billion worldwide, with Skin Care being the biggest segment. 


The segment accounted for 45% of the revenues. Consumers are more and more interested in high-quality, sustainable, and clean ingredients.

Screen Shot 2021-03-17 at 6.41.45 PM.png

Lean UX Canvas

To get started I needed to conduct a Business Analysis to get a better scope of the company and its users. I entrusted my process with a Lean UX Canvas, which served as a framework for what I need to focus on and accomplish, by setting certain goals that would translate to user benefits.

Normally, you would have access to the stakeholders however as that was not the case here, I made an educated assumption based on secondary research.

With the Lean UX canvas, I was able to outline the Business Problem, possible Business Outcomes, defined the users I should focus on first, and User goals & benefits. 

Competitive Feature Chart

Now that I have a framework to guide me, I needed to delve a little deeper into research. I started with the Competitive Feature Chart, which allowed me to discover who the direct and indirect competition was. From there I started to list the features each had to uncover any patterns, mental models, and areas of opportunities there might be.

Main Takeaway: There seems to be a lot of areas of opportunities as there isn’t a lot of consistency across the apps

Screen Shot 2021-02-27 at 6.52.17 PM.png
Screen Shot 2021-02-20 at 8.50.06 PM.png

Market Positioning Map

In order to analyze Spotify’s current position and competitors' position within their market, I turned to the Market Positioning Map, which allows you to visually determine blue oceans (uncontested market space). Based on the list of features created with the Comp. Feature chart, I looked to define the axis for the Map, X-Axis, Personalized vs Generalized, and Y-Axis, Educational vs Promotional, provided the clearest blue ocean, a personalized & educational experience.

Quantitative Data

Having a better understanding of the market and where there were areas of opportunity, I was now interested in the targeted user and their needs and wants. I started my research by collecting quantitative data in the form of surveys and received 31 responses from Reddit skincare groups. I based my questions on areas of opportunities I uncovered while using the Comp. Feature chart.

The main takeaways here were:

•78% felt that skincare was important to them, yet only 12% knew their skin type

•52% felt lost & overwhelmed when choosing products

•85% unsatisfied with their current skincare routine and felt there was definite room for improvement

Qualitative Data

Having collected the quantitative data, I gained insights into the statistics associated with skincare habits. However, I now needed a more in-depth understanding of the perspectives and behaviors of the user. I approached this by collecting qualitative data in the form of 5 interviews.

The main takeaway here was the strong comparisons with the quantitative data.

ALL feel strongly about skincare yet aren’t very knowledgeable

ALL feel strongly about skincare yet aren’t very knowledgeable

I felt the interviewees had many valuable opinions on this topic but one of the quotes that was an aha moment for me was:

I honestly don’t know if the products I use are actually working for me.

And I think because of that I’m not really consistent in using them.

It made it clear that knowledge and consistency tend to go hand in hand. In order to want to be consistent, you need to feel like you not only know what you are doing but able to track the progress to fuel the motivation.


Define


Screen Shot 2021-02-25 at 6.52.12 PM.png

Affinity Diagram

I now wanted to dissect all the data gathered to find patterns and insights. I started with the Affinity Diagram and placed alike categories together. For instance, how often they use Spotify, where they use it, and what they use it for most. I was then able to label the patterns into groups and lastly color-coordinated the post-is to visually enhance the patterns. 

Main takeaway: The recurring theme of lack of knowledge of skin type and routine however ironically strong importance placed on skincare.

Screen Shot 2021-02-20 at 10.35.32 PM.png

Value Proposition Canvas- Customer Profile

The Value Proposition Canvas consists of two sides; Products & Services and Customer profile. You start with the customer profile side, which is intended to define the customer’s “job to be done” and the associated positive (gains) and negative (pains) experiences, including Functional, Emotional, and Social jobs. 

‘Jobs to be done’ as defined by Strategyn proposes that “in order to understand customer needs in a way that makes innovation predictable, companies should stop focusing on the product or the customer and instead focus on the underlying process or “job” the customer is trying to get done.” Meaning, what does a user “hire” Spotify for.

We use the Value Proposition Canvas in its entirety ( I will talk about the Products & Services side later) to ensure the product or service we ultimately provide is a good market fit with the customer and adds value to their experience. 

A quick example of the jobs to be done, gains, and pains defined were:

JTBD: to buy safe & affordable products (functional), Build Confidence (emotional)

Gains: Improved skin, gain confidence, a personalized routine, consistency, save time & money

Pains: overspending, insecurity, overwhelmed

Screen Shot 2021-02-20 at 10.51.03 PM.png

User Persona

With the insights, patterns, and perspectives into the user's behaviors, uncovered from the collected data, I was ready to create a User Persona. Essentially user personas help to humanize the data that represents the targeted User group. I created inconsistent Izzy and consolidated the data into skincare habits, buying habits, motivations, and frustrations. I made sure to keep the interview quote that most clearly represented my findings.

As-Is Map

I used Inconsistent Izzy (created from collected data) to brainstorm what she would do/think/ and feel during her current skincare routine from there I was able to find patterns that translated to phases.

Phase 1 — Selecting products

Doing: endless research tries a new product, looks for sample sizes, checks reviews, asks friends

Thinking: hope this product works for me, this is expensive, are these clean ingredients

Feeling: confused, skeptical, apprehensive, stressed, overwhelmed


Screen Shot 2021-02-27 at 7.17.00 PM.png
Screen Shot 2021-02-27 at 7.23.59 PM.png

Journey Map

From the insights gathered in the As-is Map as well as user research, I was able to hone in on a specific user journey in order to uncover specific pain points to address.

I was able to establish 3 pain points that when dissected would become areas of opportunities. 

Pain Points

  • Unaware of their skin type and what products to use

  • Frustrated with the number of products to choose from

  • Unaware of specific ingredients

  • Doesn’t really track progress

  • Budget concerns

Problem Statements

I converted the pain points into more detailed problem statements.

Users are unaware of their skin type and what products they should be using

Users are frustrated by the unclear nature of product ingredients

Users find that the cult-favorite products are too expensive

How Might We…

I then converted the Problem Statements into actionable ‘how might we’ statements to help keep me on track and focused on the main pain points.

How might we provide guidance and recommendations specific to their skin needs?

How might we bring awareness and education on safe ingredients?

How might we help the user find products within their budget?


Develop


Screen Shot 2021-02-27 at 7.32.12 PM.png

IDEATE

I brainstormed solutions for the 3 pain points. Using the HMWs statements as the framework I time-boxed myself and allowed 10 minutes for each HMW and came up with 31 ideas. Areas of focus were Guidance & recommendation, awareness and education, and finally budget.

Screen Shot 2021-02-27 at 7.42.01 PM.png

MoSCoW Method

I was now ready to dissect my ideas in order to prioritize features that would ultimately form the MVP. I applied the Moscow method in order to filter these ideas into Must-have, Should have, could have, and won’t have. By combining the impact vs effort and Moscow method I was able to visually see the impact an idea would have and how much effort it would take to implement. 


Value Proposition Canvas- Products & Services

I now needed to ensure the services we would offer were a good market fit. So I was ready to complete the value proposition canvas by addressing the products and services side to make sure the ideas I filtered down to indeed would offer gains and relieve pains or frustrations for the user.

Gain Creators: Feel More confident, organized & consistent, educated on skincare

Pain Relievers: relieves stress, frustrations when selecting products, eliminates rushed decisions at the store, inconsistency, overspending

Screen Shot 2021-02-21 at 12.23.20 AM.png


Job Story

To back up the findings further I used the Jobs story framework as that allows you to focus on context instead of assumptions.

First I wanted to get a grasp on what the app’s overall job story is or why the user hires the app.

When selecting skin care products, User wants to make an informed decision

So that they can improve their skin and establish a consistent skincare routine.

Which makes them feel healthy, motivated and confident.

From there I focused on the specific feature story and the user’s intended outcome. By seeing a job in a specific context it allowed me to better determine the solution.

When following a skincare recommendation, User wants to have a personalized experience and a way to track their progress

So that they can improve their skin and feel motivated to be consistent with their routine while also staying within their budget.

MINIMUM VIABLE PRODUCT

Yes, we are so very close! I feel like you might have forgotten what my HMWs were, so to recap:

How might we provide guidance and recommendations specific to their skin needs?

How might we bring awareness and education on safe ingredients?

How might we help the user find products within their budget?


MVP

A Skincare App that acts as your personal Skincare assistant!


Feature 1: Face Scanner: This allows the user to scan their face, detecting pore size, dark spots, and other problem areas, which helps to define their skin type and a personalized regimen.

Feature 2: Face Diary: A ‘Face diary” where you submit a daily selfie and can insert notes. This will allow the user to track their skin’s progress

Feature 3: Products Guide: The user can enter or search for a favorite product and more affordable alternatives will be listed.

MVP-Product Market Fit

To ensure the app and its key features would be a good market fit I looked back at the Market Positioning map. By providing a personalized regimen with explanations as well as detailed product recommendations the app would cross into the intended blue ocean of a more personalized and educational skincare experience.


Screen Shot 2021-02-27 at 9.06.43 PM.png

User Flow

Now I was ready to start prototyping but first I needed to create a flow outline that would help me map out the User’s Happy Path, a scenario featuring no exceptions or error conditions.

I dividing the flows by feature tasks and onboarding:

•User flow for Onboarding of each feature + skin analysis

•Setting a goal/photo library feature

•Favorite products — affordable alternatives

•Appointment with coach (a requirement for this particular challenge)


Deliver


Now for the final phase - prototyping, testing, and finally creating the MVP!

Screen Shot 2021-03-17 at 8.00.32 PM.png

Lo-fi Prototype

I start with a lo-fi prototype, as it is quick, easy, and inexpensive. It allows you to get the product testable quickly for feedback to then improve and iterate the process.

I submitted the sketched prototype into Maze and had 8 testers.

Screen Shot 2021-02-25 at 9.36.56 PM.png

Lo-fi Prototype Usability Test

The overall results were based on 8 user tests:

•Average Misclick rate: 28%

•Average time (all tasks): 92 seconds

Main Takeaway: Consolidate the Onboarding as one user felt it was too many pages to click through.

Mid-Fi Prototype

The main takeaway from the results was from one tester who stated that she almost didn't see the checkmark that indicated the recording had started and stopped. Again, I wanted to keep it as native to the app as possible, so decided to just increase the size of the checkmark and moved it up towards the progress line.

Screen Shot 2021-03-17 at 7.57.28 PM.png
Screen Shot 2021-03-18 at 1.19.19 PM.png

Lo-fi Prototype & Usability Test

Based on 8 testers

  • Average Misclick rate: 23%

  • Average time (all tasks): 115 seconds

Main Takeaway: Time Slot Buttons are too small. Overall typography is too small. Consolidate text, where you can, specifically as some pages, are context heavy, however, have a ‘see more’ option.

Screen Shot 2021-03-18 at 1.01.39 PM.png

Visual Competitive Analysis

Visual benchmarking essentially is visual research that helps us start to break down mental models, patterns that work, as well as what we might want to avoid. It also helps to differentiate the brand visually from competitors. Per my research (mainly reviews) users found:

  • Most were too text Heavy (felt overwhelming)

  • Half recommend only certain brands of products (doesn’t inspire trust)

  • One user mentioned that one of the app’s “Scored skin” feature defeats the purpose of someone looking to improve their skin and already has insecurities. (definitely want to avoid that)

Brand Attributes

Brand attributes are characteristics that the audience sees as an inherent part of a brand. Brand attributes allow us to have a way to measure or validate if our designs are aligning with our attributes.

Based on the collected data, users want to feel positive, they want to feel natural and happy in their own skin. The brand needed to embody that and so the Brand attributes are: Joyful, Positive, Fresh, and Natural.

Screen Shot 2021-03-18 at 1.15.17 PM.png

Moodboard

The Moodboard helps to visualize and convey the feel of the brand attributes. It acts as a pillar to your design and guides you throughout the process.

I conducted 5 Desirability tests as well as presented the Moodboard to the class. To conduct a successful Desirability test, we would need to use a controlled vocabulary in order to truly learn the emotional impact of the design. Microsoft developed a reaction card that listed over 60 adjectives that represent a mix of descriptions that people might consider positive or negative.

Most felt the appointed brand attributes were reflected in the Moodboard having listed most of the attributes as well as synonyms.

Screen Shot 2021-02-28 at 10.02.04 PM.png

Style Tile

The Style tile help to push the design in a specific direction and provides a more concrete guide. Style Tiles consist of fonts, colors, and interface elements that communicate the essence of a visual brand.

Screen Shot 2021-02-28 at 10.04.42 PM.png

Style Tile Usability Test

After conducting 8 desirability tests, the main takeaway was the Logo.

To the left is the original logo, however, a tester believed the name was ‘How’ (which you can't unsee after it's mentioned). I then noticed that the ‘g’ had the same ascender height of the ‘l’ which made it confusing. The logo was then changed to the one on the right with a ‘g’ that had a more balanced ascender height.

Screen Shot 2021-02-28 at 10.12.46 PM.png

Atomic Design Inventory

I was now ready to create the Hi-Fi and created the design inventory which is crucial in creating a consistent design and allows to speed up the process by providing accelerators like components and variants.

Hi-Fi Prototype

Success & Failure Metrics

In order to measure the success of the feature, you need to implement and define success and failure metrics.

Success Metrics:

  • Increase in both DAU/MAU

  • New users

  • Good reviews

  • App downloads

Failure Metrics:

  • High churn rate

  • High misclick rates

  • Low or decline in DAU/MAU

  • Bad reviews

  • Low app downloads

  • Loading delays

Next Steps

• Usability Test the Hi-Fi prototype

  • Work on micro-interactions

  • Conduct additional research on any knowledge gaps

  • Work on remaining Must Haves, Should haves

KEY LEARNINGS

Research is King, but so is Usability Testing. I gained a new appreciation for testing during this challenge as it turned into valuable changes to the product. I do need to improve on prioritizing Figma organization to avoid design debt. I think with practice the balance will become easier to keep. I did create more components and variants this time around and was incredible as it definitely sped up the process.

Well, THANK YOU for reading through my design process for the ‘Wellness app’ challenge, I appreciate it and hope you enjoyed the read.

Any and all feedback and questions are welcome!


Take a look at my other Case Studies below!