User Testing

I did user testing with two of my roommates, giving each of them a different task scenario to follow.

Testing Scenario #1:
I asked Katie to find a 20 ounce bottle of ketchup. Since the site “home page” is just a slideshow gallery, she asked if she needed to find it in those photos. I said, “You can enter the site.” When she did enter the site, she looked at the home page for about 8 seconds and then clicked on the “Quantity” button. She quickly clicked on the “20 – 29 ounces” button and scrolled through some of the photos in the section and then said, “There's three 20 ounce bottles.”

Testing Scenario #1 Summary:
Finding the 20 ounce bottle of ketchup was really easy. I thought it was interesting that Katie was a bit confused about whether to enter the site or not. This could potentially be a usability problem when given a specific task scenario.


Testing Scenario #2:
I asked Rebecca to find a brand of Ketchup she’d never heard of before. She entered the site right away and clicked on “Manufacturer” and then “Others.” She scrolled through a couple and then said, “I’ve never heard of Sir Kensington’s ketchup before. Or Sriracha. That was pretty easy.” She also said she’d never heard of spicy ketchup flavors.

Testing Scenario #2 Summary:
Rebecca completed the task really quickly and easily.

Overall Summary:
Both users agreed that the site is easy to use and navigate.

Museum of Ketchup Logo

The website project is due on Monday. A version of the site can be viewed here. This page will be updated with the final site soon.

Updates

Today I got most of the actual design elements integrated into my website. I’m pretty happy with the results, though there is still a lot of work to do! I haven't yet programmed the sorting elements into Muse, but that should be happening soon!

Half-tone ketchup "photo"

The half-tone ketchup photo in the previous post looks like newspaper dots threw up on the picture. So here are a couple clearer photos.

Museum of Ketchup - Design Directions

These are the three design directions I played with a bit.

This first one is the original idea that I'd had in my head since I began the project: very classic, timeless design, light and neutral color palette, simple.

As I tinkered around with ideas, this black and white idea is quite similar to the original idea, but more formal with a honed-in color scheme centered around the idea of Ketchup!

Even though I like both of these ideas, especially the second one, as I revisited my ideas of target audience and what ketchup really is, I decided a more playful design would be better. This one uses brighter colors and “retro-style” design, the whole idea being that “ketchup goes way back” and the design invokes that. This is the design I'm working with. I'm using half-toned photos to display the ketchup bottles, which gives an old-timey, newspaperish, homey feel.

Wireframes and Sitemaps

I have two main wireframe ideas that are quite similar in structure, yet different in appearance. For both designs, the site is contained in one page, rather than having to click between pages to view various content. The site maps and wireframes are below.


Site map 1 (left) and Site map 2 (right)

Wireframes for Sitemap 1

Wireframes for Sitemap 2