My approach was identifying and filling the gaps in the digital shopping journey by utilizing competitive analysis, user research and interviews to analyze Tokyo Smoke's cannabis purchasing habits.
How can we boost online shopping traffic for cannabis products?
Focus
B2C Website
Role
UX/UI
iOS Mobile
Platform
Project Type
Responsive Web Design
July 2023
Date
Project Summary
Tokyo Smoke is a leading Canadian cannabis retailer. Although they offer immersive in-boutique experiences and thoughtfully crafted products, their current website lacks easy navigation and mobile or tablet versions, missing out on many shoppers who prefer the ease of shopping at their fingertips.
In this project, I redesigned Tokyo Smoke's website to better accommodate the needs of online shoppers and drive sales for this regional business.
Understanding shopper habits, evaluating the competition.
For the redesign of Tokyo Smoke's website for mobile and tablet use, I focused on understanding shopper behaviors and analyzing competitors. By interviewing cannabis consumers, I gained insights into individual shopping habits and preferences, revealing that Eaze and Weedmaps are the most popular mobile applications. I explored these platforms to observe shopper interactions, identifying key features and user experiences that appeal to consumers.
SOLUTION
Redesign the website to enhance accessibility and improve the shopping experience in mobile and tablet versions while restructuring its information architecture to encourage repeat business.
Discover
RESEARCH
GOAL
I wanted to find out what online shoppers expect out of an e-commerce website.
OBJECTIVES
-
Determine features users tend to like about Tokyo Smoke
-
Investigate how users navigate the Tokyo Smoke site
-
See what users find lacking and what they find attractive about the current website
-
Determine strengths and weaknesses of competitors
-
Look into how many users use the shopping versus educational sections
METHODS
-
Secondary Research
-
Competitive Analysis
-
User Interviews
-
Heuristic Evaluation
USER INTERVIEWS
AFFINITY MAP INSIGHTS
.png)
.png)
.png)
.png)
Common themes:
-
Infrequent consumption
-
Regular shopping intervals (monthly or every 2-3 weeks)
-
Preference for in-store shopping and mobile delivery
-
Use cannabis for recreational and medicinal purposes
-
Issues with redundant navigation and confusing content; desire for better search and filter options
LOGISTICS
-
4 research participants
-
30 year olds
-
All frequent online shoppers
-
Remote interviews
"For me, it's both. I suffer from Crohn's disease, and one thing that alleviates a lot of the symptoms I experience is with marijuana. And it definitely helps relax a lot of the pain I feel but at the same time, I also enjoy consuming it on a recreational basis."
.png)
PROBLEM
The website struggles with information overload, disorganization, poor filtering features, and a user-unfriendly layout that hinders navigation, coupled with the lack of responsive devices.
FINDINGS
SECONDARY RESEARCH
HEURISTIC EVALUATION
-
Overwhelming navigation bar
-
Lack of hierarchy
-
Excessive iconography
-
Confusing filtering
-
Disorganized content
Why craft cannabis boutiques remain viable:
-
Established a strong brand presence and engages with its community effectively
-
Diverse range of high-quality cannabis products and accessories
-
Seamless integration between physical and online shopping experience
Successful e-commerce websites have:
-
user-friendly designs
-
responsive deisngs for mobile and tablet
-
high quality visuals and descriptions
-
effective search and filter functionality
-
seamless checkout process
-
incentive-based reward offers
Define
I stayed true to Tokyo Smoke's brand personality, maintaining its modern, refined, approachable, and inclusive feel. Trustworthiness and transparency were key in every design choice. I updated the landing page carousel to highlight the brand's capsule products, member loyalty program and recently newly launched products. To improve the online shopping experience, I simplified the iconography and product details. I also made filtering more intuitive by introducing simplified options and icons, making it easier for shoppers to find what they need effortlessly.
BRANDING
USABILITY TESTING
GOAL
I wanted to know whether or not users could successfully complete two key task flows using the redesigned website.
Task Flow 1: Rate Product and Join Members Club
-
Select 2-star rating for the given cannabis flower
-
Select 1-tag for the effect and the "Focused" tag for experience
You will be up-sold on their rewards program, Hi Rollers Club
-
Join 'Hi Rollers Club'
-
Proceed to see your total reward points at the end
Task Flow 2: Filter and Add to Cart
-
You want to filter for specific type of cannabis products
-
Go to 'Shop'
-
Filter for either 'Strength=medium', 'Strain=sativa', or 'Effects=mind&body'
-
Add to shopping cart
Overall summary specs of user participants for..
.png)
Asked user participants their experience testing
USABILITY DEBRIEF
Task Flow 1: Rate Product and Join Members Club
Task Flow 2: Filter and Add to Cart
ITERATIONS
LANDING PAGE
Based on surveys and user feedback, a more comprehensive landing page was created with the addition of a mobile version. Click on the below to see redesigned responsive landing page.
RATE PRODUCT
To provide shoppers with more insight on product effects and customer experience, the option to 'rate products' was integrated into the redesign
.png)
TOTAL REWARD POINTS
Customers were incentivized to join a free membership loyalty program offering customers with discounts and offers with every product purchased and reviewed
.png)
FILTER & POP-UP
In order to make filtering products accessible to the user at any time while they are shopping, I made the filter pop-up from the left hand side of the view screen so it stands out.
Design
REFLECTION
KEY INSIGHTS
PROTOTYPE
-
Couple of users mentioned including a section where products that were rated have review comments which could be helpful when leaving a rating
-
Might be useful to add recommendations at the bottom of the checkout panel to up sell
-
Suggested to have checkboxes for user to select multiple options. Links are usually used to navigate to another place- not used to select something.
Test
Final Design
POV Statements
What is the problem?
Tokyo Smoke customers need a way a view the brand's products online easily because they do not always have time to visit the
retail store.
I would like to explore ways for Tokyo Smoke customers to shop online and via mobile for cannabis because shopping in-store can be time-consuming and inconvenient.
Who is the user?
Meet the Creative Cannabis Consumer
Goals:
-
Wants to purchase cannabis online
-
Wants to support Tokyo Smoke
Needs:
-
Ability to search for specific cannabis products
-
Ability to filter and sort
-
Wider arrange of cannabis product brands
-
Detailed product descriptions
-
Quick and easy checkout process
IDEATION
SITE MAP
Click on image below to view original Tokyo Smoke desktop sitemap and reiterated sitemap upon defining user needs
USER I TASK FLOWS
Based on valuable insights from my user interviews, I designed this user flow to boost engagement and loyalty through an enticing reward points system. By making it easy for users to leave reviews and earn rewards, I aim to inspire active participation and foster a sense of appreciation and connection within the Tokyo Smoke community.
View User Flow
WIREFRAMES
Based on the feedback from my low-fidelity wireframes, I refined the most successful designs into mid-fidelity prototypes. This process solidified my vision for the website, enabling me to focus on both its visual appeal and user interaction.
