Revamping Uniqlo.
Less and More.
About
Uniqlo’s vision of providing high-quality, minimalistic, yet affordable everyday wear attracts a wide range of customers to shop there.
In 2019, the eCommerce sector of Uniqlo USA contributed to about 25% of the revenue (~$230 million). Its eCommerce business was estimated to grow well over 30% in the next few years, making it essential to ensure the customers are satisfied with its online shopping platforms.
Problem
Uniqlo is failing to provide a seamless mobile shopping experience.
Between May 2020 to June 2020, 34 iOS users reviewed the app with an average rating of 1.35 stars out of 5 in the app store. It is alarming to see such low ratings when statistics are proving that mobile commerce is rapidly growing and will soon be dominating the eCommerce market.
Therefore, I decided to redesign the Uniqlo app as my first UX design project, a brand that I have been loyal to for more than 8 years.
*Side note: I do not work for Uniqlo. This is a project solely for personal development to allow myself to understand UX design through a practical project. The perspective of this case study is strictly my own and does not reflect Uniqlo’s opinion.
Project Overview
Duration: April 2020 - June 2020
Role: UX Designer, UI Designer
Goals:
Personal development:
Complete my first ever UX design project from beginning to end
Learn how to use the design thinking process and design sprint process to solve a problem
Become proficient in using Figma
Questions that I hope to solve:
Can we provide a seamless mobile shopping experience?
Can we spark interest for customers to try the app and make a purchase with the current promotion?
Can we win the trust back from old customers to try the app again?
Criteria:
Redesign UI entirely
Align with brand values, simple and effective
Streamline the buying process
Provide all aspects of account management
Target Users:
21 to 30-year-old male and female
Urban professionals
Medium income
Seeks affordable, comfortable, good quality, casual clothing
Kickoff: Research and Data
Statistics are showing eCommerce is more substantial than ever before especially with the prevalence of the pandemic. Online shopping has become part of the norm for many Americans.
Key Market Insights
78% of users would rather access a store via a mobile app instead of a mobile site
50% greater chance that eCommerce app users will return to an online store within 30 days
Competitors have mobile apps, not web wrappers
“To simply have a web wrapper as the mobile shopping platform, not only Uniqlo is behind compared to its competitors, it is causing Uniqlo to lose a considerable amount of potential revenue.”
Personas
Who are we appealing to?
Izzy, a recent college graduate who loves fashion. She is already a regular Uniqlo shopper but would like to better utilize her transit time to shop and explore her latest style through various clothing apps. However, she wants to give Uniqlo’s app a second chance if it has made any significant improvements.
Alex works in the tech industry and does not have a particular interest in fashion. He looks for clothes that have both quality and practicality. He has only heard about Uniqlo and never bought anything from it. He is interested in the current promotion for first-time customers.
Results & Deliverables
Customer Journey Map
After synthesizing 30 recent reviews from the app store and 10 user interviews, I created a customer journey map to understand the pain points of the buying process when using the current app. From it, I am able to pinpoint what, and where are the issues, allowing me to create specific and meaningful actions to fix them.
Two major pain points during the buying process:
Browsing phase: The users realized the app is just a web wrapper. They felt like they had been deceived and the whole process of using the app to explore clothes was not enjoyable. Thus, feeling angry.
Final payment phase: Many users faced difficulties when completing the transaction. It raised concerns about payment security. Such malfunctions dramatically decrease the confidence for users to use the app to make purchases and hurt the brand overall image.
Affinity Map
After recognizing the pain points from the customer journey map, I created an affinity map to organize my findings. These are the recurring frustrations customers had mentioned…
Majority of the frustrations:
App is unreliable and has poor usability
Web wrapper
Disorganized UI
Deciding the features
Before I started brainstorming for ideas, I used How might We questions to keep myself focus on the challenges that I was trying to solve:
How might we convince old customers to try the app again?
How might we improve the user flow of the app?
How might we improve reliability during the payment phase?
How might we realign brand vision with the app?
I separated my ideas into three different categories based on their similarities. Then, I combined some of my ideas together and picked the top four features that are most tailored to the users’ needs based on the affinity map.
Feasibility & Impact Analysis
In order to understand the effects of each feature, conducting a feasibility and impact analysis was necessary. I was able to determine the priority of each feature’s implementation.
As you can see above, UI update, account management, and promotion tab were able to gain quick wins and confidence back for Uniqlo. Since most of the users’ complaints were surrounding those subjects.
However, setting up a virtual fitting room sounded a good idea on paper, but its feasibility was not high enough. The users need the most right now is a reliable app that they can seamlessly shop on.
Now that I had a holistic view of each feature, these were the features I decided to implement:
UI update
Promotion tab
Account management enhancements
Site Map
After the analysis, I created a site map to better organize the user flow of my design. I was able to organize my thoughts in a clear way of how I want my prototype to proceed step by step.
*You can view the site map via the hyperlink if you’d like.
Sketches & Wireframes
From the site map, I had the structure to start sketching out my ideas and eventually turned them into wireframes.
Feature #1 & #2: Redesigning UI, Promotion tab
Problem: Current UI design is overloaded with content.
Solution: Simplify UI to re-align Uniqlo’s vision
Realign with Uniqlo’s brand vision, “design to improve everyone’s life”.
Feature #3: Account management enhancements
Problem: Lack of account management functions
Users could barely perform any of the account settings that are available on the web. There’s no reason to download the app if none of the functions are available
Solution: Provide users with what they wished for
I mirrored all the functions that are currently on the web and made them be available for the app as well.
Users will never have to switch back and forth between the webpage and the app.
This will increase the usability of the app and incentivize old customers to try the app again.
Remote usability testings
This was the mission that I had my five users accomplish:
Navigate from landing page to add a men’s pink polo to shopping cart
Apply a coupon to checkout from the account page
Successfully submit payment
Iterated Prototype
What has changed?
After I gave the iterated prototype to the same five users to test again, instead of 80%, 100% of the users thought the whole shopping experience was seamless.
The driving force that led to such a great result was the navigation tutorial screen. At first, I assumed most users had experience using a clothing app before this app. However, some users have rarely used a clothing app. Therefore, the quick tutorial immensely helped them to understand the navigation of the app.
Learnings
Research, research, research. Set your path to success by genuinely understanding the root of the problem. It will keep your workflow focused and create a solution that effectively solves the problem.
Usability testing is king. Without users giving me feedback, I will never know if my design met their needs or required iteration. It is the most important part of the process. For example, I would never have noticed that I missed to include a remove item option on the checkout page.