top of page

E-commerce Website

for  Skincare

prio_dektop_mockup.png

Project Overview

PRIO skincare sought help developing a luxury product line and eCommerce website that reflected its high-quality CBD Skincare products. They needed a comprehensive solution to create a strategic, cost-effective way to launch their products to the market. The target audience is mostly women between the age of 20 -55.

 

CLIENT

PRIO 

MY ROLE

Research

UX Design
UI Design

Packaging Design

Testing

SUMMARY

We created a flexible website with a  progressive deign and highly customizable  e-Commerce system which includes subscription services, review & wholesale, etc. We created a clean design to reflect their own products’ value: minimalist, yet high quality. It’s built to scale from the few products they have at launch to ten thousands of products across different future product categories while still maintain the same simplicity from a user's perspective.

Competitor Analysis

In order to better understand this industry and find out where the product currently fit within the market, I conducted a competitor analysis. By identifying competitor strenghts and weaknesses, I was able to better define Prio's value proposition.

comp_prio.jpg
Problem
  • The company needed a new ecommerce website to sell their organic high-end line of luxurious skincare CBD skincare products. 

  • The main goal was to improve organic website visibility, user experience and organic visitors within 4-6 months time. 

  • Implement a fully responsive solution backed by WordPress CMS and WooCommerce for cart functionality.

Solution
  • Improve overall site aesthetic and user experience in order to create a more engaging experience.

  • Create a highly usable, searchable and browseable product catalog with easy social sharing options and clear conversion points to contact for a quote.

  • Develop a more SEO friendly and socially-focused blog in order to drive user engagement and organic searches. 

  • Introduce limited and custom eCommerce website options for specific products.

  • Implement a fully responsive solution backed by WordPress CMS and WooCommerce for cart functionality

User Interviews and Surveys

I conducted 5 user interview & an online survey to further understand user motivation and behavior. Out of all the female respondents,  62% were in their 20s and 30s, and 34% were in their 40s to late 50s. These ages seemed to be a fair representative sample of Prio customer base. The survey asked respondents questions about their Skin care, CBD Product and website use.

Findings:

• Consumers crave personalized experiences. Simply putting someone’s name in a subject line increases the odds they’ll open the email by more than 20%.

• Reasons for not preferring in-store shopping; in-store advertising is overwhelming and the store consultants don’t really care about recommending the right products and are most focused on making a commission from the sale.

• Get detailed information about the recommended products with transparency about the ingredients used.

• Participants are overwhelmed by the numerous choices available.

• Participants needed to be educated about CBD in skincare.

pri0_diagram.jpg

Who are we really designing this website for? I created a user persona to put a face on Prio's target user and visualize various aspects of their behavior and motivations. This persona was roughly based on the users interviewed during the usability testing.

User Persona
perona.jpg
Empathy Map
IMG_9699.heic
Pain

She has a very busy schedule.

She has no time for skincare.

Too many options to choose from.

She wants to use organic skincare.

Gain

Prio Skincare is an organic product.

Subscription service-Delivered monthly, bi-monthly, direct to your mailbox. 

Very light on your skin.

prio_journey-map.jpg
Project goals

Project goals were established early on in the design process based on all research findings. This included technical considerations to help achieve realistic outcomes that align for both the business and its users.

goals.jpg
Design
User Flow
Site Map
pri0_diagram.jpg
Wireframe

Created wireframes for desktop and tablet screens. Through the wireframes, I was able to design user flows, navigation, and interactions. The wireframes were annotated for clarity and technical details.

prio_wireframe.png
High Fidelity

The account page shows the perks of becoming a PRIO member. The product page gives all the details about the product, includes CBD benefits and key ingredients The light background, balanced and thoughtful use of negative space, instantly noticeable CTA button, and highly readable font create the solid visual hierarchy of the page and make it easy to scan and interact with.

prio_account.jpg
home.jpg
Hand Sanitizer.jpg
bottom of page