The Challenge

The Home Page is the first touchpoint of an e-commerce platform, making it a very important feature as it impacts GMV directly. Currently, the click rate performance of each module on the Shopee Home Page is assumed to not be good enough.

As a UI/UX designer, I am tasked to redesign the Shopee Home Page for the 6+1 greater SEA region (Indonesia, Taiwan, Thailand, Vietnam, Malaysia, Singapore, and Philippines) to improve the performance of the overall click rate based on my experience and the limited information provided.

Design Process

Despite the limited time to work on this project, I wanted to prioritise user research in order to understand what is important to users. Findings from the user studies will influence the final hi-fidelity prototype for this design test. As such, the design process I have decided to work with is Discover, Define, Design.

Design Process

Understanding the Current Shopee App

Shopee first started as a consumer-to-consumer (C2C) marketplace but has since moved into a C2C and business-to-consumer (B2C) hybrid model. Because of the C2C model, credibility should be emphasised. When it is B2C, this has to be communicated clearly as well – the user should know that it is an official store.

My heuristic evaluation and thoughts regarding my exploration of the current home page can be seen on the right. From personal experience, I think one of the reasons why some may find the home page overwhelming is due to the need to use memory. I could not remember where all the different sections on the home screen were. I had to keep scrolling to find the section I was looking for. This was the same with the icons at the top. I didn’t even know what some of the icons were for.

Right off the bat, I noticed a lot of sections that were interesting, but I was not interested in as a consumer. I never indicated an interest in group buying the products listed, nor in digital products, or in the collections being shown. This lead me to wonder how I could design a more personalised shopping experience and streamline the information and sections shown. I wanted to maintain the exciting bazaar-like atmosphere in the design but I also didn’t want the screen to be cluttered. I want users to be engaged on the platform, to keep the customers’ attention in order to keep their business.

Heuristic Evaluation

User Interview and Usability Testing

To see if the issues I faced were not just based on my own preferences, I conducted user interviews and usability testing with 2 other users from different demographics. Both are frequent online shoppers (purchase something at least once every month).

User 1: Male, 25, Final-Year Undergraduate
User 2: Female, 51, Housewife

Since this design test was about improving the click rate of the home tab elements, I observed the way the users browsed the home page and noted their think-aloud thoughts. Subsequently, I asked them to perform 2 tasks:

1. Look for a Rode Wireless GO II Microphone
2. Look for a facial cleanser of your choice

Affinity Mapping

Define

With a clearer understanding and empathy for Shopee customers, I dived deeper into understanding the problems on the current home page. I did this by creating a user persona and user journey map.

Before that, I would like to present different scenarios that are possible when a user uses the Shopee app.
Scenario 1: User knows the specific product and the brand it’s from – go straight to search.
Scenario 2: User knows the product they’re looking for but no specific brand.

Since the search function is ranked highly and doesn’t have major issues, I will be focusing more on the second scenario, Scenario 2, in this design test.

User Persona

User Journey Map

From the user research conducted, I have decided to focus on:

• Reducing clutter
• Reduce the need to memorise where all the elements on screen are – cutting down on sections on the home page and make use of the icons at the top for the important pages mentioned
• Product categories – since this is where people would browse and find a product they’re looking for
• Make important information salient, and boost the sense of urgency so that users will click
• Since the search function is so useful and highly ranked, make use of that to showcase information

Develop

Design Principles

From my own research, here are some eCommerce-specific design principles that I wanted to adhere to:

• Create a bazaar-like qifen (atmosphere) with seasonal deals and lively banners
• Use more rich media and attractive promotions to create engagement
• Highlight information that builds legitimacy around the merchant and the product

New sections on the Home Page include:

• Search
• Banner
• Quicklinks
• Flash Sale
• Categories
• Top Products
• Daily Discover

The 7 sections on screen adhere to Miller’s Law which states that:
“The number of objects an average person can hold in working memory is about seven.”

Hence, I decided to add no more than 7 sections to create a design that corresponds to the natural abilities of the users, saves their effort, and boosts usability.

Low-fidelity Prototype

Hi-fidelity Prototype

Validate

User Testing

Feedback that I’ve gotten includes:

• Home page looks a lot neater, less cluttered and overwhelming
• Ability to filter search results is helpful
• Banner right on top helps users see what event or promotion is going on
• Use of space to show Flash Sale is good, the countdown timer gives a sense of urgency – the progress bar also
• The canceling of the original price is also helpful in creating a sense of urgency to buy
• Daily Discover tab icons are nice
• Top Products “More items just added” makes people want to click, but it’s a bit small

Key Takeaways

• User research is vital and should not be skipped before designing. I found that doing user research helped me ideate and come up with a lot of ideas.
• At first, I thought the Shopee home page had little to no issues – it was only until I did my own evaluation and research that I discovered areas for improvement. This exercise made me think about other applications and services differently as well, and it helped me develop an eye for details in designs.
• There were a lot of ideas that came up during my user research but there was limited time to expound on those propositions. If given the opportunity to work at Shopee, I would love to explore those suggestions.

Thank you for reading!