Five Guys — A heuristic evaluation
My first steps in heuristics with the evaluation of the Five Guys UK website
If you follow me along my journey to become a UX jedi, I have recently learned about the 10 usability heuristics for User Interface Design by Jakob Nielsen. These are rules of thumb rather than specific guidelines to improve the usability of a website/app.
I was super excited by these principes as I knew they would give me strong rationals to analyse/criticise any website/app… Back in the days, I would only be able to say “this website is crap”. I got better weapons now! I therefore wanted to practice this new tool on the Five Guys UK website.
About the company
Five Guys is a fast food company born in 1986 in Virginia, USA as a family business. Since then, they moved to a franchise system, and opened more and more restaurants not only in the US, but also in Canada, Europe and Middle East.
The first Five Guys restaurant in the UK opened in London (Covent Garden) in 2013, and they have since then expanded over different regions, with new restaurants, click and collect options and Deliveroo orders.
With this rapid expansion, I was curious to understand how the Five Guys UK website was able to support their growing customer acquisition in this market. In this case, the evaluation helped me uncover 4 main issues related to 3 usability heuristics.
The Heuristic evaluation
Always speak your user’s language
One of the 10 usability heuristics refers to a necessary match between the system and the real world. In other words, the website/app should speak the user’s language with phrases and concepts that are familiar to the user.
- Problem: While I browsed through the “order” page on the website, I noticed an option called “All the Way”. That seemed really unclear to me. Did it relate to the delivery options, or to the number of ingredients you could choose for your hamburger? Once I clicked, I discovered it was an option to have ingredients already selected so that you could order faster.
- Suggestion: I think the wording could be improved on that one, using terms like “preset selection” or “made for you”. I assume this should be an easy fix, as no navigation is impacted, just wording.
Don’t make the user wonder about the nature of what he sees.
Another usability heuristic states that the user should not have to wonder whether different words, situations or actions mean the same thing. In other words, what look the same should do the same. I noticed 2 main issues for this topic on the Five Guys website.
- Problem : The website home page includes different tiles with images and text. However, the “skip the queue” tile is the only one that is clickable, the others are just informative. This inconsistency could have a deep impact on customer acquisition for the online order feature: people would not naturally click on this feature, as they can’t click on the other tiles.
- Suggestion : The design of the “skip the queue” tile would need to be differentiated from the other tiles, to actually look like a button. Why not adding a drop shadow for example, as a signifier that this tile can be clicked? As this relates to micro-interactions and design, I assume this would be a more difficult thing to fix, and this is key to maintain good customer acquisition for the “order online” feature.
- Problem: On the product pages, you have different words at the bottom, including “download”. This word pushed me to click, but nothing happened, it wasn’t a link after all and it got me quite disturbed. It’s only after a few seconds that I noticed that the words next to it “Menu” “Allergen Info” were links and were driving to the “download” menu.
- Suggestion: To avoid this confusion, why not putting a “download as a PDF” button at the top of each corresponding page “Menu”, “Allergen Info” and “Nutritional Info”? This would be clearer and the button would become more contextual. As it relates to the user flow, this may not be an easy fix though, and is surely not a priority for the Five Guys business.
Help your user remember where he is on the website
According to another usability heuristic, the designer should minimise the user’s memory by making the different objects, actions and options visible. I noticed 1 main issue related to this topic on the Five Guys website.
- Problem: As I was browsing through the website, I noticed that none of the buttons of the menu was highlighted when I was on the corresponding page. As none of these pages have titles either, it could become difficult for the user to know where he is on the website, would he be interrupted in his navigation.
- Suggestion: to solve this problem, why not swapping colors for the button that should be highlighted when the user is on the corresponding page (i.e rectangle fill in white, and text in red) ? This way, we keep the visual guidelines and make it easier for the user.
My key take-aways
This exercise definitely helped me practice heuristic evaluation, and share my first thoughts on this:
- The impact of usability issues: I’ve realised the potential impact that a wrong button, an unclickable tile could have on the user’s satisfaction, but also on the business.
- The difficulty to assess the ease of fixing of a problem: As a soon-to-be UX designer, I don’t have any knowledge (yet) in coding, so I was unable to truly assess the difficulty of each task from a developer’s point of view.
- The user’s perspective: I would need to make further usability tests with the users, to see if the problems I spotted are included in patterns.
As it’s my first exercise of heuristic evaluation, I’m sure I haven’t spotted other problems on the Five Guys website. I will train further on this topic to become a true UX problem spotter and solver!
Thanks for reading this article and following me along my journey to become a UX designer! Feel free to clap and comment if you liked this article, or if you spotted other problems on the Five Guys website, that you would like to share.
