I conducted a Heuristic Evaluation on my favorite online shop (Part 1)
Designers know the importance of heuristic evaluations and being able to conduct them. The evaluation basically uses the 10 heuristics (rules of thumb) principles on what is “good design.” What better way to be productive in quarantine than practice some skills you’re rusty at, right? So here I am, deciding to conduct a heuristic evaluation on my favorite shop’s website.
The shop is called Hygge Life (hoo-ga life), located in Eagle-Vail, CO, and specializing in cozy, intentional, and beautifully created pieces. It’s my favorite shop of all time and the owners are incredible! If you’re not a local Coloradoan I’d highly suggest checking out their online store or squeezing in a trip if you’re ever in Vail. *I’m actually currently sitting on a beautiful sheepskin that I purchased at Hygge Life a few months ago!
So let’s get down to business and discuss what Hygge Life is doing right and where there is room for improvement.
#1 Visibility of system status
AKA- All about feedback. Do elements respond when clicked? Is the user updated as to the status of something?
Let’s talk about some things that Hygge Life is doing right and where there could be improvements.
The good 👍: Navigation bar + Clickable posts + Quick shop
Navigation Bar- it expands! Typical user patterns would suggest that the bar drops down and gives another layer for the user to find what they are looking for. This is exactly what is happening here. Way to go Hygge Life!
Clickable posts- like many businesses, the site is used for more than just e-commerce. There are event listings, social links, and blog posts. There is a consistent action that happens when a link is clickable so that the user knows they can both click on the element and be transported to more/different content. The action and reaction are always the same, making it easy for users.
Quick shop- this is becoming more and more common with e-commerce. You see the item listed, then hover over and a user can add the item to the cart without leaving the current page on their browser. When done well it is easy and effective. The same pattern follows here to allow the user to see details, customize the size, and add to cart all while perusing from the current page.
The bad 👎: Item Status
Stores have a lot of inventory fluctuations with both limited items and recurring favorites. Hygge Life does a fantastic job of conveying the “new” items with a badge atop each thumbnail for the item. However, where it can seek improvement is in showing the “out of stock” items.
User’s don’t like to read. You might be getting bored with this (honestly kind of long) blog post right now! A user could easily miss the “sold out” message below the item thumbnail and then experience frustration when they move to the item details page and realize they’re out of luck. Having a uniform way to easily visually distinguish out of stock items from in-stock items would help mitigate expectations for users.
#2 Match between system and the real world
What? It just means that products should speak the user’s language and follow real-world conventions. Use what is familiar instead of system-oriented.
The good👍: E-commerce + Explaining Hygge
E-commerce: If a user has shopped online before, then they’ll pretty much know what to expect here. It follows typical patterns of other e-commerce platforms.
Explaining Hygge: Let’s talk about the elephant in the room. If you are not Danish you might not know what Hygge means or how to pronounce it. It’s not necessarily your typical language as a user. I think that they did a great job of introducing the meaning of the word early and providing pronunciation help as well. It happens close to the top of the page (could be called out more clearly and earlier) and likely clears up confusion early in the browsing experience.
The bad 👎: The Navigation Bar Lingo
Branding is cute and when it’s done well people notice. I think this was an attempt at branding that could be a lot stronger. The dropdowns help users find what they are looking for and understand categorization on the site. These dropdowns are confusing. How should a user instantly know the difference between “home” and “tabletop?” Also, is “home” the button to bring a user to the home page, or is it for browsing goods intended for the home? A tabletop is part of the home, so why is this in a different spot? Same questions with “cozy” vs “fire.”
Pillars of hygge are being used as navigation titles. It’s cute if the user is immersed in the concept of hygge, but it’s confusing and certainly not “normal” patterns of e-commerce website organization.
#3 User Control and Freedom
Support undo and re-do! How can a user get out of something if they make a mistake?
The good 👍: Browser Default + Shopping Cart
Browser Default: It’s a website, so users can easily use back buttons to get out and return to the previous page. It’s built into the browser so no extra points for this, but still had to be said. The site navigation helps as users can use the drop-down or clickable links to go somewhere else, like clicking on the logo to return to the home page. Breadcrumbs are used here as well, in addition to a “continue shopping feature” and ability to “x out” or click elsewhere on the screen to minimize a modal.
Shopping Cart: Users might mistakenly add items or need to remove them for a number of reasons. The site makes it easy for users to decrease the quantity of an item or remove it altogether from their cart. I can also abandon the checkout process and go back to my cart if needed. A user is not forced into completing their purchase. Would it help the store make more money? Probably. Would that be unethical? Absolutely. Hygge Life is doing the right thing by giving their users an easy out. We’ve all been on websites that don’t do that and have lost respect for those companies.
The bad 👎: None 🥳
#4 Consistency and Standards
AKA- Don’t make me think. Follow the norm or have a good reason to break it and force a user to learn something new.
The good 👍: External Standards
Like I said earlier, if a user has shopped online before, they’ll understand this site. There’s a cart feature, profile, and navigation. It is typical and recognizable.
The bad 👎: Internal Consistency
It’s already been mentioned the confusing names of “top navigation” categories, but it takes another turn from there. This is seemingly an easy fix, but there is a flaw in the organization here. Only three shopping categories out of six have a “shop all” option. So is it a pattern or a fluke? Not having consistency is only adding to confusion and frustration for the user.
#5 Error Prevention
Can we help users avoid mistakes before they happen?
*I’ll avoid diving too deep into the payment processing system as it was not created by the shop. Essentially everything mentioned in #3 applies here too. Giving back buttons, allowing abandoning the cart and adjusting quantities are essential to help users only purchase what they intend to or give information where they wish to. Only good things here, no bad.
Part 2 coming next week! This became way too long 🙂