Portfolio Project 4: Shopee

Background

Context

I was presented with a design challenge with Shopee, one of the largest ecommerce platform in Southeast Asia and Taiwan, as part of their interview process.

As seen in the design challenge prompt below, I was tasked to design a Trending Collections UI section for their ecommerce platform. The UI must also include elements to help potential buyers discover trending items that are auto-generated based on their browsing behaviour. This will lead to an increased sense of novelty and a sense of being "up-to-date", which then leads to higher conversion (sales) rate. The UI theme must also be seasonal-specific, and I was allowed to choose between Christmas or Valentine's Day.

I completed the given UI design challenge within the one-week deadline.

Defining the Problem

Users

For the purpose of the design challenge, I will be choosing the Valentine's Day UI theme. As such, the target users will be couples from young (teenagers) to middle-aged (40+ years old). Seniors are generally not expected to use e-commerce mobile platforms regularly, as compared to their younger peers.

Interview Findings

No user interviews were conducted as this was a design challenge.

Instead, I performed extensive secondary research on the existing Shopee platform to understand more about its target audience, the pros & cons with its existing Trending Collections UI section, as well as searching into Shopee's competitors to understand what the common UI features are, and how Shopee can improve in this area. I also simulated UX research by creating a Customer Journey Mapping after conducting my secondary research findings.

Pain Points & Opportunities

❌ Pain Points:

The ecommerce landing page is very cluttered and messy

Customers don't know what they should buy for their different Loved Ones

The "top ranked" items in terms of sales & trending is difficult to locate on the mobile app

There are not enough options to make the gift more "personalised", especially so for a Valentine's Day Gift. Customers are also concerned about delivery date & time guarantee and flexibility.

✅ Opportunities

The landing page layout can be more organised, allowing users to discover the products more easily

Platform can suggest top trending items & previous year top selling items, per “recipient type” category (e.g. for partner, for family, for colleagues)

Platform can include a wider range of gift add-ons to allow for various combinations, and aslo ensure Gift delivery/time guarantee & flexibility

Platform should also allow for "anonymous" delivery

Designing a Solution

Process

As part of the design process, before the sketch, I usually develop a detailed information hierarchy (architecture) to see the overall content of each section, and how each section links to each other, for the purpose of fulfilling the user requirements or needs. I have designed four different UI screens for this challenge:

[1] Shopee App - User opens their Shopee App on their mobile phone

[2] Landing Page - allowing users to quickly view the upcoming Valentine's Day event, the associated special promotions and flash sales, trending collections, Shopee Live section (for Infleuncer Marketing), and then a recommendation section based on the user's previous browsing history

[3] Trending Collections Page - it should show recommendations suitable for each category of recipient types, namely "For Him", "For Her", "Together (as a couple)" and "For Them (family, colleagues etc)"

[4] Product Main Page - this page shows the full details of the product that the user is interested in and includes the customised product purchase options, e.g. delivery date/time, anonymous option

Moodboard

I compiled together a moodboard in order to get inspiration and colour hex codes suitable for the Valentine's Day theme.

Visual Deliverables

Completed UI UX Design

The final UI below shows the initial sketch (mid-fi UI) and the final UI on a side-by-side comparison.

Design System

I have also included the Design System that I used for my UI design challenge, including the Colour Palette, UI Components and Icons used.

Reflection

This was one of my best UI design case studies that I have done so far from a UI perspective. Experimenting with the various "love" and red/pink motifs was very fun and refreshing, as well as experimenting with different UI components and cards with appropriate drop shadow effects. I also managed to include the before & after UI screens for comparison, which I found to be helpful as artefacts for my design challenge. Although I was not selected for the position by the company in the end, I am proud that I was one of the top candidates for the position. Overall, I am grateful for the opportunity to prove my UI UX design skills.