Staples: User-friendly access & clear-one-press check-out
“ Nowadays, online shopping has become the main trend in daily life, and office supplies shopping is not an exception. People tend to use apps to have a quick browse and order their necessaries.”
Story & Brief:
I’ve been working in Staples for over two years and have always heard about the complaints from our customers, who regularly use the app to order and pick up in the store, quoted that our app is hard to use. Mostly mentioned is that they have problems with seeing the on-going promotions in the app version, having confusion with the check-out process, and being unable to see the expected delivery date.
Target Client
Staples
year
2020
Duration
Sep 2020 - Oct 2020
Responsibilties
1.Plan, design and conduct research
Information Architecture
2.Execute UX design including IA definition, wireframing and prototyping
“ Staples app is difficult to use! I can’t find what I need with categories and the deals that I’m looking for, and all I can see is the service they provide but I don’t need it, how frustrating!” - Johnson, Regular Customer
Project Goals
Redesign of the current landing page to drive more sales and increase customer usage
Easily manage Rewards account
Showcase and emphasize the service and products that the company provide with improving the user experience
Problem Statements
To improve users’ problems with getting a quick look at deals and rewards-checking, Staples need to lessen the difficulties and redundancies of using the mobile app.
Text Subtitle
Challenges
Scope & Constraints
Lack of resources with customer surveys & interviews
Insufficient imageries to express the function in the app
The has to be both creative and formal at the same time to fulfill the different type of customer needs
Design Process
Audits were conducted on other office supplies apps to extract product specific insights. I took Staples' competitor Office Depot & Amazon to do further research and compare the functions.
Tools: Figma, Photoshop
Customer Feedbacks
Marketing Research
Persona
Userflow
Prototype/Wireframe
Usability Testing
Icons made by Freepik @ Flaticon
Major Key Takeaways
Shared functional features
Rewards Account
My Store
Trending Products
Browse Categories
Ink & Toner finder
Staples Advantage
Measure Virtual Applications
Daily Deals
Main Pain Points
Rewards quick checking
Visibility of categories and deals
Difficulties of Navigation control
Key Quotes from Customers
“ Check-out pages doesn’t let me save my billing information for next time use, and I can’t find where I can change my address.”
“ I can’t not see any weekly ads or deals when I enter, even though it’s my main purpose to use this app to purchase…”
“ I want to see all the categories at first, don’t want to get in too deep.”
Outcome & Results
Based on the results of card sorting, the features and information that users need the features in the app:
Landing page: Weekly Deals section extended
Check-out pages: Saved for later and saved information options
Signup/Login page: asy sign up
Design Solutions
Login & Sign up page
Designed a clear and easy to sign-up or log-in page, in order to remember next time so the users can log in quickly.
Landing page
Emphasized on weekly deals, top deals and rewards checking.
Check-out pages
Displayed expected-delivery date, saved billing & shopping information for later use, distinguished check-out method before processing to secure check out.
“Design is everywhere. From the dress you’re wearing to the smartphone you’re holding, it’s design.”
Samadara Ginige, Designer and Developer
Takeaways & Reflections
From this project, I learned about the importance of designing before the processing of the prototype and designing. Design system helped define the scheme, colors, and content, which provides visibility to the user. User experience research also explored what the user needs from the app.