Looa Boutique
Looa is an E-commerce Jewelry & Gift shop. This redesign was a speculative coursework project at General Assembly. The project sought to improve users’ navigation throughout the website to increase overall efficiency and help users’ decision process.
Project Overview
Challenge
Users are not supported with efficient navigation and proper resources during the purchase process.
Solution
Rearrange the primary & faceted navigation to improve clarity and efficiency with the purchase process
Implement engaging features to help users make decision
Role
UX Researcher, UX Designer, UI Designer
Time
2 Weeks
Tools
Figma
>Research<
I began the project by looking at several market leaders in a competitive landscape. I selected three competitors selling jewelry products online and one comparator from which I could derive transferable insights. Then, I went on to interview users who have purchased jewelry on the E-commerce website and moved on to the current website audit.
Research Goals
Identify Looa’s competitors and understand the market
Find limitations with the current website
Identify the essential features for E-commerce websites
Understand users’ behavior and their goals & pains
Feature Analysis
I selected three competitors, Pandora, Kendra Scott, and Macy’s based on their offerings in silver jewelry and their accessibility to the local market. Comparing the features these websites provide to Looa’s, I was able to identify the clear sign of a lack in the essential features.
Key findings are the following:
Looa’s website doesn’t offer proper faceted navigation such as a filter or categorized sort.
There is no interactive content like reviews or wishlists.
The accessibility to customer service is not supported by any distinct function.
I continued the analysis with the comparator, Sephora, the market leader in E-commerce, and confirmed the findings from the competitive analysis that Looa’s website lacks the essential features.
User Interview
Following the market study, I interviewed four users who regularly shopped for jewelry online with the set of questions below.
Tell me about your most recent jewelry purchase experience.
What makes you buy jewelry online?
How do you start your search?
Which websites do you use to shop for jewelry most?
What do you think about buying jewelry online?
Key Findings
4 out of 4 interviewees said that product information such as material, size, and product image is an important factor that influences the purchase.
75% of interviewees tend to start online shopping with a clear plan or goal.
3 interviewees said that review is the critical measure of a website’s credibility as well as product quality.
User Persona
Once I synthesized the interview findings, I created the user persona in order to focus the design on solving particular problems identified and help make the design decisions in regard to the user group.
Meet Emily!
She is 30 years old and lives in a suburban area.
Behavior
not an impulsive buyer
puts sentimental meanings on jewelry pieces
likes to support local shops and small businesses
Needs and Goals
Wants to easily picture herself with the item on
Needs to check out customer reviews before making a decision
Wants to find the item in mind in a convenient way
Pains
Hates spending too much time going through items
Gets frustrated by not having enough product information
Heuristics Evaluation
Before starting to work on the design, I wanted to review the current website based on the industry standards and was able to identify major flaws in navigation as well as the content.
Landing Page
Product Overview Page
Product Detail Page
>Define the Problem<
Based on the findings from the research phase, I coined the problem statement and the possible approaches.
Problem Statement
Users need efficient navigation and proper resources on the website so that they can make the right purchase decision.
How Might We…
How might we make the navigation more efficient?
How might we add proper resources?
How might we communicate the current navigation in a positive way?
User Flow
As I was able to find critical issues with the current navigation, I mapped out a current user flow based on the task of purchasing a piece of silver earrings for under $20. This search flow clearly shows multiple failed paths lagging the user’s search journey and decreasing the overall efficiency.
>Ideate<
Below is the set of changes I decided to apply to the website. Starting from the sketches, I iterated different ideas and moved on to the next medium once complete.
The main changes I made were…
Improving the overall navigation throughout the website
-Reorganizing the primary navigation
-Adding filter/sort functions
Implementing engaging features such as product reviews, ratings, and wishlist
Improving the content quality
-Redesigning landing page as well as product overview & detail page
Design Solutions
Focusing on the main changes, I applied design solutions and compared new designs with the current website.
Landing Page
Current Website
New Design
Reorganized the primary navigation
-Deleted foreign languages and a special character
-Reduced menus from 6 to 4
-Placed menus by priority
Redesigned the landing page
-Added a call-to-action button
-Made the main image clickable
Changed the search icon to the search box
Product Overview Page
Current Website
New Design
Updated the faceted navigation
-Added filter options
-Improved the sort functionImproved the breadcrumbs
-Removed “collection page” that can’t be found on the navigation bar
Fixed the product name and price under the product image
Implemented the “Quick add” button to increase efficiency
Product Detail Page
Current Website
New Design
Implemented engaging features
-Added wishlist button to save items
-Implemented review & rating features
-Added more detailed product details and description
-Included additional information using the accordion menu
High-Fidelity Prototype
UI Kit
Reflections
This project was the first website project I have taken and at a glance, this website didn’t seem to have that many issues. The layout looked like following a simple theme and most of the features were available to make a purchase. However, as I was digging deeper with research putting myself in users’ shoes, I did identify some critical lack of essential functions and features disguised in simplicity. This project reconfirmed the importance of research in the design process.
What I would do differently next time is to draw a journey map and see if I can identify opportunities along the user’s shopping journey.
Next Step
The next step would be to test the new design on users and modify it accordingly. Once the user testing is complete, I will continue working on the navigation on other pages.