Shopee — UX Case Study – UX Planet
Shopee is one of my favorite apps. I have found some of my favorite products here. Moreover, thanks to Shopee, I could meet Sesame Street friends at Universal Studio Singapore on Shopee Family Day.
But as a Shopee lover, I always thought that this app could still be better. This is a study of the possibility of a redesigned Shopee. (Note: I’m not affiliated with the brand in any way. I’m just an excited user!)
Shopee is a leading e-commerce platform in Southeast Asia and Taiwan. It has a wide selection of product categories ranging from consumer electronics to home & living, health & beauty, baby & toys, fashion and fitness equipment.
With Shopee, customers can enjoy an easy, secure and fast online shopping experience through convenient payment options and strong logistical support.
I identified different scenarios that a Shopee user may encounter to provide the best shopping experience. I set Scenario 1 as the starting point and used this scenario for further guerrilla usability testing.
🔸 Scenario 1: User knows the product but not the brand for shopping (default scenario)
🔸 Scenario 2: User knows the brand but not the product for shopping
🔸 Scenario 3: User knows the product and its brand for shopping
🔸 Scenario 4: User doesn’t know the product and its brand for shopping
To get some insight into the platform, I interviewed and ran tests with five people. I explained the task scenarios to each participant and asked them to complete the task while verbalizing their thoughts.
- You are taking a bus from work to home. You just remembered that you are going to attend your friend’s wedding next weekend.
- You are going to buy a new red dress for the wedding. Use ‘Shopee’ to find a dress for the wedding. 3. Buy the dress you chose on ‘Shopee’. (Testing terminates right before making the payment)
In this case study, I created a proto-persona, Rachel Lee, reflecting a Shopee User to guide the case study. Improving the functionalities of the app, will help provide the best possible experience for Rachel.
Affinity mapping is used to identify the common pain points from the guerrilla usability testing. By organizing and categorizing the data, I could understand users and their needs better.
Based on this prioritization matrix, I decided to focus on fixing these pain points, with the following priorities:
⚪ Pain point 1: User feels there is too much text and information
⚪ Pain point 4: User expects to be able to sort search results more efficiently.
⚪ Pain point 6: User expects to know how vouchers and coins will actually be helpful.
⚪ Pain point 3: User expects to know the trends in their age group.
⚪ Pain point 2: User is unaware that there are more main icons on the Home Page.
⚪ Pain point 5: User feels less inclined to buy if only a small number of the product has been sold.
Once I gained a clearer picture of the users, their needs and priorities, I started sketching and preparing a low-fi prototype. I could get some ideas through this sketch storming.
Banner — The main banner is an important element that can get users inspired and helps them explore Shopee. However, for many South-East Asians that use small screen smartphones the current banner contains too much information. So my first step was to make this promotion banner bigger and simpler.
Main Icons — All the participants were unaware that there were more icons even though there is a small white bar in the middle of the screen. So I also made the icon on the right side appear halfway, so that users can notice more easily that there are more icons there. (Wow, this is now reflected on Shopee’s new version!)
For more space for ‘Just For You’, I relocated icons horizontally. Horizontal scrolling allows users to see many features by swiping to the side. I also redesigned the icon set, with a coherent and consistent use of Shopee colours.
Just For You — Based on a user’s history, Shopee offers many recommendations, such as ‘You May Also Like’. As Shopee has a wide selection of product categories, it’s important to make these recommendations more user-centered. I introduced ‘Just For You (Name)’ on the first page as a personalized recommendation feature so that users can feel that Shopee is more friendly and meaningful to them.
Flash Deals — I discovered users like Shopee’s Flash Deals. Flash Deals introduce curated products at a promotional price for a limited time only. However, three participants said they don’t feel any interest if they see a product sold 0. So I changed the number of products sold to a small text instead of showing as a distinct bar. Also, to encourage users to scroll and explore, the time remaining for the Flash Deals is shown on the first screen.
Shopping Cart Icon — I redesigned the shopping cart icon utilizing the Shopee logo so that users can recognize and connect with Shopee.
Navigation — I combined the chat on top and the notification on the navigation bar so that users can check all the notifications from the app in one place.
The search page shows overall changes to display
· What a user has been interested in
· What other similar users are interested in
‘History’ and ‘Liked’ allow users to check 1) what users have been interested in. 2 participants in the interview didn’t know where to find previously ‘liked’ products. So, to provide a better user experience, I introduced a new section where the user can easily find products they liked previously. For extra convenience, I provided an option that allows users to check the date that they searched for something.
The current Shopee also shows ‘Trending Searches’ on the Search Page. However, 3 out of 5 participants in the interview answered that 2) they want to especially know what is trending among their peers. They also wanted to know which products specifically were trending, rather than just the trending categories. So, I included an option that allows users to check products trending in their age group in real-time.
At the beginning of my research I identified Scenario 4 — in which a user doesn’t know the product and its brand for shopping. With the features ‘Flash Deal’, ‘Just for You (Name)’ and ‘Trending’, Scenario 4 is covered.
I discovered 4 out of 5 participants in the interview think that there are too many filters on the listing page. For a user’s easy shopping experience, I put options in a bright orange filter box.
The color of the related search words is changed to monotone to make this filter stand out. However, I didn’t include a ‘Sorting Option’ in the filter as I found that participants expected to change the order of the list directly on the listing page.
Like on the Homepage, I found that users don’t feel attracted to products which have sold in small numbers only. So I changed the quantity to a star rating.
With the current Shopee, when users have brand information for shopping, it’s relatively easy to get suitable results. However, for Scenario 1 — in which a user knows the product but not the brand for shopping, it was not easy to get suitable ones.
Filter — Users have trouble finding a red dress. Whenever a user types in ‘red dress’, the results also show dresses of different colors. Most of these dresses also have a red version available, but the users have to tap many times to be able to check this. So I’ve added a color option to the filter. This will help users in Scenario 1, especially to sort through items of a specific color.
On the Product Page, it’s difficult for users to check if the color and size that a user is looking for is available before tapping ‘Add to Cart’ or ‘Buy Now’. To help users find out if their size and/or color are available before making a decision, I added a new option box. I also relocated all the information related to the price in one location together, near ‘Add to Cart/Buy Now’.
For a user’s easy and quick access, I tried to avoid using heavy text and images. I changed the color of the Shop information to a turquoise color like on the Product Page. I also designed a new ‘Check Out’ button to maintain visual consistency.
On the Check out page, the total payment is shown only once as a total in a bright orange color. This is to avoid confusing users and to hide any potential additional fees, which might affect the total.
With Shopee Coins and Vouchers users can get discounts on orders. However, from the interview, I discovered users feel that these coins and vouchers don’t have much value. So, on the Profile page I wanted to highlight Coins and Vouchers as actual numbers so that users can get a better sense of the discounts offered to them.
To validate my prototype, I conducted usability tests with five people and saw how many users were able to complete the tasks without feeling the pain points.
Notes: In future research, I would like to spend more time collecting enough data on Shopee users diversifying the pool of users to test with (gender, age, etc.) and seeing how often and in what kind of situations users use Shopee. I would also like to collect data on Shopee sellers to consider their perspective.
Working on this case study has been a great experience. Looking back on my notes, I feel glad that I could proceed and deliver a prototype within such a short timeline.
During the course of my case study, I realized that the first screen of Shopee was changed significantly by the company. The major changes were new features, such as Shopee LIVE and Style By Shopee. Also, the paint point 2— I mentioned above — has now been clearly resolved in the way I suggested myself (Wow!). I realized that this brand constantly considers new possibilities for users and challenges to create a better design language in a fast-paced work environment.
Through this project I have come to understand the value of my background in economics and psychology in relation to User Experience Design. I knew having a psychology background would be beneficial for understanding User Experience. However, this project made me appreciate the close connection between economics and user experience for the first time. During my work, I found I was trying to find the best way to meet needs under conditions of limited resources, just as an economist does. (Note: Economists study the best ways to meet needs under conditions of limited resources.)
I hope my work offers some ideas to the Shopee Design Team (Are you out there?). If given another opportunity in the future, I would like to continue exploring the needs of the business and Shopee users in more depth, understand the brand’s design language system and test my prototype with a bigger pool of users.
Thank you for reading! I hope you enjoyed this case study. If you have any feedback, I’d love to hear from you. Say 👋 at email@example.com or connect on LinkedIn.