Williams-Sonoma Knife Microsite Redesign

Problem
When customers go to the Williams-Sonoma website to purchase knives as gifts, they are instantly
overwhelmed with the abundance of inconcise and confusing choices. There needs to be a better
system in place which allows individuals to purchase the knives they actually need.

Solution
Through research, card sorting, applying design concepts and processes, wireframing, and prototyping,
I designed a microsite for the Williams-Sonoma brand. This knife microsite provides customers a clear,
concise manner by which they can choose a knife with confidence and clarity.

UX Skills
User Research I Sketching I User Personas I Card
Sorting I Comparative/Competitive Analysis I
Sitemap I User flow | Prototyping | Affinity Mapping

UX Tools
Axure | Sketch | Invision | Keynote

covery
Dis

Competitive Analysis
Before jumping right into designing for a user, I wanted to get a clear picture of what is currently on
the market. Williams-Sonoma falls under a variety of categories, including home furnishings, culinary
needs, and modern housewares. Its important to look at some of the biggest brands associated with
those areas. The areas I am focusing on are: categorizing knives, customer service, check-out
process, and site navigation.

The Cooks Warehouse

The Cooks Warehouse homepage

Categorizing Knives
-Featuring the ability to sort by: brand, color, material, blade style, cleaning-process, and how its
made. Broken down into a specific search, but perhaps missing out on simply stating what a knife is
best used for, which is what we are potentially looking at.

Customer Service
-Customer service is rather limited to email, phone, and online contact submittal. It would be nice to
see an online chat option, especially with the amount of money the average customer might spend
on this site/in store.

.
Check-Out Procedure
-A five step process, but laid out in a clean and concise fashion on one single page. Straightforward
directions, including billing information, shipping method, payment method, order review, and
placement of order.

Site Navigation
-The cutlery section is clearly laid out in the global navigation menu. The local navigation menu
features the following: shop by category, staff picks, and sales. There is room to make these clearer
choices for the user, especially if someone has no idea what type of knife they actually might need.

Bed, Bath, and Beyond

Bed, Bath, and Beyond homepage

Categorizing Knives
-Categorized by departments, knife style, brand, and price range, but makes the knife buying
experience challenging for those trying to find the right knife for the task at hand.

Customer Service
-By phone, email, directed to a list of physical stores, and a customer survey.

.
Check-Out Procedure
-A three step process, including shipping method, billing/contact, offers/payment, and finally place
order. Easy and efficient, minimizes distractions.

Site Navigation
-In order to access the cutlery section, you must navigate the global product menu, followed by
sub-menus kitchen, knives and cutlery.

Sur La Table

Sur La Table homepage

Categorizing Knives
-There isnt a specific landing page for Sur La Table, which may play in its favor to prevent overload
of information. However, once on a specific type of knife (chefs knife, for example), there are a
variety of choices to choose from, including the ability to sort by what the knife is being used for
(the pain point in an overwhelming knife-buying experience).

Customer Service
-Sur La Table lists a phone number, an email address, but also has the added benefit of a live chat
feature when a customer needs assistance. This allows for a more personal touch, and a user feeling
like they are being listened to.

.
Check-Out Procedure
-A four step process, including shipping information, payment details, optional account information,
and review/place order, all on a simple one-page layout.

Site Navigation
-In order to access the cutlery section, you must navigate the global knives menu, followed by sub-
menus category, brands, sales and promotions, and shop favorites.

User Persona
-When
-When it to knives at Williams-Sonoma, a product needs to be designed for the user below:
it comes
keeping
comesin mind her needs, the frustrations of what a shopping experience shouldnt be, and
opportunities within the actual micro-site.

Open Card Sort

-To get a better sense of the way users might perceive the way knives are categorized, I administered
an open card sort. I initially started by dividing up 90 different types of knives, based on 7 different
categories, including chefs knife, bread knife, cheese knife, boning knife, paring knife, vegetable knife,
and citrus knife.

Two users being administered an open card sort

Results overwhelmingly showed that users had trouble figuring out where the majority 90 different
knives were supposed to be placed. They didnt have trouble with knives like chefs knives, but when it
came to boning and paring knives, the users were stumped!

Closed Card Sort

-Given the valuable insight into the confusion surrounding the purpose of types of knives, I regrouped
to re-categorize knives based on their understanding of the knives functions. Users participating in this
experiment had a much easier time labeling the different knives based on function versus title.

Design

Sitemap
Once I had a better understanding of my users needs from an
information understanding perspective, I began to start
designing my actual solution. I started with the sitemap initially,
with the new categories being accounted for.

User Flow
The next step was to lay out the user flow in an easy to follow
path. Keeping in check with the needs of the gift giver, there
needs to be a clear way to keep track of her information, know if
there are ways to be rewarded for purchases, and have easy
access to customer service should the need arise.

Early Sketches
After laying out the information architecture in a clear and concise path, I
began to sketch with good old fashioned pencil and paper.

Sketches pictured here are the homepage (left) and

multipurpose knives page (right)

Wireframes
The next step in my process was to convert my sketches into actual low-
fidelity wireframes to start to put together a product that could actually
be utilized on a low-level scale.

Homepage Wireframe Order Confirmation Check-Out Wireframe

Wireframe

Iterate

User Testing
To ensure that my design was feasible and usability standards were being
met, I moved on to user testing. I took part in seven user tests with my
product, each time getting helpful feedback to improve my product.

Final Comps
Taking the feedback from testing, I iterated my designs to best meet the
needs of my users. I came up with a design that is easy to navigate, offers
the opportunity to reward loyalty, and provides a service many other
companies are not: a simple solution to buying knives that doesnt
overwhelm the customer with choice, and instead provides them the
power of purpose.

Knife microsite homepage Simple footer, and clear layout

of various categories

Product page, with information such

as picture, price, reviews, and description

Confirmation Page

Steps
Next

Work with Williams-Sonoma to get Administer surveys to collect data

an in-depth analysis of how based on customer satisfaction
knife sales have changed regarding changes to knife microsite
since implementation