YOOTH
Conversion rate and shopping experience for online skincare
MY ROLE: UX Researcher - UX/UI Designer
TIMELINE: 4 weeks
OVERVIEW
BACKGROUND
Consumers that take their skincare seriously are choosy and want top of the line products with the best ingredients, so they research to ensure the products are designed precisely for their skin concerns. They demand high standard skincare to protect them from low-quality skin.
BUSINESS GOAL
Yooth, an online skincare retailer, needs to improve their conversion rate from skincare browsing to checkout completion in order to increase product usability and revenue on their e-commerce website. The online skincare shopping needs to make the user feel secure and at ease during their browsing experience, which will lead to a decision on a skincare product and, ultimately, a completed purchase.
Data shows that:
50% of users abandon the site without moving any items into the cart because they’re unable to determine which product is best for their skin type.
70% of users abandon the cart at checkout because they are required to create an account.
TARGET USER
Women who take skincare seriously
Between 28 and 58 years of age
High income earners
CONSTRAINTS
90 hours to complete the project
1 low fidelity deliverable, 1 high fidelity deliverable, and 2 rounds of user testing
THE SOLUTION
Adding time-saving features like a skincare quiz for users who don’t know what their skin needs, a shop for concern option on the homepage tailored with specific products for the most common skin issues, and guest-checkout to allow users to complete a purchase efficiently and decrease the likelihood of users abandoning the website.
Shop for Concern
Skincare Quiz
Guest Checkout
PROJECT PLAN
STAYING ON TRACK
Having such a tight timeline made it essential to create a project plan to ensure everything was completed on time.
SECONDARY RESEARCH
COMPETITIVE ANALYSIS
To help me find what features to add to my design, what patterns to use for the best interaction, and how to measure the success of the design based on established metrics, I conducted a competitive analysis to learn from the flow of three leading e-commerce sites.
Top features leading skincare e-commerce use to incentivize a purchase:
PRIMARY RESEARCH
USER INTERVIEWS
I conducted 5 user interviews to understand the needs of the user and their behavior toward purchasing skincare products online.
Three areas I focused my research on in order to make informed design decisions while improving the Yooth skincare website:
How do customers choose the right skin care products?
What product attributes are the key points to consider when choosing skin care products?
What are the best UX practices for facilitating an optimal and smooth purchase experience?
TOP 6 FACTORS UNCOVERED
100%
of participants choose products for their skin:
5 out of 5 - by key ingredients
5 out of 5 - by product highlights
5 out of 5 - by what skincare problem the product targets
90%
of participants spend money on skincare:
5 out of 5 - to address a specific skin concern
4 out of 5 - as a skincare regimen / self care
100%
of participant’s main consideration to determine product effectiveness:
5 out of 5 - active ingredients & how they perform
90%
of buyers look for / are guided by:
5 out of 5 - Product reviews
4 out of 5 - Reasonable price
4 out of 5 - Quality ingredients
80%
of buyers factor into a purchase decision:
4 out of 5 - free shipping & returns
4 out of 5 - free samples
4 out of 5 - special deals & promotions
80%
Checkout experience:
4 out of 5 - prefer guest checkout
5 out of 5 - would sign up for an account given opportunity to save money through rewards program or subscription with a discount
Key Takeaways from User Interviews. Click for full transcripts
“It’s annoying to have to create an account just to buy something I like, especially when I'm pressed for time.”
USER PERSONA
TARGET AUDIENCE
As Yooth is an expert and leader in the beauty brand and cosmetics space, I used the data from the research to put together a user persona to help better understand their user base and shift my design thinking onto real users who seek quality cosmetics and are knowledgeable about their skin care.
USER FLOW
SHOP BY CONCERN
After researching users’ skincare approaches in terms of how they design their routine, I discovered that understanding the user’s skin type and potential skin concerns were regarded as non-negotiable for any skincare purchase decision, so I focused on tailoring the main flow to the user’s specific skincare needs.
Because many skincare customers go into product shopping knowing what their skin issues and goals are, personalizing the solution to the user in an organized content would be crucial to a simple and logical navigation to reinforce customer retention.
WIREFRAMES
Product Page
Homepage
Checkout
STYLE GUIDE
HIGH-FIDELITY MOCKUPS
Following the design guide, I developed high-fidelity prototypes for my website using the wireframes and notes from the wireframes usability testing.
PROTOTYPE
USER TESTING
Two rounds of user testing were carried out with a total of ten participants: the first using wireframes, and the second with high-fidelity mockups that were revised based on the wireframe testing.
The purpose of testing was to determine if users could
successfully complete a skincare purchase
add it to their cart
and pay as a guest
Furthermore, to evaluate if users enjoyed the website’s user interface.
10/10
HOMEPAGE:
All users stated that the site was appealing and provided a clear picture of what the brand offers.
10/10
PRODUCT PAGE:
All users found that the product page provided enough details and information to make a purchasing choice with confidence.
10/10
CHECKOUT:
The checkout process was described as simple, straightforward, and efficient by all users.
10/10
SKINCARE QUIZ:
All users knew to click on the skincare quiz to identify the right products for their skin issues.
Testing was successful. All of the users where able to complete the tasks successfully; however, during the wireframe testing I discovered a small issue to be resolved in the next iteration to improve the look and functionality of the Yooth website.
Purchase Button Iteration
The following is the test finding after gathering user insight of the minor issue that, when modified, helped to improve the experience even more.
Minor Issue
One Major Improvement
As most users preferred the '“Add to” language to make a purchase, I changed the “Buy Now” button to “ADD TO BAG'' and replaced “Add to Cart” with a “Product Details” to eliminate confusion.
Solution
REFLEXIONS
I appreciated the challenge of achieving Yooth’s business goals with the data provided and the time constraints, and I was pleased to get positive feedback from users regarding the website’s functionality and simple yet attractive design. In future revisions of the Yooth website, I’d like to look into more methods to tailor the experience to a broader range of users.
NEXT STEPS
Creating MVPs that motivate users to complete their user journeys was an excellent way to understand, via extensive research, that users actions can have a wide range of impacts. Using time saving features, on the other hand, can inspire a buyer to proceed to the next step. This project gave me a great platform to become acquainted with and explore existing patterns in e-commerce before attempting to come up with design solutions