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.
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
Deliverables
Deliverables
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.
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.
