All Year Round
Usability and Accessibility Evaluation
Types of Industry: E-commerce Fashion
The Client: AYR.com
The Designer: Huiyu Chang
The Project Aim: To redesign the website and make it more accessible and usable.
Time: 2020
AYR stands for "All Year Round", is a seasonless "slow-fashion" women's wear company founded in 2014, the USA by three longtime friends. They aimed their target customers from women over 18s, who travel a lot for work. Hence, they need garments that fit their body but are durable.
Recently, AYR wanted to introduce the brand to international women. Hence, they decided to update their original website to attract new customers, especially foreigners, and provide a better user experience for current clients.
The website is typical e-commerce fashion with a coastal style: clean and straightforward. The popular products are denim and skirts.
Click here to learn more
Top Tasks and Evaluation
Top Tasks
The users selected the essential elements in e-commerce fashion among 60 different items. The result is from 2020 showed the top 5 tasks they mind the most:
01 Delivery Information (9%)
02 Size and Fit Information (9%)
03 Image Quality (7%)
04 Customers Reviews (7%)
05 Product Descriptions (6%)
Current AYR.com
Evaluation
Heuristic Evaluation
A group of evaluators examed the desktop interface and judged its compliance with usability principles.
# Multiple Product Page:
-
Product unique and product name repeating
-
No filter for the efficiency of use
# Single Product Page:
-
Unclear button: "Add to bag" function confusing
-
Location guide missing on the page
-
Fuzzy size guide and include only one measure units
# About Page:
-
Non-align title and text
Accessibility Evaluation
Using WCAG2.1 Level A to analyze the website's perceivable, operable, understandable, and robus.
# Drop-down Menu:
-
Unmeaningful sequence: disorder category and unnecessary nav-button
-
Illogical order: "Bestseller" items repeating
-
The critical message should use different colour
# Home page:
-
Low colour contrast on text and background
# Multiple Product Page:
-
Keyboard use confusion for product selection.
-
Keyboard unable to return to the previous page
# About page:
-
"Press Play" link guide to the wrong webpage
-
Image has a code error
Performance Evaluation
Record user's task time, task completion, errors made and lostness by giving a scenario. Later compared with a similar e-commerce website (Pull&Bear).
AYR(Average) Pull&Bear(Average)
Task Time: 206.14 secs Task Time:153.33 secs
Task Completion: 75.29% Task Completion: 88.36%
Errors Made: 5.33 Errors Made: 3.00
Lostness: 0.31 Lostness: 0.18
-
Should reconsider the size guide: Some users were unfamiliar with the measure units "inches."
-
Delivery and Return information missing
Thematic Analysis
Gave user a scenario and run "Think Aloud" process. Analyzed their "Doing", "Thinking", and "Feeling."
#00 Overall
-
Annoying pop-up ads
-
Long loading process
#01 Home page:
-
Distraction everywhere: Page contains too much information
#02 Multiple Product Page:
-
Filter/ Category missing
#03 Single Product Page:
-
No user review and unpleasant size information
Satisfaction Evaluation
After "Think Aloud" process gave users the System Usability Scale (SUS) to measure the usability
AYR SUS score: 60
Pull&Bear SUS score:70
Average SUS score: 68 (The score is based on 500 studies)
Biometric Evaluation
Analysis of the eye-tracking path.
Task: Use a filter to find a grey dress.
Results: Filter missing, and the participants give up the task.
