Responsive Website for Pyro Extracts, A Canadian Craft Cannabis Company
Pyro Extracts is a Craft Cannabis Company, based in British Columbia, Canada.
Pyro Extracts provides dynamic enthusiasts with the highest grade cannabis extracts and vaporizers. The Pyro Vaporizer is a handy product and distinguishes itself because of its size and portability. The brand symbolizes movement, transformative exploration and discovery which is why it is represented through the theme of the great Canadian outdoors.
Website and e-commerce redesign for consumers & wholesalers, which:
Showcase the Pyro Vaporizer and its hardware, size etc.
Showcase the latest products and bestsellers
Show products / flavours
Visual concept for different flavours
Include links where consumers can buy the product
Allow readers to sign up to the newsletter
Showcase Instagram feed
Search through content
Design for responsive web, desktop screens as well as mobile screens.
Females and males, age 19 to 45
Visual mockups on desktop and mobile for
Competitors play an important role in sustaining the growth of the beauty industry, especially in Korea. As we are selling our products in Canada, the main competitors for Korean Skincare products are Soko Glam, Glow Recipes, Dr. Jart+, Laneige and Tatcha, (Tatcha, Japanese beauty products).
The competitor's websites are well developed and are easy to navigate. What makes Kiseu stand out from their competitors is the focus on the skincare spa & ritual every day and night.
Modern consumers expect to find answers to their questions quick and without having to do an in-depth research. I began my research journey by looking at competitors and interviewing people. The target users were females between 18 years and 35 years in Canada and Europe. The goal was to find out the consumer pain points and their needs from a beauty brand/ online shop. Here are some of the main pain points that crystalized from my research:
confusing website navigation
doing a lot of online research for skincare ingredients
multi-channel online shopping
difficult or unserious check-out process
tracking of delivery
I created a user persona to design the website for. This way we can achieve a better understanding of the user's needs and design accordingly.
Location Vancouver, BC
Occupation Sales Manager
Alice is a young woman in her late-twenties. She lives and works in Vancouver as a Sales Manager with a yearly income of $50,000. She cares about her appearance and is always looking for the right product with good ingredients. She finds it difficult to research for all the ingredients and how to use them in the right order on different blogs and websites. It takes a lot of time because the market is overwhelmed, which frustrates her.
Looks for good ingredients for her skin type
Hopes to find all products (Cleanser, Toner, Serum etc.) in one company
Not be able to find ingredients and description
- Doesn't want to spend a lot of time on different blogs and websites
In the next step I tried to find solutions for all those online shopping pain points and came up with the following features:
Simple and clean looking navigation before entering the shop page (filter by skin concern, skin type etc.)
Including an ingredient glossary on the website to make it easy to find out more details about the ingredients without researching on other websites
Useful tool for the skincare ritual (including the right order, when and how to use, link to ingredients, link to product)
Clean and simple look for check-out und ordering process
Responsive design for multi-channel online shopping
Links on product pages to useful articles about the product
For a better understanding I created the information architecture which defines the overarching structure and relationship between all areas of the site.
I started off the prototyping journey by sketching out ideas on how I visualised the individual pages would look like. I drew out the main screens and tested it with users to find out how to make the prototype best for them. Here are some final paper prototypes:
After testing the paper prototypes, I started finalizing the prototype in Adobe XD for a better visualization and tested it again.
Final website design