ZeeOgallery
September 2019
ZeeOgallery
An e-commerce webapp
with AR feature
Client
A lady who is importing some decorative pillow covers from her hometown. She currently sells the covers to individuals only through referrals. Now she is confident that she can expand her business to online sales by launching her own e-commerce website or application.
Problem
One problem that she has with direct sales to the individuals is that her customers are returning the sold cushions because they are complaining that the color or pattern of the cushions is not matching with their sofa or their home decoration. She wants to solve this problem on her online store to minimize the number of returns by offering customers an online method to compare the cushion covers against their sofa’s color or pattern.
Goal
objectives
To develop an interactive e-commerce website or application for selling cushions pillow cover online.
-
A feature for customers to compare the pillow covers and choose the best matching one for their sofas.
-
Provide information such as dimension, size and color.
-
Search cushion based on color, fabric, size, and price.
-
Easily create shopping bags and checkout.
-
Most of the users are women.
-
The majority of users did online shopping at least once.
-
More than 50% of users find online shopping good for them.
-
Almost 90% of users use the cellphone for online shopping.
-
The majority of users did the return at least once.
-
Most of the users returned the purchase because their mind changed and the other returning reasons were the difference between the website descriptions or materials and the real product.
User Research
.png)
Ideate
Persona
I love making personas since they are a great motivation for me during the whole design process and remind me of things I need to take to account. So, after implementing user research and an online survey, I have summarized my user's goals, needs, and current pain points into a Persona.
Age: 43
Occupation: Marketing manager
Status: Married
Location: Los Angeles
"As a Businesswoman, wife, and mom, I haven’t enough time for window shopping. Even at the weekend, I cannot go shopping with impatient kids! I am a big fan of online shopping."
Objectives
-
The shopping cart should be available on every page
-
Contact or chat should be available on every page
-
Checkout should be available on every page
-
The comparison between products you viewed should be available
-
Dimension scale for every product should be visually
-
Materials and fabrics should be obvious
-
Environment picture or model is necessary to figure out the products better
Pain points
-
The quality of the images are not good in most e-commerce websites
-
The scale and dimensions are not recognizable.
-
The material is not recognizable.
-
The users don’t feel the reality of the product.
Intraction design
Low fidelity wireframe
From users' feedback on my initial sketches and based on Personas, I decided to focus on three main actions/tasks:
​
-
Compare products on their own spaces with augmented reality
-
Easy search and find the products with the least click numbers
-
Do login/sign up and payment so fast.
​
​
Usability Testing
Users' Feedbacks
After providing the initial version of high fidelity screens, I have tested them with target users and here is what I found:
All users found it easy to navigate to do the tasks including Search, find the products, using the AR and navigate to check out. They also found the whole experience appealing and very realistic.
However, there were some pain-points for some users while working with the app:
-
There was a problem on the home screen for users to understand which button is going to pillow the cover screen.
-
Users had an unclear understanding of exploring icon on the navbar and had difficulty to find the products category. Then I decided to change the explore icon with the shop icon to include products category.
-
After changed explore to shop users can do the filtering and sorting on product category screens.
-
Users had difficulty to drag and drop the pillow picture from the right bar on their sofa, Then I decided to put it on the top.
Final Product
ZeeOgallery is an interactive e-commerce application with the AR system which offers users to see and compare products in their own spaces and make a good decision for buying pillow covers or other products.
