Weverse Shop, Global Kpop E-commerce Platform

Dec 2018 - Jun 2019 | Sr Product Designer

Overview

Weverse Shop is a global fan based E-commerce platform.
Goal of the project was to launch a global E-commerce platform where fans from all over the world can have same user experience and opportunities to shop for official merch of their favorite K-pop artist.  

 

My Role

Team: 2 Designers, 2 PM

As a Lead Product Designer, I led design from concept to launch by contributing to strategic design decisions, and communications between related stakeholders to meet the business needs. I conducted UX research, and iterations on main features for Cart, Checkout, Orders, My and collaborated with one other designer to keep UX and visual design consistency of the entire app. 

 

Why build Weverse Shop?

 

I first looked at existing problems BTS fans both domestic and internationally were facing with purchasing official BTS merchandise, and problems that BTS’s music agency, Hybe Entertainments had.

Domestic(Korean) fans experience on purchasing the official merch were relatively easy through various Korean open markets, but the purchase process for international fans were relatively difficult which brought problems of not offering same user experience for all the fans with opportunity to buy official merch.

shop1.png

Data in Numbers

 

In order to get to know our users we decided to operate beta website, ‘Big Hit Shop’ with minimal resources using Korean commerce solution for 4-5 months and used Google Analytics to track and gather informative user data needed to build the new Weverse Shop app.

 
shop-data1.png

Mobile Web Usage
84%

Percentage of users browsing through mobile web was around 84% and age group were mostly 10-20s which brought our team to decide focusing on App first.

💡 Build App First
shop-data2.png

Mobile Web Usage drops
from Checkout

I hypothesized that desktop web might have been little more convenient than mobile web due to different checkout structure that was easier to use. 

💡 Provide Localized Checkout

Most purchases occurred in Korea and USA,
Japan had high potentials

Since we couldn’t support all the languages, currencies, and payment methods for the initial release, we decided to focus on main purchase countries and potential countries.

💡 Deciding Main Targets Markets for Initial Phase
 

In-depth Research on Checkout Localization

 

I gathered user voices mainly from customer service center to hear more about experiences of checkout page that led me to research on localization on address forms and payment methods on global companies.

Few Insights —
#1. Zip code is a MUST for some countries e.g. South Korea, Japan
#2. Some postal code consists of both numbers and texts. 
#3. Some address fields use different labels to communicate e.g. Labels such as State, Province, Region, Prefecture etc.
#4. Konbini payment (convenience store payment) is the second most-used online payment method in Japan

Research on Address Form Localizations & Payment Methods

Research on Address Form Localizations & Payment Methods

Walkthrough on Previous User Journey

 

I was also responsible for drawing out previous user journey of the beta website ‘Big Hit Shop’ and was able to identify various problems and user needs which helped us define UX direction for the new Weverse Shop app.

Most important thing to consider was that our user base and the purpose of their visit were little bit different from general E-commerce platforms. For fan based commerce users, it’s not about the product, it’s ALL about their favorite artist. By understanding their traits, I designed Weverse Shop to have a structure of Artist being at the top of the hierarchy, and merch(products) going below the Artist.

 

General e-commerce users

“I want to buy an ecobag

Fan based e-commerce users

“I want to buy BTS tour merch that’s opening today
”I want to buy an eco bag that my bias wore yesterday at the concert”

 

 Main Feature Highlights

Artist Shop

 

I participated in the proposal stage of contributing to idea of adding flow to the sign up process, letting users set default language, currency and artist first before entering the Home screen allowing users to shop for artist merch they’re only interested in with prices shown in preferred currency.

While we were operating beta website for 4 months, we noticed that since merch usually sold out quickly due to demand always being greater than the supply, fans contacted customer service often asking when the merch would be in-stock. To solve this issue, I participated in designing user flow of restock notification to let users quickly purchase out-of-stock merch by receiving restock alerts through email or push notifications.

I also explored UI options for different kinds of merch slots that could be used in the future focusing on various ways to storytell merch that Weverse Shop is selling.

 

Cart

 

Compared to the previous Big Hit Shop, new Weverse Shop expanded list of deliverable countries, but there still was places that were non-deliverable. To lower confusion, I designed flow of selecting country when entering Cart for the first time and showed notice message If user added merch that can’t be delivered to their country/region.

shop-15.png
 

Checkout

 

Checkout experience was improved by localizing address fields for our main target markets first and provided payment methods that’s familiar for these market users.

shop-16.png
 

#1. Address Field Localization — From the insights gathered from the research phase, I placed address input fields in order of address structure for each target markets and offered address finder to help users find their home address easily. For instance, Japan’s address system is different from USA address structure by inputing zip code first and then search for home address.

 

#2. Payment Methods Localization —

We were able to lower the payment barrier by providing frequently used payment method popular for each target markets e.g. Korean market use quick mobile payments the most, Japan market use convenience store payment and mobile payments. For USA and rest of the global markets we provided Paypal and Eximbay (used mostly for Chinese users)

shop-16C.png
 

My Orders

 

In order to solve the problem of not being able to track orders, I placed track order button inside order screen to let users easily check progress of the shipment.

shop-18.png
 

Providing In-app exchange & return process —

To exchange/return order prior to initial release, users had to call or email the customer service. I designed flow of exchange and return process in 3 simple steps by selecting item, choosing reason for return and allowing final review before submitting.

I interviewed customer service about the overall process of exchange/refunds prior to designing, and found out that to quickly process filed issues, it was important for users to attach properly taken photo when submitting forms. But there was no clear photo guidelines for users to follow, so I designed photo guideline popup for users to refer to before uploading photos of the item they are trying to return.

 

MY NX

 

MY NX, is a personal space located inside My tab where fans can keep record of their fan activity events in a timeline format. QR cards are given out to fans who purchase merch from Weverse Shop or attend offline events like tours and concerts, and if user scans QR onto a QR scanner, they are rewarded with collectible emblem and points that can be used as cash at the Checkout screen. I was responsible for designing the MY NX feature.

By operating beta website ‘Big Hit Shop’ for 4-5 months, I noticed that users were having problems of not knowing where to scan QR code. To help solve the issue, I placed in-app QR scanner inside My NX screen to help users scan QR easily any time they want.

Early Stages of My NX

 

HYBE music agency wanted to gather customer patterns on purchasing BTS Merch, but all of customer data was in the hands of the retailers. As the company grew, understanding demographics and preferences of BTS fans became important so we distributed QR cards enclosed inside BTS’s physical music albums.

Prior to Weverse Shop, we built early stages of MY NX on to Big Hit Shop asking users to scan QR and participate in quick survey and as a return giving them video card from members of BTS. UI design was carried out through an outsourcing company, and I later participated in the part of revamping the interface and focused on the user flow of adding MY NX feature to the Weverse Shop Flow.

 
 
 

 
 

  Impact after the initial release

*based on year 2020

 

142 Countries

Achieved transactions from zero to 142 countries.

48% Increase in Purchase Rate

International purchase rate rose by 48% for certain products.

40% of Total Sales

Weverse Shop sales took up 40% of Total Sales of Hybe Entertainment.

 

 

More Selected Works