Ramseier 1

Usability Test for SneakerBarDetroit.com

Test Preparation

To prepare for the usability test I walked through the task myself. The first task is to find

the most popular Air Jordan’s, I did this by clicking the navigation system “Brand” then “Air

Jordan”. Once I got to the Air Jordan’s page, I used the drop-down bar on the right side of the

page and clicked on “Most Popular”. It is difficult to tell what Air Jordan is most popular,

because the top five post are from 2015 and are just release post. Most of the post are about the

Air Jordan 11, so I would say that it is the most popular shoe. This is a problem because your

users shouldn’t have to guess what is most popular if you click the “Most Popular” tab.

The next task is to find if Kareem Abdul-Jabbar has his own sneaker design. My first

thought is to find this in the “Search” bar. I typed in “Kareem Abdul Jabhar” and no results

showed for this, so I looked how to spell his name correctly from the task page. When you spell

his name correctly, there are thirteen search results. Kareem Abdul-Jabbar has a sneaker design

with Adidas. The problem with this task is being able to spell his name correctly, if you are one

letter off it will bring up no results. The website also doesn’t have suggested spelling or “did you

mean” to help the user out.

The third task is to find the name of the “Back to the Future” shoes and determine what it

means. For this task I also used the “Search” bar to find information on the shoe. The name of

the “Back to the Future” shoe is the Nike Air MAG, which I found on the first post. Out of the

four articles that have “Back to the Future” in the title none of them have what MAG means.

This is a problem because not everyone has watched “Back to the Future” to know what it means

or don’t remember. MAG is also an acronym, so it must stand for something, after Googling it, it
 Ramseier 2

means Magnetic Anti-Gravity. It is also a problem because you don’t want your users to have to

look up what things mean from your site.

The last task is to determine who Tinker Hatfield is and what is the most recent news

about him. I searched “Tinker Hatfield” in the “Search” bar and the latest news about him was

from June 18, 2019 title “Official Photos of Tinker Hatfield’s Nike Zoom Heritage N7”. In this

article it says Tinker field designed the shoe but doesn’t exactly tell us who he is. I then searched

“Who is Tinker Hatfield” in the “Search” bar”. After getting the results I scrolled down the page

looking for something other than a shoe release from him and I clicked on the article “Tinker

Hatfield Answers Questions From Collects About the Air Jordan 3”. In the article it mentions

Tinker Hatfield as a “famed designer”. In another article I looked at it says Tinker Hatfield is one

of “Nike’s lead innovators”, which makes me assume he is a designer for Nike and not other

companies. I don’t see a major problem in this task besides it not specifically saying that Tinker

Hatfield is a designer for Nike.

Choosing Participants

Tester Comparison Summary Chart

  Marissa Shetler Caitlyn Colter

Gender Female Female
Age 21 19
Hours browsing / week 80 30
Spends roughly 75% of her
browsing on social media, 20% Spends roughly 75% of her browsing
on general browsing, and 5% on on social media, 25% on general
Browsing habits
shopping. Most of the browsing browsing, and 0% on shopping. Most
is done at home and uses of the browsing is done in her dorm.
streaming apps.
Other observations
 Ramseier 3

Tester 1 Details: Marissa Shetler

Marissa Shetler is a 21-year-old female, majoring in middle school education with a

concentration in math and science. She has never heard of Sneaker Bar Detroit or any other

competing sites before. She enjoys shoes but has never really looked into the sneaker industry

before. Marissa estimated around 80 hours per week browsing and streaming. She mainly uses

the internet for social media and streaming services. She also uses the internet to do her

schoolwork, shop, and just general browsing. I thought she would be a reasonable person to do

the usability test on because she doesn’t know a lot about the sneaker industry, so she would

have an open mind coming in and not knowing the site or its competitors. She is also someone

who will tell what she does and does not like about things, so this was a good opportunity to get

feedback from someone who likes to share those things.

Environment for Tester 1

 Location of Test: The location of the test was in the living room on the

couch of Marissa’s home. She chose this location because this is where

she does most of her browsing at.

 Physical Environment: In the living room there weren’t lights on, but the

blinds were open to have natural light shining through. The tv was on

playing the movie “To All the Boys: Always and Forever”. You could

hear cars driving by and smell lunch cooking. Another distract was one of

her roommates asking for help on a chemistry question.

 Technical Environment: Marissa used a HP laptop to do the usability

test. Her connection was through fiber. She used Google Chrome as her
 Ramseier 4

browser and the only add-on she had was Adobe Acrobat. She uses the

touch pad to do her scrolling.

Tester 2 Details: Caitlyn Colter

Caitlyn Colter is a 19-year-old female, majoring in human services with a minor in

criminal justice and criminology. She estimated around 30 hours per week of browsing and

streaming. She mainly uses the internet on social media and to do schoolwork. I thought she

would be a reasonable person for the usability test because she doesn’t spend as much time on

the web and doesn’t do online shopping. For someone who doesn’t do a lot of shopping online I

thought this would be beneficial for her to put herself in a sneakerheads shoes to see that being a

sneakerhead is more than just buying shoes. Caitlyn likes to talk and doesn’t like a lot of things,

so those are some other reasons why I chose her for this test. She has never heard of Sneaker Bar

Detroit or any other competing websites. I chose Caitlyn and Marissa based on how much they

use the web and the difference between their majors.

Environment for Tester 2

 Location of Test: The location of the test was done in Caitlyn’s living

room of her dorm; this is where she does most of her browsing and

streaming.

 Physical Environment: The lights were off in the living room, but it was

lit up by the sunlight coming through the window. Her roommate was in

the living room watching “Princess Diaries”, which Caitlyn was also

interested in. It also smelled like clean laundry.

 Ramseier 5

 Technical Environment: Caitlyn used an HP laptop to do the usability

test. Her connection is through T1 and used Google Chrome as her

browser. She didn’t have any add-ons to her browser.

Test Results

Initial Site Thoughts

Tester 1: Marissa’s initial reaction was a little surprising, she made the comments of

“eww”, “what even is this”, and “I’m lost”. She wasn’t for sure what was going on, on the page,

thought it was busy looking, and wasn’t for sure what to make of it.

Tester 2: Caitlyn’s initial reaction was better than Marissa’s. She thought the website

was cool but overloaded with ads. She thought it was great that they had a variety of high-end

and low-end shoes.

Similarities and Differences: Caitlyn had a more positive reaction to the website

whereas Marissa didn’t like it from the start. They both had similar thoughts of the website being

busy, whether that be from ads or other things.

Task 1: You know that Air Jordan’s are popular, so you want to learn more. Determine the most

popular Air Jordan’s, according to Sneaker Bar Detroit and its visitors.

  Tester 1 Tester 2 Average

Average Satisfaction 2 5 3.5
Success Rate 50% 50% 50%
 Ramseier 6

Tester 1 Task Completion Process

Marissa spent about 6 minutes completing this task. She started off by clicking “Brands”

then “Air Jordans”. Once she was on the Air Jordan page she clicked “Shop Jordans”, which

took her to another site, so I made her go back to the Air Jordans page. While she was scrolling

through the page, she said “I don’t know”, “how do you tell”, and “what is og”. She was

frustrated with not being able to have the answer right there. She also didn’t like not knowing

what some of the names meant, like the Jordan MA2’s. She clicked on the article “Air Jordan 6

“Midnight Navy” Returns on Black Friday”. She read that the shoe was making a return from

2000 and thought this shoe must be the most popular since they are bringing it back. Her final

answer for what the most popular Air Jordan is, was the Air Jordan 6.

Tester 2 task Completion Process

It took Caitlyn about 3 minutes to complete this task. She started by clicking “Brands”

then “Air Jordans”. She scrolled down the page saying, “we are just going to look at all of them”,

until she realized there were over 500 results. She scrolled back to the top of the page noticing

the drop-down bar on the right side. She said that this wasn’t very noticeable because how many

ads there are and how small it is. She clicked it and then clicked “Most Popular”. She clicked on

the article ‘“Air Jordan 11 “72-10”’, she was reading to see if it had any information on how

many sales the shoe had. She was annoyed going through the article because it had too many

pictures and not enough words. Her final answer for this was the Air Jordan 11’s based on it

being the first article coming up in “Most Popular”.

 Ramseier 7

Biggest Problem

The biggest problem from this task is the lack of information Sneaker Bar Detroit gives

within the specific shoe brand. Both testers went to the navigation system “Brands” then “Air

Jordans”, Marissa didn’t know there was a filtering drop-down or she would have used that

during the test. Caitlyn used it and went with the first article that popped up. For me it had

different shoes under “Most Popular”, so I based it off how many articles each shoe had in most

popular. The need to have a better definition on their filter drop-down bar and a way that

explains why those articles are in those categories.

Alignment to Heuristic: I think what I observed matches the heuristic Flexibility and Efficiency

of Use. Jakob Nielsen explains Flexibility and Efficiency of Use as “Accelerators—unseen by

the novice user—may often speed up the interaction for the expert user such that the system can

cater to both inexperienced and experienced users. Allow users to tailor frequent actions”

(Nielsen). In simpler terms “Allow me to do more or less”. I believe this aligns with this

heuristic because you are trying to find what the most popular shoe is using their filter. Filters
 Ramseier 8

and sorting are to help your experience by speeding up your interaction. The filtering system

isn’t that great so this is something that needs work.

Task 2: Your favorite basketball player is Kareem Abdul-Jabbar. Determine whether or not

Abdul-Jabbar has his own sneaker design.

  Tester 1 Tester 2 Average

Average Satisfaction 4 1 4.5
Success Rate 100% 0% 50%

Tester 1 Task Completion Process

Marissa started this task by clicking “Sneaker Release Dates” and scrolled down the page

for about two minutes looking for Jabbar’s name. After that she said, “I’m over this”, clicked on

“Brands” then “Nike”. Once the page loaded, she mentioned how she just wanted to click the

“shop” button when the specific brand page loads. Before she got started, she noticed there was a

search bar and gasped in excitement. She proceeds to ask if she could use the search bar and I

asked her if it was within the website and got even more excited. She didn’t want to attempt

spelling his whole name, so she just typed Kareem, and pressed the enter key. She notices the

articles have Kareem’s name and went off the article titles to get the answer. Her answer for this

was yes Kareem Abdul-Jabbar has his own sneaker design with Adidas. She was excited about

finding this answer and said, “I win”. This took her about 6 minutes to complete.

Tester 2 task Completion Process

This took Caitlyn about 6 minutes to complete. She decided to search for Kareem’s name,

she typed in “Karin Abduul Jabar” and searched. She got no results, she also misheard his first

name, that’s why she spelled it that way. She then searched “Karem Abduul Jabar”, no results
 Ramseier 9

showed up, she laughed and said, “Oh my gosh”, because she was frustrated it didn’t know what

she was trying to say. She said, “If it had some idea of what I was saying, it would give me what

I’m looking for”. She didn’t know how to spell his name correctly, so she gave me the answer of

“No, he doesn’t have a shoe design”.

Biggest Problem

The biggest problem for this task is the ability to be able to spell Kareem’s name

correctly or you don’t get results. This is not good for an industry that has a lot of celebrities with

difficult names, viewers won’t be able to know if that person has shoe designs or if there is news

on them. In this test the testers weren’t allowed to use Google to see how the name is spelled,

which is something Sneaker Bar Detroit should take into consideration. The website and the man

behind the website shouldn’t assume everyone knows how to spell difficult names.
 Ramseier 10

Alignment to Heuristic: I think what I observed matches the heuristic Error Prevention. Jakob

Nielsen explains Error Prevention as “Even better than good error messages is a careful design

which prevents a problem from occurring in the first place. Either eliminate error-prone

conditions or check for them and present users with confirmation options before they commit to

the action” (Nielsen). In simpler terms “Glad I didn’t do that.” I believe this aligns with this

heuristic because if Sneaker Bar Detroit’s search bar had spelling suggestions one of my testers
 Ramseier 11

would have been able to complete this task and the other one wouldn’t have been so frustrated.

This would help SBD’s users out in significant ways.

Task 3: You are a fan of the “Back to the Future” movies and you remember seeing a pair of

self-lacing Nikes from one of the futuristic scenes. Find the name of those shoes and what the

name means.

  Tester 1 Tester 2 Average

Average Satisfaction 3 4 3.5
Success Rate 50% 50% 50%

Tester 1 Task Completion Process

Marissa started out this task by clicking “Brand” then “Nike” and realized she could use

the search bar. She searched “Back to the Future” and scrolled until she found an article that

jumped out to her. She ended up clicking on ‘“Nike “Back to the Future” Collection”’ and

mentioned how the site had “too many adds”. While she was in this article, she was getting

frustrated because the pictures wouldn’t load in and it didn’t have that much information. She

noticed that the top two articles were on “Back to the Future”, she wasn’t for sure if it was the

shoe created to look like the hoverboard or the Nike MAG. Without reading the article she went

with the Nike MAG being the “Back to the Future” shoe. She clicked on the article “The

Original Nike MAG from “Back to the Future II” Sold for Over $90,000” and was mad because

it didn’t tell her what it meant. She the searched “Nike MAG” and was frustrated with that

because it typed it in backwards, then said “this website sucks”. When scrolling she noticed that

MAG was all capitalized and mention how she thought it was an acronym. She then searched

“Nike MAG meaning”, said “wow that gave me less results”, and went back to just Nike MAG.
 Ramseier 12

She said, “I can’t find what it means, but I think it’s an acronym, but I’m not sure”. This took her

about 13 minutes to complete.

Tester 2 task Completion Process

Caitlyn took about 10 minutes to complete this task. She started out by clicking “Brands”

then “Nike”, after scrolling for a few seconds she realized she would be better off searching for

it. She searched “Nike non lace”, while she is scrolling, she is looking for shoes that don’t have

laces. She sighed and said, “these all have laces”, she went back to the search bar searching

“back to future shoe”. She scrolled until she came across the article “Nike Air Max ‘“Throwback

Future” Pack Releases March 21st”’, after reading the article she determined that, that was not

helpful and went back to the search results. She made an excited grunt noise and said, “I think I

found it, these look right”. She clicked the article ‘“The Original Nike Mag From “Back to the

Future II” Sold for $90,000”’, she was reading the article out loud to me. She mentioned how the

shoe looked old and broken, she then chuckled because right after she said that, she read it was

the shoes from the movie. She determined that the shoe was the Nike MAG after reading. While

she was still in this article, she was trying to determine what MAG stood for. She said, “What the

heck is a MAG”, “I don’t know what a MAG is”, and “Is it magnesium”. I had to hide my

chuckle from the last comment, she thought it could be magnesium because of the crusty looking

stuff by the shoe. Her final answer for what MAG meant was magnesium.

Biggest Problem

The biggest problem with this task was finding what MAG stood for. Both of my testers

and myself had a hard time trying to find what it meant. This isn’t good for Sneaker Bar Detroit

because your users shouldn’t have to look up what an acronym stands for or an abbreviation.
 Ramseier 13

This could drive their users to use a competing site if they always have to look up what certain

things mean.

Alignment to Heuristic: I think what I observed matches the heuristic Match Between System

and the Real World. Jakob Nielsen explains this heuristic as “The system should speak the users’

language, with words, phrases and concepts familiar to the user, rather than system-orientated

terms. Follow real-world conversations, making information appear in natural and logical order”

(Nielsen). In simpler terms “I know what you are talking about.” I believe this aligns with this

heuristic because if SBD would explain the acronyms and abbreviations on their site it would be

easier for the user to know what they are talking about with out having to go to Google to look it

up.

Task 4: As you learn more about collectible sneakers, you continue to see and hear the name

Tinker Hatfield. Determine who this is and find the most recent news about him.

  Tester 1 Tester 2 Average

Average Satisfaction 4 5 4.5
Success Rate 100% 100% 100%
 Ramseier 14

Tester 1 Task Completion Process

On this last task it took Marissa about 4 minutes to complete. She started off by searching

“Tinker” and didn’t like the results of that, so searched “Tinker Hatfield” instead. She saw that

the first article had the newest date and decide that the most recent news on him was the

“Official Photos of Tinker Hatfield’s Nike Zoom Heritage N7”. She then clicked the article

“Tinker Hatfield and Michael J. Fox’s Special Nike MAG Message” and was frustrated that

there was little to no information. She kept asking who he was. She then clicked “Tinker

Hatfield’s Nike Kobe 11 Inspired by Kobe’s Favorite Air Jordan”. She read that he was an

“innovative athletic shoe designer” and this was her final answer.

Tester 2 task Completion Process

Caitlyn took about 3 minutes to complete this task. Once I read the task to her she got

excited because she had remember reading about Tinker Hatfield in task 3. Right away she new

the answer to who he was. Her answer was a shoe designer for Nike. She then searched “Tinker

Hatfield” to do the second part of the task. She clicked the article “Official Photos of Tinker

Hatfield’s Nike Zoom Heritage N7”, then decided that the most recent news about him was his

design of the Nike Zoom Heritage N7 shoe.

Biggest Problem
 Ramseier 15

The biggest problem with this task would be who Tinker Designs for. We can assume

that he is just a designer for Nike based on the articles that he is mentioned in, but you don’t

want your users to assume things, especially if they are new to the sneakerhead world.

Alignment to Heuristic: I think what I observed matches the heuristic Flexibility and Efficiency

of Use. As mentioned previously this is the “Allow me to do more or less.” I believe this aligns

with this heuristic because if SBD would explain who certain people are and the users didn’t

have to guess, they wouldn’t have to do more searching to find who a person is and what they

do.

Final Site Thoughts

Tester 1: Marissa mentioned that the site was awful, half the stuff never loaded, and they

needed more than just news articles and release dates. She said it was interesting to look at the

site and the shoes, to see what all is out there, but probably wouldn’t use this site again. She

didn’t like that she had to search for everything and wished there was a filter in the news section

to filter what you wanted to see. She also mentioned how the information should have been

easier to find.

Tester 2: Caitlyn mentioned that she had a pretty good experience trying to find the

information that was presented to her. The things she wasn’t a fan of was the search not being

able to understand what she was trying to say and the filter selection button should have been

bigger, so you could see it better around all of the ads. She didn’t have a terrible experience, but

she wouldn’t put it at her best experience.

Similarities and Differences: Both testers mentioned the filtering on the website and

how there were too many ads. Caitlyn had a better experience than Marissa, which was
 Ramseier 16

surprising, because Caitlyn doesn’t like a lot of things. Where Marissa didn’t like having to

search for everything, Caitlyn didn’t mind having to use the search to find what she was looking

for.

Recommendations to Improve User Experience

Single Problem Being Fixed

The problem that is being fixed is from Task 1, being the filtering on Sneaker Bar Detroit

to make it easier to find what people are actually looking for whether that be the most popular

shoe, people who have shoe designs, or the most recent news.

Problem Improvement

To fix the problem of Sneaker Bar Detroit’s filtering, I’m going to completely redo it.

Instead of having the navigation systems of “News”, “Brands”, “Jordan Release Dates”,

“Sneaker Release Dates”, and “Yeezy Release Dates”, seen in Figure 1, I’m putting all the

brands as the main navigation buttons. In SBD’s navigation buttons their logo and news take you

back to the home page. To change that I’m am just making it to where the SBD logo takes you to

the home page. Within each brand a drop-down bar will be displayed if you hover your mouse

over it, this will give you specific news, release dates, and people for that specific brand, seen in

Figure 2. “Release Dates” will have all information about when a shoe is coming out and

“People” will have specific people who have designs with that brand or important people who

are in business with the brand. In Figure 3 it shows what the website looks like when you click a

specific brand. In my version of the site when you just click the specific brand and nothing from

its drop-down bar it will automatically take you to news for that brand and the other navigation
 Ramseier 17

buttons at the top, seen in Figure 4. Doing this will help users find what they are specifically

looking for.

Figure 1

SBD
Log
o Adidas Air Jordans Asics Converse Nike Puma Reebok Yeezy
 
  News News News News News News News News
Release Release Release Release Release Release Release Release
  Dates Dates Dates Dates Dates Dates Dates Dates
  People People People People People People People People
Figure 2
 Ramseier 18

Figure 3

Figure 4

Work Cited
 Ramseier 19

Nielsen, Jakob. “10 Usability Heuristics for User Interface Design.” Nielsen Norman Group, 24

Apr. 1994, www.nngroup.com/articles/ten-usability-heuristics/.