Lazada Payment Process
UX UI design
My Design Process:
Walk-through and analysis
Interview and Shadowing Session
In Singapore, revenue in the e-commerce market is projected to reach USD $2,793 million in 2021 according to Statista, the rate of revenue growth continuously increasing each year. There’s over 2.9m users in e-commerce market in Singapore and continuously increase, 47% e-commerce transaction completed on laptop/desktop.
According to Smart Insights — the global average conversion rate on desktop device is 2.59%.
What stops user to make purchase and what motivates them to make payment?
How can a smooth check out flow help with conversion rate?
The objective is to optimize the UI of existing check out flow for frequent users, to improve user efficiency while helps to boost lazada's conversion rate and enhance the product experience.
After experiencing the complete checkout flow of Lazada for few times I found few existing problems on UI:
Vision hierarchy is not clear enough
User flow can be smoother
Lack of emotional design and human touch
Pending for payment is very hidden and user receives no alert, which cause high order abandon rate
Content imbalance for some pages
From product walk through and user flow diagram we can see the check out flow is logical, user can finish transaction in no more than 6 Pages / minimum 5 clicks, which is reasonable and fair, yet many improvement can be done on page details.
According to these the primary problem findings I made some assumptions:
Strong ui and visual hierarchy will affect user’s decision of purchase
A short and easy check out flow is more effective for all users
Brand identity (platform identity) is important, to increase brand identity exposure will increase user loyalty so that to boost up conversion rate
Add to cart / buy now btn should be the most convince btn to click on at anytime
User is more likely to use a platform which is more ‘human’
According to these assumptions I drafted an interview brief and shadowing 3 users who always/have been shop on Lazada to prove my assumption.
Pain Points and Needs
Insights & Summary
Therefore, the problem to be solved in this project is:
1. to solve the problem that users think the information hierarchy on UI is messy;
2. to solve the problem that users do not have a high perception of the brand;
3. to solve the problem that users find the UI style is not consistent.
4. Try to simplify the whole check out flow
Through function walk through + interview, some of the assumptions have been proved, I also found some new user habits and insights, such as
There are a lot of ads on other media/social platform, but the website as a whole does not have the ambience, there is no consistent art direction
The user loyalty to platform is not high
Users are most concerned about the price of the product, whether the seller is reliable, shipping costs and shipping time
I started with the first step in flow for redesign, a search result page that provides a lot of useful information for the user to select the desired product.
In the original design, the information are scattered and unfocused, making the overall UI look loose and inefficient. So in redesign I have unified the brand colours on the page and grouped elements for each cards.
The product details page also has a problem with an unclear information hierarchy and too much white space there, so in redesign I removed the right column about shipping info (relevant information will be displayed at checkout step) and rearranged the layout of information. For additional information such as ratings and feedbacks I used tabs to make the information easier to find and read.
Also redesigned the logging pop-up window just because I found it not done in a right way..
In the final step of the flow, I think it is possible to simplify the two original steps: place order and payment into one step, reducing the number of user clicks while communicating the information to the user more efficiently through the rearrange information, where the user can know all the details about their order in the same page.
What I’ve done:
Consistent ui design with more branding exposure and higher space utilisation;
Created clearer visual hierarchy;
Simplified check out flow.
It’s a detail-oriented project while I need to look at the big picture, to redesign the whole process from both aesthetic and function view.
In addition to those redesigns, I also noticed some interesting details during the design process, which left for more in-depth research and improvement in the future, such as:
Facing different users (new users vs. existing users) and different user flows, what can we help them with a hassle-free shopping process;
Noticed that lazada has their own mascot but not seem to be used frequently, what can we do with it to add more human touch to an e-commerce platform;
More and more e-commerce transaction are completed on mobile devices, what can design help to make web-based online shopping experience better?