Masonite

Masonite wanted to simplify the door selection journey from their customers' homes by empowering them with information, letting them visualize a door in their home, and easily locate their nearest in-stock store.

Navigation

Masonite wanted one main navigation to work for consumers and residential/commercial builders. Regardless of where the user entered the website, we wanted it to accommodate a more exploratory experience as well as a more targeted journey. We added icons for door types for quick identification. We included educational content for users in the consideration phase. We also added a quick link to the door visualizer to every dropdown state so that users could always access this tool.

Wireframes

We needed to create the right balance of content that spoke to need vs. style solutions. We wanted the homepage to provide gateways to pages that spoke to the buyer’s needs. We created solution pages that focused on educating the customer and capturing their info to further nurture them. We added interactive elements such as sound clips to increase engagement and empower decision making.

The catalog page's new filters would enable buyers to quickly find the door they wanted. On the product pages, we needed to clearly lay out all the specifications of a door, while not overwhelming the buyer. Using dropdown selections to hide the specifications made it more digestible and scannable.

Design Prototypes

Images would be essential in quickly communicating the solutions we were presenting to the consumer. Talking through the content we needed was an important part of the process. We wanted it to have plenty of whitespace where the images would inspire and direct consumers to the door they were looking for.