Candy Lady User Experience Case Study

User experience Case Study

the candy lady thecandylady.com LeAnne Walters

Table of Contents

1 2 3 4 5 6 7 8

about content audit card sorting sitemap personas content studies wireframes Summary

about

The following pages consist of a case study based on the user experience of a poorly organized website, The Candy Lady. For this process I went about many steps to complete this study starting with assessing the information that was currently on the site. This allowed me to see what was on the site and also what needed changed, from this information I could work through the organizational structure of the site to find the most user appealing way to organize the information.

Content Audits Content audits were the first step in the process.

This allowed me to have a greater understanding of what was currently on the site. The audit was split into four columns, the Page ID, Page Name, Source URL, and any Notes or Descriptions. I also color coded rows to link any patterns I saw fit. The aspects of the site that I found necessary to look at were the Main Navigation, External Links, Back to Home, Links to Same Page, Add to Shopping cart, and Multiple Links to same Cart Order. Separating the rows into these categories allowed me to see problems with the site. The largest problem I found with The Candy Lady site is the repetition of links. Another issue was with the amount of information there was on the home page. There are 38 links on the home page of The Candy Lady’s site. This is information overload for any user coming to the site.

content audits

One of the biggest problem areas with the current site was the Holiday Candy section you can see above and in the audit to the side. When looking at the yellow lines of the audit, you can see that most of the links under the Holiday chocolate ended up going to the same page multiple times or didn’t actually have any candy under that holiday.

Card sorting

After th sorting main pa biggest becaus

he Content was distinguished I was able to move on to card g. This is the process of allowing volunteers to sort through the arts of the site and organize it in a way that they feel is fit. The t thing to stress during this was that there is no right answer se they are the potential users.

card sorting (open )

I started with open card sorting which is where the user is given the stack of cards and asked to put them into categories that they make themselves. This process seemed to not be very helpful for my site because most of the users put the card into similar categories that already exist within the current site.

For example, all 6 of my participants created a candy category and put all the types of candy in there.

I did gain some very useful information throughout this exercise. A few participants put the Breaking bad experience into publicity since it didn’t fit with anything candy related.

Another user made a separate category called Specialty Items. I thought this was a great idea to separate the candy.

card sorting (closed Once the open card sorts were finished I could take the information that I learned and use that to create my closed sorts. For the closed sort I provided my participants with categories to put the various items into. I wanted to keep the categories vague so that the users would possibly create new categories to describe the different types of candy. The categories I supplied them with where news, info, home, shopping, and specials. Both the open and closed card sorts consisted of three in person sorts and three remote sorts that were completed on-line. This also allowed me to reach out to a various user pool then the few people that were around me at the time.

The closed sort really helped to solidify my categories that I wanted to use for organization in the site. Mostly all of the closed sorts took advantage of the specials category. The chart to the right is the information gathered from the remote card sort. As you can see it seems like there wasn’t a lot of overlap of information, but many of my participants created their own candy section again and I was able to condense them into one category that I felt embodied the title Assorted Candy.

d)

Site Map The next step was to create a sitemap of our site. This allowed me to put the information gathered from the card sorting and give the site a new navigational structure that was more user friendly altogether.

Site Map

While working on the site map I took the time to call the Candy Lady and get their feedback about the site and what they personally want users to get out of using the site. These are the answers I received: Who is the primary user of the site?

“Mostly anyone, we’ve had a lot of publicity over the breaking bad tour and it really is anyone who is a fan of the show.

We have gotten world travelers all the way from Ireland, England, and Australia just to name a few. We also specialize in homemade black licorice and really have a nice old fashioned feel to our store. We pride ourselves in our custom shop experience and really attract anyone.”

What do you want them to get out of the site?

“Breaking Bad is our biggest publicity and really brings people in, when they Google breaking bad, the Candy Lady will show up. It is important that they can view this information in an easy way and know what we have to offer. While they are looking at breaking bad things most people also try our other candy that we have to offer. We are very specific about our candy and creating the best quality products from scratch without using any preservatives. “

After talking with the Candy Lady herself I had a better idea as to what she felt was most important that users see and wanted to convey that through the organization of the site. For example, I moved the Breaking Bad Experience out of news and made it it’s own navigational item since it is such a huge part of their site that I wasn’t aware of before.

personas The conversation I had with the Candy Lady also helped me with the next step in the process which was to create a persona. This is a potential user that I created based on the information I gathered thus far about who the user audience would be going to thecandylady.com. Since the Breaking Bad experience was stressed the most throughout my talk with the Candy Lady I decided to create a persona based on someone who would be looking for something to do as a fan of the show.

Personas

Since the site really could attract two completely different users, I created a second persona that focused more on the candy that The Candy Lady has to offer. She also stressed the fact that they serve homemade candies made with no preservatives, this could also be something that would attract users to the site and want to find out more.

CONTENT AREA STUDIES Once the persona’s were finished it was time to actually think about visually organizing the site. To start this process I took the time to create content area studies on five different sites that had similar content to The Candy Lady site. This exercise helped to see how other sites were solving problems of organization and see patterns within similar sites to the Candy Lady. To the right you can see one of the sites I studied. I completed both a home page and a subpage content area studies of the following sites:

Philly Sweet Tooth

Mom and Popcorn

Valerie Confections

Gertrude Hawk Chocolates

Godiva

Content Area Study of phillysweettooth.com

S

CONTENT AREA STUDIE

ES

When looking at the content studies I created, there were many design patterns that I could see throughout the multiple pages. One thing that was similar was how the product pages where presented. Mostly it would be just a page of products with an option to add to your cart. Along with that I also noticed that your cart was usually easily accessible on every page. All of the sites I looked at also had a main navigation going across the top and a side bar navigation on the home page or sub pages as well.

Wireframes

Once the Content Area Studies were complete for other sites it was time to make a wireframe of my own for The Candy Lady site. For this I used all the information I had gathered from the previous exercises to make a newly organized Candy Lady site. Taking the sitemap that I created I devised a new navigation that groups the many candy categories into the most important five categories.

After my talk with the Candy Lady I also decided that the Breaking Bad Experience needed to be something that was seen on the home page.

The wireframes were created as a base that could then be given to the designer to add styles and specific content.

To make everything fully understandable for the designer I added notes and annotations to the wireframes to fully explain all the components.

Wireframes

For the sub page I looked at the patterns I saw when creating the Content Area Studies and decided to go with a list view for the specific candy items.

This allowed me to add a title, picture, and short description. I also could add a quantity selector as well as an add to cart button (seen with number 5 and 6 above) to each item.

Summary Throughout this process I learned a lot about user experience and the way people interact with the web. I found how to solve organizational issues within a site and to always be thinking about the user while designing. User Experience is understanding how to create a logical and viable structure for the experience and also the elements that are important to creating an emotional connection with the product’s user. 1 Overall throughout this process of working through the Candy Lady site, I have been able to identify the problems that a user would face when using the site and approach them in a way that is now user friendly.

1. A Project Guide to UX Design, Russ Unger and Carolyn Chandler