Close
Type at least 1 character to search
Back to top

Summary

RYU Apparel creates technical, high-performance urban athletic wear that is built around individuals with different needs.

ROLE

UX Designer in a team of 2

TIMELINE

4 Weeks

PROJECT SKILLS

User Experience, Research, & Usability Testing

Project overview

This test was conducted because we felt that the layout of images and information did not follow the laws of design and the overall website navigation menu can be disguising.

We discovered that the users were experiencing difficulties in using the website navigation menu to locate the task that was requested. 

The Challenge →

How can we help new users discover RYU’s products and services effectively on their website? 

Goal 01

Help users navigate around the website easier

Goal 02

Create a better hierarchy by outlining what’s important and relevant for users to complete task

Goal 03

Optimize the search bar for users to locate products or events easier

Site Audit

The main challenge was how can we help users find products and services effectively on the website.

The purpose of this audit is to determine the strengths and weaknesses of the site and see how we can improve on it.

Navigation System:

Confusing labelling and not very transparent

Guidance:

Some important steps were missing when the user was trying to find the services as it was either hard to find or confusing.

CTAs:

The call to action is unclear on the navigation system

Empathize

We created interview questions to find out more information about our users.

The goal is to understand how comfortable the user is with locating products and services online and what they feel might work well.

Interview questions

  • How often do you shop?
  • Do you prefer shopping online or in-person?
  • Do you buy from websites that look familiar to you or are you comfortable with other third-party sites?
  • When deciding which brand to buy, what do you take into consideration?
  • Do you follow any fashion brands on social media?
  • How would you describe the way you dress? Is it more athletic casual?
  • Do you often participate in your local community events? 
  • Do you work up a sweat on the daily basis?

Empathy mapping

The next steps were to create an empathy map. Creating this empathy map will help us understand the user needs and hopefully be able to find gaps in our knowledge. 

Test

We conducted a usability study to simply see if there are any issues with the current interface and see if we can determine any pain points.

We provided a single task where the participants have to find an upcoming “Flow with us at RYU” event taking place in the last week of March in West Vancouver, Canada. From the landing page, find out more information about the event.

Finding the right participant

In order to find the ideal participant, we created a prescreening questionnaire, which was sent to 5 potential participants.

The objective of this questionnaire was to identify the participants as quickly as possible by the process of elimination.

From the results of the pre-screener, we selected two ideal participants to test the RYU site. They were selected by age, how active they were, and if they are comfortable with using the internet.

Participant

Methodology

Participants were asked to find an upcoming event in West Vancouver using the current website. We observed how they navigate around the site and timed them. 

System Usability Score

After the participants completed the task, we followed up with a System Usability Score (SUS) test where we were able to gauge the participants’ satisfaction with the site. In following the SUS method we were able to determine the overall usability of the site and compare it to industry standards.

Results

This evaluation has set the RYU website score at: 70, which is considered average in usability. It showed us that RYU has several issues with its general navigation system. 

Key takeaways

01. User experienced difficulties in using the website navigation menu.

The participant had trouble locating the events page as it can be considered somewhat hidden. RYU’s most direct path to the desired page requires users to navigate to the “events near me” page and to use the event filter section however during the testing our participants navigated to the events page but then scrolled past the events filter section and ended up leaving the page. This leads to the second takeaway below. It can be said that RYU’s navigation is too complex and cumbersome.

02. User was overwhelmed with the visual hierarchy.

As said above the user scrolled past the events filter section as well as the events link on the “your universe” page. The participant struggled in finding the right information due to the design and structure of information on the page. RYU’s visual hierarchy is a single column layout with the text being broken with images. There are only a few laws of design being utilized.

03. User experienced difficulties utilizing the search bar.

The participants’ first action was to use the search bar and search for events. There were no results and the user was confused that there was no feedback and no “did you mean”.

Recommendations

During the brainstorming session, we discovered three solutions that we could implement in improving the overall UX aspect of RYU. The three recommendations include the following below:

01. Condense website hierarchy

Implement a shallow depth navigation, number of subcategories within each category and utilize an internal linking structure. This will allow users to navigate the site easier and for crawlers to index your pages better.

02. Improve/Redesign webite page visual hierarchy

Establishing a visual hierarchy will help the user understand the sequence of elements by outlining what’s important and relevant to them on that page. Consider reading patterns, text size, white space, colour, etc.

03.Improve/Redesign search bar

To optimise the search function – refine the catalog, offer help and include more than just inventory this will allow users to search for events and other relevant topics instead of only allowing to search for inventory. 

What I can do better next time

Usability testing

Not being able to test with users after completing the revisions leaves gaps in the assumptions made.

Design/Visual direction

Better visual designs to make the product more effective and professional.

Collaboration, not handoff

I would worry less about pushing perfect pixels and more on the overall product.

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.

Come up with better questions

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. 

The next steps would be to design wireframes, prototypes and implementing the recommendations mentioned above. We would then continue testing our solutions and reiterating until it serves the user justice.