CLARITY
NEW PRODUCT I RESPONSIVE WEB
Clarity provides users with a platform where they can have personalized recomendation from specialists & AI data. Users can save their recomendation, favorite brands and personal skintype to quick and convenient way to reserch and shop.
​
OVERVIEW
SOOJIN SIELLE KIM
MY ROLE
TIME SCOPE
METHODS
UX Researcher
UX designer
UI Designer
3 .5 weeks
Market Research, E-Commerce Research, User Interview, Usability Test, Contextual Inquiry, Heuristic Evaluation, Competitor Analysis, Lo-Fi sketch, Wireframing, Rapid Prototyping, Users Flow
PROCESS
01 PROJECT SCOPE
What is VIctoria’s Secret (VS) website’s problem space?
-
The director of digital products at Victoria's Secret expressed that the pain point of check out process using multi offer codes from their users
-
Redesign interface layout of homepage with offers & new products
-
Redesign drop down menu box to help users research time (focus on Bras section)
​
Goals
Begin building a strategy that defines a new direction for the redesign their web page, I needed to find out
-
What do users need from the VS website?
-
Simple and seamless way to shop without overwhelming, distraction and checkout abandonment
-
Quickly learn about promotions and use offer codes to check out process without confusion
02 RESEARCH
Market Research
Victoria Secret (VS) target market
​ How does the company reach its target audience?
​
​
-
Consumers believe they can look like models which in turn creates brand association
-
Reaches the target audience via email and mobile marketing
-
Alerts at the launch of new products
-
Fashion shows attract a large number of customers
-
Promotions sales
-
Direct marketing strategy: TV & Social media commercial, VS Angels
​
​
​ What can be the Victoria's Secret biggest challenges?
​
​
-
Maintaining their multi-digital platform to its customers,
-
Huge investment in technology to maintain database
​
​
What’s next for Victoria's Secret?
-
Get feedback from loyal customers from stores and website.
-
Follow famous designers in introducing designs and collaboration.
-
The company can grow by maintaining and expanding a loyal customer list.
-
Expand stores in major cities of Asia and Europe.
​
​
Initial Usability Test & User Interview
​To have a better sense of how users interact with the current website, conducted 9 usability tests with 9 users to understand users experience, their needs, goals and pain point.
(Focus on VS brand only with check out process using offer codes)
* Users Demographics
* Users Criteria:
Users who give a high importance of online shopping
4 38-44 years old females live in NJ
3 21-25 years old females live in NY
2 25-30 years old males live in NY & NJ
Initial Usability Test Finding
-
9/9 Users were able to complete the task
​
-
9/9 Users confused
w/ offer codes
-
8/9 Users did not noticed ‘Today Offer’ tab at the bottom of the screen
-
7/9 Free Gift offer should be auto added
-
7/9 Users prefer to have a discount than a free gift
-
5/9 Users want to see item cart in a full screen before sign in or sign up
-
5/9 Too many offers everywhere is over whelming
User Intervew Key Findings
Hover >
Users are overwelmed with too many offers, it causes decision fatigue
Offers were on the top, bottom and everywhere so I missed the offer
Christy 42
Hover >
'Today Offer' tab placement was invisible to users
Free gift should be automatically added without the code, felt like taking advantage of user to get lost with offers
Mike 30
Hover >
Check out process -too early Sign in, paypal, multi offer codes can lead the abandonment
​
I want to see in a full screen of my bag, I prefer to sign in or Paypal right before the final order button
Michelle 22
04 APROACH : DESIGN
The redesign was executed to create a seamless shopping experience for the users. Based on research, Victoria's Secret target consumers purchase the most frequently from sites they want to discover new products and find the right products without missing any offer in an efficient way.
The redesign website is focused on
-
Easy navigate 'primary menu box'
-
Improve 'Drop down secondary menu box'
-
Provide a user friendly checkout process without the confusion.
LO-FI SKETCH: ACCORDING TO KEY FINDINGS
Redesign features
-
Homepage layout
-
Primary navigate bar
-
Improve drop down secondary box
-
'Today Offer' Tab
-
Improve Check out process
1
Home page
-
'Today's Offer' moved to the top & center of the utility bar: more Intuitive for users
-
Primary menu bar made with black strip to improve accessibility
-
Hero images (Offers) 3 catagories were laid out vertically at existing site, consolidated horizontally to reduce scrolling time & added 'shop' buttons directly on photos
-
Added 'favorite' menu at the utility bar for users to keep their favorite styles
​
Existing
2
Proposal
16
3
1
1
3
4
'Today Offer' tab
Primary Navigation Bar
2
Added 'Favorite"so users can save their favorite styles
4
'Shop' click button
HOME PAGE FULL VIEW COMPARISON
Existing Home Page Full View
Proposal
2
'Today's Offers' tab
-
'Today's Offer' was moved to the top utility bar from the botton of the screen
-
Added 'apply button' to each offers:
Proposal
Existing
3
Secondary catagory menu box
-
Inserted bra style pictures by terminologies for easy understanding
-
Improved stronger contrast on Typography
-
Arranged with boxes by section for easy eye scaning
Existing
Proposal
1
2
3
Existing
Bold font: improved contrast
Styles section, product picture will help to understand the style terminology better
Added white box to divide each catagory sections for the easy eye scanning for users
1
2
3
Proposal
4
Add item to cart
-
Removd left suggestion items to help focus on view bag for users
-
Replaced 'Paypal' button to 'View bag' button : research data showed that user won't purchase by paypal before reviewig item bag in a full screen
Existing
Proposal
5
Full page cart
-
Audomatically Indicated 'qualified Free shipping' instead of 'adding offer code' manually
-
Auto added a free gift in the cart instead of looking for the offer code
-
Provided many options (Guest check out, Paypal) of check out on one page
-
'Offer code box' has fill in code + button to avoid 2 screen steps (Existing website need 2 steps to add offer codes)
2 SCREENS PROCESS
Existing
Proposal
1 SCREEN PROCESS
Existing
RAPID PROTOTYPE
05 NEXT STEPS & REFLECTIONS
Observing users and pay attention to their stories...
The major takeaway from this project was discovering about the industry where Victoria's Secret brand stands as of today. Dived deep into online retail industry, conducted competitor analysis and observed & heard about what e-commerce consumers needs, goals and their pain points helped me to gain worthwhile insights. The most valuable data was collected in the research phase when I conducted user interviews and observed how users interacted with the website.
​
​The redesign was executed 100% based on the research data, but further usability test, A/B test to confirm the value of design changes as next steps. If I had more time, I would like to continue to improve/implement the following features:
​
-
Implement 'Favorite' section where users can save their favorite styles: increase sales and collecting valuable data for the business
-
Product detail page: provide 360 degree dimensional view of the products
-
FInd an opportunity to implement a featuring section, using the social media: consummers can feel that they are a part of the brand
-
UX research on ‘VS Beauty’, ‘Sport’, ‘Swim’ and ‘Brand We Love’ categories to test users shopping experience to increase business opportunities