A heuristic evaluation uncovers usability issues based on 10 broad principles outlined below:
Severity Scale
This scale is used to weigh the level of impact that heuristic issues have on overall usability. These range from inconsequential to critical.
We used our own personal judgment to determine where the issues ranked on the scale based on the user base (see Persona below). However, user testing may be more effective in determining accurate ratings.
0 - No Usability Problem
I don't agree that this is a usability problem at all.
1 - Cosmetic Problem Only
Need not be fixed unless extra time is available.
2 - Minor Usability Problem
Fixing this should be given low priority.
3 - Major Usability Problem
Important to fix, so should be given high priority.
4 - Usability Catastrophe
Imperative to fix this before product can be released.
A key part of this exercise was to make sure that the solutions were designed in accordance with Zara's existing branding to ease integration. This was also a key need found in the user base in order to trust the brand.
Zara's website branding consists of black and white colours, with linear iconography, and the Helvetica Neue typeface.
To empathize with the target consumer of Zara's website we developed a proto persona using user information from online blogs and selected the major task flow of finding and purchasing clothing.
"I love online shopping because of the various options at my fingertips."
• Likes to browse and be able to find similar options or view specific categories that help narrow their search
• Prefers the ability to keep track of their search and edit using filters and product summary information
• Finds that website branding is an important part of understanding the seller's aesthetic and this informs their decision
It was important to not only prioritize usability issues based on the severity scale but also accounting for time and resource constraints. The following design prioritization matrix helped us decide what issues to focus on solving using a dot voting method:
The first issue occurs while browsing the categories on the landing page. (Severity Level 3)
Problems
• No organization of categories beyond gender
• Multiple options for one specific product make it difficult to know what's right
• Some categories are hidden
Before Improvement
An overwhelming amount of categories with little consideration for content hierarchy or organization.
After Improvement
More subcategories have been included to provide the user with more guidance on what they are looking for.
This issue concerns the search function available within the global navigation of the website. (Severity Level 3)
Problems
• Search exists on a separate page and can be disorienting as you can't refer to the page you were on
• Search results contain irrelevant items that are not consistent with the query
Before Improvement
Suggested results are irrelevant and take up a new screen so no other clothes can be references.
After Improvement
The improved search has both visual and textual indicators to ensure the user is finding the right thing and includes categories for similar content to the search.
This issue involves the inability to anticipate errors/hurdles before adding an item to cart. (Severity Level 3)
Problems
• No indication of unavailable or coming soon items while browsing
• No option to continue if the item is not available (user must navigate back)
Before Improvement
Clothing that is unavailable is presented the same as other purchasable clothing.
After Improvement
Added a "coming soon" tag to help clarify that this clothing is not yet purchasable.
Before Improvement
There is a "you might also like" section but it does not have items similar to the item the buyer is viewing.
After Improvement
There is a clear similar items section that can help users find other items that are related to the non-purchasable merchandise.
The checkout process is an essential step within the buyer's journey through the website. Being able to escape and reevaluate is important for this step. (Severity Level 4)
Problems
• When the user clicks on the top of the screen, they are immediately taken back to the homepage
• This also terminates their progress in the checkout process without any warning
Before Improvement
Pressing the Zara logo would force the user out of the checkout process.
After Improvement
Added a warning modal that informs the user that they will navigate away from the checkout process and terminate their progress.
Overall this process has been invaluable in understanding how real-world designs require consistent testing and upkeep to enhance usability. Some of the issues found within Zara's website are especially frustrating for the user base and this can lead to a significant loss for the company.
The 10 usability heuristics do a great job of helping designers empathize with users and find major faults within both the information architecture and interactions within a platform. I hope to continue using these principles to enhance my own designs continuously.
Future Directions
• Look at other task flows that are valuable to the user base such as finding order information
• Do user testing on new designs to see their effectiveness and uncover any associated usability issues
• Speak with stakeholders to see how well the solutions align with their company goals and resources while adjusting the solutions accordingly
Hackathon
UX Research
UX Design
Scotia Portfolios
A 24-hour hackathon project on improving wealth management advisement.
View Case Study
You can reach me at the following links ↓
