UX optimization
Introduction
Background:
This Martech startup aimed to manage an e-commerce website to gather data on customers’ behaviour and interests for recommending their business clients to set up the selling points and marketing strategy.
I joined the team to optimize the user experience of the e-commerce website. I and another designer cooperated to optimize the interface and experience of the e-commerce website.
Team members:
UI/UX Designer *2
Product Manager *1
Front-end Engineer *2
Back-end Engineer *2
Marketing team members *3
About the
e-commerce website:
We sold vegetable boxes for customers who might not have time to choose and prepare groceries, so we provided high-quality, fresh, versatile vegetable boxes for them who could easily order different sets from our website and receive vegetable boxes in a few days.
The approach
Firstly, the marketing team posted product ads to target groups on Facebook, and then customers could click the ads and link to the product landing page.
When customers landed on the product page, we designed the product content according to three topics, such as trust, product and brand. For instance, the topic of trust focused on how to let customers know more about the benefits of having vegetables.
From the landing page to complete the purchase, we have set tracking codes to collect data on the users' behaviour and interests, so we could know more about what kind of subjects might attract them, or the statistics of the purchase funnel.
(The interface was designed by another designer)
Problem:
0.08%
total conversion rate
When we analysed Google Analytics, we found that the percentage of the conversion rate was around 0.08%, which was a bad performance for the e-commerce business. Therefore, the marketing and design team discussed the problem and tried to find solutions.
%20Medium.png)
Factor Identification:
Firstly, we discussed the 4P, and 4C to know more about the product, persona and how customers interact with us to find the factors that might affect the conversion rate.
Fresh, organic, and versatile vegetable boxes.
We focused on 2 groups of target audiences:
White-collar, aged 25 to 35
-
would like to try healthy diets and cook different recipes
-
but had less knowledge of healthy food
-
did not want to spend time on grocery shopping after getting off work.
Housewives, aged 30 to 45
-
would like to shop at the premium supermarket.
-
always bought organic, and fresh vegetables.
-
needed to prepare food for more than 3 people in the family.
From the analysis, we had to evaluate the priority and development resources to decide the optimization goal. So, based on the 4P and 4C, we found that we could not change the product, the marketing team has reached more than ten thousand customers a month and has provided a huge amount of discounts for the products.
About the convenience topic, this might directly affect customers' satisfaction, and the development resources were relatively lower than other topics. Therefore, we thought that how might we optimize the process and the user experience in advance.
Marketing funnel analysis:
We reviewed the marketing funnel with Google Analytics and the user flow from customers clicking the ads on Facebook to completing the purchase.
Dropped
77%
of potential customers
We found that we dropped around 77% of potential customers, who would like to check out their products, during the registration process.
Process Review:
As with the original process on the right side, users needed to go through 6 steps to complete the registration process. It was a tedious process that customers were not able to easily purchase their products.
Also, users were interrupted by 2 steps that they were redirected to the homepage to log in and had to go to the mailbox for email verification at the fourth and fifth steps.
Redirect users to the homepage
At 04. Log in step, they were redirected to the homepage to log in to the account. This step interrupted users to proceed to checkout products.
Let users leave the website
At 05. Email verification step, they needed to jump to another browser or app to verify the email address. This step increased the possibility of abandoned carts due to users could not directly check out their products.
Original process
01
Adding product to cart
Customers can select the products and add them to the shopping cart.
02
Checking shopping cart
Customers can check products and quantities before clicking the "Checkout" button.
03
Registration
Before checkout, they need to fill in the details for registering the account.
04
Log in
They will be redirected to the homepage to log in to the account.
05
Email verification
After logging in to the account, they need to go to the email box to verify the email address.
06
Checkout process
Finally, customers can proceed to fill in the ordering details and make the payment.
Pain points:
From the process review, there were too many steps for registration, and customers needed to leave the checkout process to log in and verify email.
So, we organized 2 main factors that might have caused the potential customers to leave the registration process before checkout.
MUST register an account
before checkout
Users had to fill in their details to register an account, otherwise, they could not proceed to the checkout process
Customers were interrupted by
registration and email verification
After users filled in the details, they had to log in to the account and verify their email address. Therefore, users had to jump to other pages or browsers to complete the registration.
Solutions:
According to the discussion above, we decided to optimize the checkout process with different user flows. I also viewed the Nielsen & Norman group for reference of the user experience optimization.
Checkout as a guest
Users won’t need to fill in any details for registration, they could directly go to checkout the products after providing ordering information.
Reference:
Don't Force Users to Register Before They Can Buy
Automatic registration
We will automatically register the account from the ordering details of the email and phone number as the account and password.
Reference:
A Checklist for Registration and Login Forms on Mobile
New user flow:
The new user flow is as below, when customers click the "Checkout" button on the shopping cart page, they can directly fill in the ordering form and make the payment without the registration and email verification.
01
Adding product to cart
Customers can select the products and add them to the shopping cart.
02
Checking shopping cart
Customers can check products and quantities before clicking the "Checkout" button.
03
Checkout process
Customershey can directly fill in the ordering form and make the payment without the registration and email verification.
It is the first step in the checkout process, customers can directly fill in the ordering information and delivery details. We will automatically set the email and phone number as the account and password.
(The interface was designed by another designer)
New checkout process:
Result:
Increased
total conversion rate
The new process operated for around 1~2 months, and the conversion rate was increased.
However, we did not utilize AB testing or other methods for comparing the optimization result, so the increment of conversion rate might not be able to reflect the improvement of the process optimization.