top of page

The simple and affordable way to shop - Buy now, pay later

Design for Shopee

SHOPEEBUY

Sample 2备份@1x 2.png

OVERVIEW

ShopeeBuy is a consumer credit product launched by Shopee, allowing a consumption quota ranging from Rp 600 to Rp1,000 depending on Indonesian users' consumption level and credit score. Shopee serves as a virtual credit card so that users enjoy “Buy Now, Pay Later” experience.

ROLE

Time. 2021

Tools. Sketch, Adobe Photoshop
Process. User Research, Ideation, Conceptual Testing, Iteration

Category. UI/UX Design, Design Research, Prototyping, Branding

iPhone X White.png
BACKGROUND

In recent years, more and more e-commerce products begin to embrace finance. In China, Alipay's Huabei and JD.com's Baitiao provide consumers with more choices of payment methods. In the United States, third party credit loan companies like Affirm and Afterpay have brought outstanding installment services to many e-commerce platforms. Compared with the traditional credit card, online credit loan service relies on big data and large users, which has the advantages of low threshold, convenience, and strong risk control ability.

CHALLENGE
How might we design an online credit loan product with the localization strategies in Indonesia?

Indonesia is APAC’s most valuable untapped e-money market: 66% of its population are “unbanked” (don’t own a bank account) and only 11% of its

e-money app users are regular users. Cash still makes up 14% of the Indonesian e-commerce payments space. Shopee, as the No.1 e-commerce platform in Indonesia, has great potential to promote credit loan services in Indonesia. Meanwhile, it also faces many challenges in this emerging market.

 

Data Source: 2019 J.P. Morgan global payment trend

3.png

E-commerce payment method split by value in Indonesia

4.png

Proportion of bank accounts owned by Indonesians

SURVEY
DEMOGRAPHICS

Exposing pain points using research and data.

I haven't used online credit loan services. So at the beginning of the project, I didn't have a clear goal. I downloaded and tried to use several popular apps. In order to better understand the advantages and disadvantages of the existing online credit loan products, I interviewed 10 people. These questions include: have you ever used an online credit loan product? If so, which one? Why use it? Tell me about your experience in using it. Are you still using it? Do you feel uncomfortable in the user experience? What do you expect from the online credit loan service?

I want to explore who our users are, people's understanding and expectations of online credit loan service, and people's user experience through my user experience and interview results.

TARGET AUDIENCE

Based on the primary and secondary research results, came up the target audience: the middle class and low-income young people aged 25-35.

PERSONA

Two personas based on the two types of the target audience.

fikran-jabbart-dZ6SQ0d-IVc-unsplash.jpg

John Lie

29 / Jakarta / Software Engineer

John graduated from University of Indonesia, majoring in computer science. After graduation, he worked in Traveloka, Indonesia's largest technology company. He is a technology geek, very keen to try a variety of new products.

Friction: He was worried that filling in too much personal information in the online loan registration process will hurt his privacy.

muhammad-haikal-sjukri-DZ0WPLmvK_c-unspl

Titi Kamal

32 / Bandung / Garment factory workers

Titi as the oldest one in the family has 5 brothers and sisters. After dropping out of high school, she came to work in a garment factory in Bandung. She wants to save money for the latest OPPO smartphone.

Friction: She knew little about the loan and was confused about the relationship between interest and payback amount.

KEY INSIGHTS

Based on primary and secondary research, got the following insights.

Enjoyed by the online credit loan

  • People who don't have a credit card can shop online with installment loans;

  • Transaction reports can be viewed online and in real time;

  • Frequent use of credit loan services and repayment on time can improve credit score and enjoy more discount.

Pain point of the online credit loan

  • It is mainly used for online shopping, not for offsite stores;

  • Users struggled with understanding the relationship between interest rates and payback amounts;

  • Amount of information required for profiling users on sign up was a bit overwhelming;

  • It's hard for people without bank accounts to use online installment services.

IDEATION

At this stage, I did a bit of brainstorming and came up with a few ideas aimed at resolving the issues that were uncovered during my interaction with the users at the interview stage. The top four ideas were:

信用卡银行卡.png

Generate one-time card for offline store payment

OFFLINE PAYMENT

文档.png

CLEAR FLOW

Provide a clear explanation of financial terms and friendly using flow

真实可信.png

STRAIGHTFORWARD

Make the process as straightforward as possible; remove unnecessary steps

Multiple repayment methods: card and cash; Unbanked people can also use this service

票据.png

MULTIPLE PAY METHODS

USER JOURNEY
FRAMEWORK

Next, I was wondering "What information is really needed here?" "How to complete an online installment shopping?" In order to show the online and offline ecosystem of ShopeeBuy, I created a user journey with a typical use case and listed all the key information in each step to help me gain a better understanding:

画板.png
INFORMATION ARCHITECTURE

I created the user flow for each features in the mobile app.

画板备份 3.png
WIREFRAMES

I then developed low-fidelity wireframes to visualize my main three task flows:  home page, loan manage with repayment, and how to shop through ShopeeBuy.

A4备份.png
USER TESTING

I conducted two rounds of user testing with 2 participants in each round. I gave my participants my low-fidelity wireframes and had them complete the tasks. I then recorded their comments and went back to my wireframes to make changes.

Based on the feedback I received, I created medium-fidelity wireframes and presented the participants in the second round of testing. I then tracked down their feedback and consolidated my findings into three main points.

Having the bunch of data will make it difficult for users to understand, and the data readability is poor.

01

The "make a payment" button makes users confused about when to repay.

02

Users don't know repayment progress, which reduces the sense of repayment security.

03

FINAL DESIGN
iPhone X White备份 2.png

Welcome Page

Welcome page attracts users. The big headline help users clearly understand the purpose of the app, and encourage users to use it.

Sign in / Sign up

Multiple login methods: users can login with Shopee account or Google.

The steps to create an account are simple, and the three-step progress bar enables users to have a sense of the steps and reduce the anxiety of filling in the information.

iPhone X White备份 3.png

Home Page

Highlight benefits, Motivate to use.

The circular progress bar shows the available credits, which is convenient for users to manage the balance.


For the products that can be purchased with loans:

1. Strengthen the discount benefit points;

2. Highlight the cheaper price number of each month after installment.

3. Convert monthly installment price to cheap goods, such as coke, encourage users to use installment payment, and effectively improve user participation.

iPhone X White备份 4.png
iPhone X White备份 4.png
iPhone X White备份 5.png

Manage

In "Manage", it's easy to view the monthly repayment due, pending items, and all repayment records.


Data visualization, repayment progress and loan life cycle at a glance. Users will not get lost when make repayment.

Users can turn on AutoPay to avoid forgetting the repayment date.

Repayment

Unbanked? No problem with repayment!

For online repayment, the user can choose any bank card to pay.

For the 66% of the "unbanked" people in Indonesia, offline cash repayment is provided here. ShopeeBuy cooperates with convenience stores like 7-11, Alfamart and other places. As long as the user shows the repayment code to the shop assistant and pays cash, the monthly repayment can be completed. In this way, effectively increase user groups and product utilization rate.

 

 

iPhone X White备份 6.png
iPhone X White备份 7.png

Multiple Payment Scenarios

More than online shopping!

Users can select to pay with ShopeeBuy when they submit orders on the Shopee website.


For offline payment scenarios, users can show the pay code to the vendor and then complete the rest of the process on the app.

How to pay through ShopeeBuy

After selecting ShopeeBuy to pay, user can select one of the payment plans. The time length of the loan is distinguished by the depth of the color, highlighting hierarchy.

 

After selecting a plan, review the detail, and the repayment cycle is represented by a pie chart to enhance the user's understanding.

Then, the payment is done!

iPhone X White备份 8.png
BRANDING
A4.png
REFLECTIONS

Through this project I’ve learned a few things that I’ve never really fully considered before. I also got to think about feasibility on a whole other level, as well as consider localization strategies in different markets.

If I have more time, I will do more in-depth research on Indonesia's user habits and consumption habits, so that the products can get enough attention and be welcomed by the market.

bottom of page