Home Depot: Error Page Redesigns

Project Overview

As one of the leading ecommerce sites, The Home Depot's error page experience needed a revamp and I had the opportunity to clean them up.

The error pages I focused on redesigning included the 404 page, Pardon Our Dust Page, and the SPA page.

My Responsibilities

  • Error Page Audit

  • Conducted competitive research

  • Mapped out user flows

  • Designed wireframes

  • Collaboration with Content Strategists

  • Designed high-fidelity mockups

Existing Error Pages

Home Depot had not updated it's error pages in quite some time. With some extra bandwidth prior to the holidays, my team decided to take this project on as a quick win. We conducted a site audit of all current error pages, to not only see how a user would access them, but to also discover that the Home Depot brand and voice was not in unision. 

Competitive Research

One key component that was noticed when conducting user research was that no matter what the eccomerce site was, their brand and voice was consistent.

Some sites were quirky, while others were straight to the point. Universally however, they all were very clear in their messaging and helped the user find their way back on track.

New Page Proposals

With our new error page proposals, we aimed to stay true to the voice of the Home Depot- while attempting to bring in a bit of playfulness. 

Final Designs

After working with our content strategists and the director of UX, we decided to showcase a Home Depot associate who is ready to assist the customer.

This Home Depot associate not only stands in such a way that displays helpfulness, but they are also showcasing our core values on their orange apron which let's the customer know, we are there for them 100%.

The pages that will receive the new design treatment in the 2018 rollout are as follows: 

  • 404:  There is no system issue, but we can’t find the page. This page can have a full header/footer, recommendations, etc.

  • Pardon our dust : There is some system issue and something’s not right. Simple header/footer, if any.

  • SPA page: A page that employs when there is high traffic spikes. This page has a refresh built in so that we continue to give a good user experience.