Exhale Med Center
Exhale Med Center has been one of the most significant dispensaries serving the Los Angeles and West Hollywood communities. Having been a medical marijuana dispensary for a long time, they are now enthusiastic about making the transition to becoming a fully recreational cannabis dispensary by having an online presence through a fully functional E-commerce Website.
User Experience, User Interface
Platform: Responsive Website
Duration: 2 Weeks
2019
Challenge
Exhale Med Center offers a unique selection of cannabis products and attracts many foot traffic to its store in West Hollywood. However, the website is difficult to browse, navigate and lacks clear site messaging that leaves the user in confusion, frustration and doubting the efficiency and creditability of the website.
Goal
- To provide clear messaging of the website
- To have an easy and seamless browsing and navigation
- To have a hassle-free checkout process & offer delivery services
- To develop trust in users and make them comfortable sharing personal information like Driver’s License as per the law to buy cannabis online.
The Design Process
01. Discover
- Heuristic Evaluation
- Competitive & Comparative Analysis
- User Interview
- Task Analysis
Heuristic Analysis
The initial step of the process was researching the site to better familiarize myself with the site and its functionality through a heuristic analysis. I started the research process by analyzing the current website using Jakob Nielsen's usability heuristics. This provided general feature ideas for the redesign. The most severe problem had a direct effect on sales which needed to be the priority for redesigning.
As shown below the numbers highlight the problems on the existing website along with the heuristics violated as per severity stated respectively.
Competitive & Comparative Analysis
It was important to look at other cannabis websites & their features that most users expect to see when shopping for cannabis products online.
I noticed opportunities to implement robust search functionality & specific filtering categories that will actually be helpful to user searches. The checkout process including online payment and delivery service is something that is essential for an e-commerce website and should be implemented regardless. Also, product reviews, deals & discounts, and featured products are consistent throughout the competitors - it’s essential that I tie these into our platform as well.
User Interviews
With potential features in mind, I conducted 30 minutes of interviews with open-ended questions to identify patterns in their behavior and discover users’ pain points with a task analysis. Users were given a task to purchase a specific cannabis product from the existing website. These are some of the quotes from my user interviews.
“I would say the site, switching to weed maps got me super confused”
“I would probably try to like search for a promo code online somewhere.”
“If I'm going online then I will expect delivery.”
“I don't know if I can trust this website, I am already doubting the credibility of the website which is not a very good start.”
Task Analysis
After conducting user interviews and task analysis’, I wanted to better understand my users and what they valued and what motivated them. To synthesize this data I did 3 iterations of an affinity map with the 5 user interviews and came away with 5 actionable I statements.
Key Insights Summarised
Once I discovered the user insights, it was very easy to come up with relevant solutions. Keeping users, their needs and pain-points in mind below are few key insights summarised.
02. Define
User Persona
Customer Journey Map
Define Key Problems
User Flow
User Persona
After synthesizing the data in my affinity map I created a user persona Rachel Doherty, who represents the users interviewed, to understand users' needs and frustrations. This is my persona Rachel, she is a pastry chef that loves experimenting by adding cannabis to her pastries.
"If I am online shopping, I expect delivery!"
About
Rachel has a very busy life. She is a pastry chef working in a famous restaurant and manages two kids along with freelance side orders. This gets her very anxious, and cannabis helps her relax and release anxiety so she feels she can focus and calm down. She also likes to experiment by adding cannabis to pastries to consume as edibles. Occasionally, after the kids are asleep, both she and her husband like to indulge in her creations.
Needs
- Shop cannabis products online to save time.
- Discover new brands and explore trending products.
- Product Information and its effects before making a decision on buying cannabis.
- Find better deals or sign up for a membership to get discounts.
Getting products delivered to her door in an easy and hassle-free manner.
Frustrations
- Due to her busy schedule, Rachel does not have time to go to the store & shop.
- Rachel feels she cannot find information about cannabis products and their effects.
- Constantly experimenting with new cannabis-infused edibles, Rachel spends a lot of money on buying cannabis products and feels it is really overpriced.
Customer Journey Map
So, looking at Rachel's Customer Journey map on buying cannabis online, we see that she has many pain points and frustration in her experience. Some of which include the menu page and search are not working. There is also lot of ambiguity and confusion in switching from the main site to a third party website, followed by no delivery service and no online payment, which makes Rachel leave the site annoyed and frustrated.
User Flow
User flow displays the complete path a user takes when using a product. The old user flow as shown below lays out Rachel's movement through the product, mapping out each and every step she took — from entry point right through to the final interaction. You can see that the orange color represents the existing website and green color represents the third party website. There is no way Rachel can go back to the existing website after she is switched to the third party website.
The new user flow shows Rachel's flow of activities on the same current website from the start to end. Here, the steps taken by Rachel to complete the task look seamless and the end of the step takes you back to shopping online.
Scenario
After a long and stressful day, Rachel finally managed to put her kids to sleep. Her best friend from college, Jess, is planning to come for a visit, and arrives tomorrow morning. She knows Jess loves her “Special Brownies”, but realizes she’s out of CBD products. She wants to create something great, but she can’t go to her local dispensary and leave the kids unattended. She needs her products delivered to her doorstep as soon as possible so she can bake her brownies before Jess arrives.
Problem Statement
Rachel a busy working mother, feels stressed about baking her "special brownies" before her friend arrives tomorrow and needs to have her CBD products delivered to her home, but is confused by the websites browsing and is frustrated as she finds out only after reaching the checkout page that she can't actually get her items delivered; they only offer pick up and is cash only.
So, How might we help Rachel find the products she is looking for and have them delivered to her doorstep?
3. Ideate
- Feature Prioritisation
Information Architecture
Site Map
Feature Prioritization
To begin the ideating design solution, I brainstormed all of the features that would solve Rachel’s problem and prioritized through the potential features. I classified them according to priorities using the Moscow Methodology.
Information Architecture
Based on the card sorting results, I prioritized the categories that users were more interested in and deprioritized other lists. The users understood the breakdown of strains into - Sativa, Hybrid and Indica and Product categories that helped information of a solid structure for the information architecture.
Site Map
To begin ideating design solution, I brainstormed all of the features that would solve Rachel’s problem, and site through the potential features.
4. Design
Low Fidelity Wireframe & User Tests
Mid to High-Fidelity Wireframe
Style Guide
Mockup
Sketches & Whiteboarding
After synthesizing our research data from user interviews and task analysis, we began to sketch screen layouts. The user’s main goals are to browse and filter products to have a seamless checkout with the option of paying online.
Low Fidelity Wireframes & User Tests
I started making paper prototypes to conduct usability tests. Paper prototypes were used to validate the features that I had ideated. These were the key features that users thought were useful to them.
Key Insights on Paper Prototype
During my research, I discovered that users connect visually faster than text, and keeping this in mind, I experimented with the faceted navigation and had it appear on the products page upfront rather than being placed in the corner or at the side. Visually appealing, the users seamlessly navigated through the products page and my experiment was a success.
Mid-Fidelity Clickable Prototype Usability Test
After receiving valuable feedback on my paper prototypes I moved to creating Mid fidelity wireframes and got my first clickable prototype. I conducted 4 usability tests to make sure the flow made sense. I made the clickable prototype on the InVision app for the I-pad screen.
High Fidelity Mockup
Based on the brand guidelines, I built the final design as the high fidelity mockup.
© Kanchan Gaur 2020
+ 1 (323) 791 3330
kanchangaur1986@gmail.com
LinkedIn