HabitAware

Designed a new mockup and prototype of the Shop All page for HabitAware's website.

Designed a new mockup and prototype of the Shop All page for HabitAware's website.

Yum homescreen shown on laptop with food out
Yum homescreen shown on laptop with food out
Yum homescreen shown on laptop with food out

Team

Team

Allie Keith

Chloe Dalbard

Fathumo Mohamed

Lauren Hoerr

Tyree Barnes

Allie Keith

Chloe Dalbard

Fathumo Mohamed

Lauren Hoerr

Tyree Barnes

Role

Role

User Researcher

UX Designer

UI Designer


User Researcher

UX Designer

UI Designer


Role

User Researcher

Visual Designer

Tools

Tools

Figma

FigJam

Figma

FigJam

Problem

Problem

Problem

HabitAware's current site does not communicate all of its product offerings well enough for customer's to understand the importance of purchasing each item in its product ecosystem (the products work in tandem with each other).

Solution

Solution

Solution

I redesigned and prototyped the Shop All page to educate customers on HabitAware's product offerings by including a side by side comparison of the product offerings.

I redesigned and prototyped the Shop All page to educate customers on HabitAware's product offerings by including a side by side comparison of the product offerings.

Process

Process

Process

Moderated Interview

We conducted an interview with the founder, Aneela, to gain insights into the problem customers were facing and other pain points in the buying process.



Moderated Interview Key Findings

HabitAware's most popular product is its bracelet sold on its own (not the bundled product). Customers are most likely in a later stage of their BFRB journey when purchasing a HabitAware product. Many customers are coming to HabitAware wanting to book training calls to set up their device, even though there is a pre-existing video walkthrough customers have access to.



Further Research

After, my team did a deep dive into the business and its surrounding landscape. This included looking into its main competitor, TrichStop, delving into other treatment methods for BFRBs, and digging into HabitAware's current site. We also built a customer experience map in order to understand the customer's buying process.

Moderated Interview

We conducted an interview with the founder, Aneela, to gain insights into the problem customers were facing and other pain points in the buying process.



Moderated Interview Key Findings

HabitAware's most popular product is its bracelet sold on its own (not the bundled product). Customers are most likely in a later stage of their BFRB journey when purchasing a HabitAware product. Many customers are coming to HabitAware wanting to book training calls to set up their device, even though there is a pre-existing video walkthrough customers have access to.



Further Research

After, my team did a deep dive into the business and its surrounding landscape. This included looking into its main competitor, TrichStop, delving into other treatment methods for BFRBs, and digging into HabitAware's current site. We also built a customer experience map in order to understand the customer's buying process.

Moderated Interview

We conducted an interview with the founder, Aneela, to gain insights into the problem customers were facing and other pain points in the buying process.



Moderated Interview Key Findings

HabitAware's most popular product is its bracelet sold on its own (not the bundled product). Customers are most likely in a later stage of their BFRB journey when purchasing a HabitAware product. Many customers are coming to HabitAware wanting to book training calls to set up their device, even though there is a pre-existing video walkthrough customers have access to.



Further Research

After, my team did a deep dive into the business and its surrounding landscape. This included looking into its main competitor, TrichStop, delving into other treatment methods for BFRBs, and digging into HabitAware's current site. We also built a customer experience map in order to understand the customer's buying process.

Yum homescreen shown on laptop with food out
Yum homescreen shown on laptop with food out
Yum homescreen shown on laptop with food out

My team's HabitAware Customer Journey Map

Further Research Key Findings

TrichStop's site is more digestible and easier to understand what their product is and how it works. BFRBs remain a rather unexplored research topic with cognitive behavioral therapy (CBT) being the "catch all" way to treat BFRBs. Consistency and confusion due to a lack of education were persistent issues within HabitAware's site.



Recommendations

Pulling our data together, each team member designed and prototyped one customer touchpoint. I updated the Shop All page to include a side-by-side comparison between products as well as a detailed list of each product's features. This gives customers more clarity around what each product offers, allowing them to easily identify the product that addresses their needs. For a full list of changes and the "why" behind them, see my design file with annotations (below).

Further Research Key Findings

TrichStop's site is more digestible and easier to understand what their product is and how it works. BFRBs remain a rather unexplored research topic with cognitive behavioral therapy (CBT) being the "catch all" way to treat BFRBs. Consistency and confusion due to a lack of education were persistent issues within HabitAware's site.



Recommendations

Pulling our data together, each team member designed and prototyped one customer touchpoint. I updated the Shop All page to include a side-by-side comparison between products as well as a detailed list of each product's features. This gives customers more clarity around what each product offers, allowing them to easily identify the product that addresses their needs. For a full list of changes and the "why" behind them, see my design file with annotations (below).

“It’s not just awareness, it’s how you use the awareness.”

“It’s not just awareness, it’s how you use the awareness.”

“It’s not just awareness, it’s how you use the awareness.”

Aneela, HabitAware founder when speaking about the HabitAware bracelet

My low fidelity wireframe of the Shop All page

My low fidelity wireframe of the Community product offerings

Reflection

Reflection

Reflection

What I Learned

Communication Is Key

The timeline for this project was insanely short with a 3 day turnaround for research, our experience map, and our interactive prototypes. This heightened the stakes, amping up the feelings on the team. When things got tense, we kept in communication with one another so that we understood how we were dividing tasks and working together towards the common goal. By doing this, we were able to complete everything within the timeline, if not have it ready for client an hour before the end of the day.

The timeline for this project was insanely short with a 3 day turnaround for research, our experience map, and our interactive prototypes. This heightened the stakes, amping up the feelings on the team. When things got tense, we kept in communication with one another so that we understood how we were dividing tasks and working together towards the common goal. By doing this, we were able to complete everything within the timeline, if not have it ready for client an hour before the end of the day.

Next Steps

Bring the Website Into 2024

Given that HabitAware is a tech company that helps people take control of their mental health, I would rebrand HabitAware to make it more modern and fresh with a warm, relatable feel, as opposed to the very sales-forward web pages. The website's current and only font is Montserrat, which is being used in a way that looks dated, and its current use of images are also outdated and not high quality. I would start by choosing a more modern font like Inter or Helvetica Neue. Then, I'd update the images/graphics throughout to make sure the most up-to-date phone/Macbook/etc are being used in mockups of the products. Down the road, I'd focus on changing the tone throughout to something more relatable and other brand-related updates.

Given that HabitAware is a tech company that helps people take control of their mental health, I would rebrand HabitAware to make it more modern and fresh with a warm, relatable feel, as opposed to the very sales-forward web pages. The website's current and only font is Montserrat, which is being used in a way that looks dated, and its current use of images are also outdated and not high quality. I would start by choosing a more modern font like Inter or Helvetica Neue. Then, I'd update the images/graphics throughout to make sure the most up-to-date phone/Macbook/etc are being used in mockups of the products. Down the road, I'd focus on changing the tone throughout to something more relatable and other brand-related updates.

Constraints

Limited Research + Data To Use

Due to the short turnaround time of the project, we were only able to hold one interview with a stakeholder. Thus, we weren't able to get answers to all of our questions, nor did we have enough time to understand the business and the products fully. We had to work with our limited understanding of the problem space and make decisions based on our limited scope.

Due to the short turnaround time of the project, we were only able to hold one interview with a stakeholder. Thus, we weren't able to get answers to all of our questions, nor did we have enough time to understand the business and the products fully. We had to work with our limited understanding of the problem space and make decisions based on our limited scope.

Next Up

St. Paul Public Works: Helping users find information around recycling and garbage more efficiently

Yum: a fast and speedy food and delivery system, saving people time grocery shopping or cooking

Come say hello!

Come say hello!

Come say hello!