Creating an e-commerce website using Experience and Visual Design.

About the Project
CMask is an organization that stepped up during the pandemic to start manufacturing and selling disposable medical masks to health providers and businesses. This organization needed an e-commerce site to market and sell products to potential customers across Canada.
My Roles & Responsibilities
Solo UI/UX Designer
  • Product strategy
  • UI/visual design
  • Prototyping
Length of the Project
1 Week
Challenges
  • Limited time frame to complete the project; was requested to not make mobile designs.
  • Since CMask was a new start up business, there was no historical data or customers.
  • No confirmed product photos or information, so I could not design the product details pages.
Work Process
User Research
Stakeholder Interviews | Sample Questions
  1. What is your company’s competitive advantages?
  2. Who is your target market?
  3. What is the main objectives of the website?
  4. What would be common questions asked by customers?
  5. What does success look like for the website? Metrics?
Design Brief
What are we building?
A website for the company Perfect Tec, who is selling medical face masks under the CMask brand.
What's the desired look & feel?
  • Professional and strong message.
  • Sharp and clean imagery.
Who's it for?
  1. Commercial or business users
  2. Wholesale resellers
What's the goal?
  • To tell people about the company.
  • To provide details about the masks.
  • To highlight the competitive advantages.
What are the deliverables?
  • UI Design: Desktop Website

Wireframes

Design Moodboard

Style Guide

High Fidelity Wireframes

Outcomes and Results

Once the prototype was finalized and approved, it was passed to the UI developer who built and launched the website.

350
Boxes sold per month
2000+
Number of site visits in the first year
7.28%
Conversion rate

Want to get in touch?

Email me at Jocelyn.KYK.Barron@outlook.com
LinkedIn