Close
Type at least 1 character to search
Back to top

Summary

J2 is a multi-functional lifestyle brand for men, as well as a progressive retail establishment. They push the boundaries to deliver customers a completely unique experience.

ROLE

UX Designer in a team of 3

TIMELINE

3 Weeks

PROJECT SKILLS

User Experience, Research, & Usability Testing

Project overview

This study shows the process and overall user experience of the website J2 by utilizing usability test results, data analysis, and heuristic evaluations.

We discovered that while testing the users thought J2 only sold Nike and Adidas shoes and did not think it was a clothing store.

The Challenge →

How can we measure site functionality and provide recommendations and key takeaways?

Goal 01

Conduct usability tests that cover specific goals relating to user tasks on J2 Clothing

Goal 02

Analyze those test results and note problems and potential changes

Goal 03

Gather feedback on overall user experience and how the website balances meeting the user’s needs

SITE AUDIT

For this company, we conducted a site audit where we focused on the functionality of the website.

This audit helped us determined some of the pain points of the website and how we can address them. 

Global header

The global header doesn’t allow users to click on the “blog” section, which can lead users to think the website may not be J2’s website. There are also a few dead links within the site and some other links may lead to their instagram account and not to the product the user clicked on.

Background

Although the current trend of most sites offers dark mode, J2’s website may be too black for users’ liking. It would be better if they opt for choosing a darker tone where you’re able to see shadows and objects on the site. Otherwise, it makes everything they upload look flat. 

Visual Hierarchy

The font choice used in the website is small to the point where users either have to squint their eyes or click on the zoom button in their browser to read the text. It would be better if they could up the font size where it can be read from a distance and it would help if they had some type of hierarchy in place so that it would increase the visual impact to the user.

Empathize

To be able to empathize with the users, we conducted an audience analysis to narrow down the intended users that would use the website rather than going into the physical store.

We mainly focused on younger adults (aged 13-38) as these were the type of users that would use the website. Below you will find the type of users that best represent the audience: 

  • Students 
  • Younger parents
  • Content creators
  • Trendsetters
  • Teenagers2

Persona

Once we were able to narrow down the intended audience, we developed a persona to represent that group, which is the culture vulture. This ideal user likes to stay up to trend in the street wear community and being that he is a bartender in a local trendy bar, he is able to talk to customers and stay in the loop with upcoming trends and build a relationship with the customers who may have connections to retail sneaker stores.

Test

To determine the pain points in J2’s website, we conducted a usability test with 5 participants. 

The process is as follows:

  1. Pre-Test Questionnaire
  2. Usability Tasks (4 tasks)
  3. System Usability Scale Questions (SUS)
  4. First Click Test (usabilityhub.com)
  5. Preference Test (usabilityhub.com)
  6. Post-Test Questionnaire

Pretest Questionnaire

Using google forums we created a series of pre-test questions to get a better understanding of our participants and help us understand why they answered the way that they did.

These questions were created to get a sense of participants’ preferences and proficiency using a computer.

Website Task

The usability test was conducted in a classroom at school with desktop computers and strong wifi. There were 5 participants arranged to attend the test, in which they were given 5 minutes to complete 4 tasks.

The task were:

  • Task #1: Give initial reactions to the website
  • Task #2: Discover website for 5 minutes
  • Task #3: Find if J2 carries Champion hoodies
  • Task #4: Determine if J2 sold winter jackets

5 Second Test

The purpose of this task is to test how well users can find the products they are looking for when visiting J2’s homepage for the first time. 

The task was to look at the interface for 5 seconds and remember as much as you can.

First Click Test

The click test challenges participants to find a list of store locations and measures the difficulty and ease of use.

The image shows a heat map of what our participants most commonly clicked on.

Preference Test

The preference test analyses user’s perception of page layout and design. After participants select one of the web pages we ask them to elaborate on their decision.

Website Task’s

This test was designed to see how the testers experience the website, the testers were asked to think aloud during the tasks and what they said would be recorded by an observer.

System Usability Score (SUS)

Once the task was completed by the participants, we followed the System Usability Scale test, which allows us to gauge the users’ satisfaction with the website. The scale for the SUS ranges from 1-10, 1 being easy and 10 being hard. This method of questioning allowing us to compare the overall usability of the site to industry standards.

Usability Test Results

Task #1: Give initial reactions to the website

  • 4/5 participants thought the website was too dark and the text was small.
  • 1/5 participants thought it was a blog site rather than a clothing website. 

Task #2: Discover website for 5 minutes

  • 4/5 participants completed going through every page on the website and thought aloud.
  • 1/5 participants did not go through all the pages and found that it was hard to navigate around the site.

Task #3: Find if J2 carries Champion hoodies

  • 5/5 participants found that out that J2 does not carry the brand Champion.

Task #4: Determine if J2 sold winter jackets

  • 5/5 participants found it hard to find out if J2 carries winter jackets as there were no links or information showing that they carry winter jackets.

Final thoughts

In conclusion to our live testing, we were able to determine any problems with J2’s website. We have listed a few below.

  • The website has not been updated for a few years
  • The link to the blog does not work
  • No footer for the website
  • First, two images can redirect you to the Instagram page
  • Text is small and poorly laid out endless scrolling on the Home page
  • No about page
  • Brands they carry aren’t up to date with their inventory

Recommendations

These outcomes were expected as J2 was not a strong website, to begin with.

The ease of navigation is very simple and direct for the participants to navigate around. More so, we will be focusing on the identity and branding of the J2 website and how we could change what people think of it when they land on the landing page. Here are a few solutions we can fix to the branding of J2:

  • Most links provided on the website are dead
  • Minimize the homepage scrolling and shift the audience focus to showcase what J2 has to offer as a clothing store
  • The list of brands provided should be interactive so that the user may click on the brand to see what they carry
  • Shift the current website to more of a fashion website. We can execute that by adding more descriptions and current images to make it more apparent what J2 has to offer to the user

The findings of our testing definitely helped determine the core issue of the website and as expected we will be making some major changes to it to make sure it looks apart to the streetwear community.

Lessons and learnings 

Define your goal

There are things I want to improve and change already but to meet the deadline, I am happy with how much we achieved.

Usability testing

To figure out the best participant for this project so that we can design for that user.

Don’t get too caught up in analyzing everything

It can be overwhelming when there are so many options and areas to focus on.