Which of the following can help you pinpoint problems with an e-commerce site?

Learn to pinpoint website usability issues through heuristic evaluation from UXBooost’s Director of UX Research

A UX audit not only uncovers usability issues, but it also provides valuable insights to optimize website conversions and product designs.

Today, we want to share with you one of the audits our UX agency, UXBooost, performed during our last webinar, which was a website audit request from the Designer at McGraw Hill.

Before the UX auditing, let’s have a brief introduction of our Heuristic evaluation method.

Heuristics is a proven set of guidelines developed by Jakob Nielsen for identifying usability issues in a user interface design. It is commonly used when auditing digital products and e-commerce websites. It allows people to find usability issues, making quick and accurate revisions of designs even when user research data is not available.

The effectiveness of heuristic evaluation has made it one of the most requested skills for UX practitioners in recent years, therefore learning the HE technique can be really beneficial to both UX designs’ work and their career.

Performing a UX audit on McGraw Hill website

Evaluation Flow

McGraw Hill provided us with its search result page as a starting point, hence our audit would be focusing on the bottom of the conversion funnel. The evaluation flow was to start from the result list and walk through its product page, cart page, and the checkout process.

Task

Before starting a UX audit, it is important to define the task for the evaluation. McGraw Hill is the learning science company and one of the big three educational publishers in the US. So in this case, we defined our main task as below:

“Being a student, I want to buy/rent an eBook about the American government. The exam will be in three months and I would like to have the book as soon as possible”.

Guidelines

We used the 10 usability heuristics of Jakob Nielsen as our guidelines. In addition, based on our past experience in analyzing e-commerce websites, we often found the checkout process too complicated, leading to a decrease in conversions. Hence, we added the 11th heuristic: “Minimize the frictions during the checkout process” as one of our evaluation principles.

To evaluate the severity of issues, we would also give impact scores to different problems. 3 is the most severe and 1 is less severe.

1. Search result page

On this page, there were no significant usability issues. We then chose the book “American Democracy Now” as the book we wanted to buy/rent and moved forward to the product page.

2. Product page

Issue: The lack of a clear visual hierarchy and the main CTA

Violation:

- There were five CTAs asking for users’ attention, making the information architecture unclear and, possibly, overwhelming for users

- A lack of the main CTA above the fold might prevent users from completing their tasks (buy/rent a book)

• Heuristics: Aesthetic and minimalist design; consistency and standards
• Severity: 3,Task blocker
• Recommendation: Redesign the product page to create a clear visual hierarchy. Add the main CTA of “buy/rent” above the fold to have a better conversion rate

Issue: Two buttons (“Explore Options” and “Students: Purchase Options”) trigger the same function (showing purchase options) but they look definitely different

Violation: Two different buttons should not trigger the same action

• Heuristic: Consistency and standards
• Severity: 2, UX frictions
• Recommendation: Make sure that if a button triggers a function, the visualization of it should be consistent across the website

Issue:The button “sample chapter” brought people out of the main funnel

Violation: Many companies like Amazon and Google Books allow people to access the book sample directly on the page. A new tab will not meet both the current standard and users’ expectations.

• Heuristic: Consistency and standards
• Severity: 2, UX frictions
• Recommendation: Provide the sample on the page to meet user expectations and increase website conversions

Issue: The page had two main personas (students and instructors)

Violation: The page provided different functions for the two personas, causing visual clutter

• Heuristic: Aesthetic and minimalist design
• Severity: 3, Task blocker
• Recommendation: Separate different content for different personas and enable users to select if they are students or instructors before landing on this page. In the best scenario, the system would be able to determine the right content for the right personas without even asking ( e.g. if the user has already an account or he has already interacted with the website in the past).

Issue: Purchasing offers were not clear; two similar buttons triggered different functions

Violation:

The two offers’ details for renting an eBook might not be clear. What is the difference in the renting period? Why this difference in price? This difficulty in comparing similar offers can be quite disruptive for the user experience.

• The two “Rent now” buttons had a pretty similar shape and colors but with different functions. One button is for buying the book directly from the website and the other brings the user to an external platform.
• Heuristic: Consistency and standards
• Severity: 3, Task blocker
• Recommendation: Minimize the decision fatigue by making sure that differences in offers and pricing are clear. Redesign the buttons, so different buttons that trigger different actions can have different appearances.

3. Cart page

Issue: The header and the footer could be distractive

Violation: The header and the footer were not really necessary at this point of the journey and could cause some frictions

• Heuristic: Aesthetic and minimalist design
• Severity: 1, Cosmetic problem
• Recommendation: Remove the header and footer to decrease cognitive load and increase conversions

4. Account creation page

Issue: The system requested users to create an account before the checkout

Violation: Account creation requests could cause frictions and therefore decrease the probability for users to finalize their purchase.

• Heuristic: Minimize the frictions during the checkout process
• Severity: 3. Task blocker
• Recommendation: Allow users to create accounts during the checkout process or provide a guest checkout feature. Consider if security questions are crucial for the platform (security questions are not really common anymore in E-commerce)

5. Cart page (logged in)

Issue: The system brought users back to the cart page again after the account creation

Violation: Bringing users back to the cart page again can slow down the checkout process and creates friction. Users have already viewed the cart once. Also, a cart summary was provided during the account creation, and it is visualized on the checkout page as well.

• Heuristic: Minimize the frictions during the checkout process
• Severity: 2, UX frictions
• Recommendation: Test to remove this step to make the whole process smoother and to increase conversions

6. Checkout page

Issue: The system asked users to fill out data already available like the name and surname

Violation: Asking more info than what is really needed can increase the cognitive load of our users during a delicate step of their journey

• Heuristic: Minimize the frictions during the checkout process
• Severity: 2, UX frictions
• Recommendation: Use the information already collected during the account creation to decrease the cognitive load and increase conversions

Recommendation

Based on the evaluation, we have 2 main recommendations:

1. Redesign the product page.

There are many frictions that might impact user experience and conversions. Make sure to have a clear information hierarchy, to decrease visual clutter, and clarify pricing/offers so that it is easier for users to complete their purchases. These changes will help the business to increase the number of transactions and hence, its revenue.

2. Decrease the length of the checkout process.

There are too many steps in the checkout process, which might prevent users from finishing the purchase. It is advisable to diminish the number of steps and the information requested from the website. In this case, users will be less likely to leave the checkout process and the business can secure its sales.

Conclusion

Heuristic evaluation is a practical method to gather quick and useful feedback for improving products, in particular digital. Unlike other UX audit methods, it enables you to pinpoint usability problems even with resource constraints. By performing a heuristic evaluation, you not only optimize your product design or website user experience, but you can also increase your business revenues and user satisfaction.

Now you have seen a comprehensive demonstration, it is your turn to conduct one yourself!

Want to learn more about how to perform UX audits on your website with Heuristic Evaluation?

If you are interested in…

• Learning from the expert who carried out heuristic evaluations for Google, trivago, and Unicredit
• Earning a lifelong certificate to prove your knowledge in Heuristic Evaluation
• Getting easy-to-use templates for your analysis and reports
• Learning how to validate your designs
• Strengthening your expertise as a UX practitioner

… then join our online course Conduct Heuristic Evaluation in UX Design!

What to track on ecommerce website?

What are 3 types of e

Which of the following is not an ecommerce website Mark all the correct answers?

Which of these is is an ecommerce website answer?