JELD-WEN Website Redesign

My Role:  UX Architect

‍Key Activities: User Research, Data Synthesis, User Flows, Interaction Design - Wireframes for Desktop & Mobile,
Information Architecture
Software utilized: Sketch, Invision

‍Team size: 10-15 people depending on the feature set

‍Live URL: jeld-wen.com/en-us

Project Overview

JELD-WEN, a global window and door manufacturing brand, aimed to reposition its website to be more consumer-focused, enhance user engagement, and streamline content management. The goal was to drive more sales leads, accelerate content publication, improve customer satisfaction, and empower sales teams. The results? We crushed it.
At the beginning of the project, we engaged in stakeholder and personnel interviews to identify the pain points they were hearing from consumers.
We then took stock of the existing site to identify where these pain points might be coming from as well as identifying areas where more modern methods could be used to improve the user experience. We employed user-testing to validate specific metrics that the client wanted to see the most improvement from.

With 400+ pages of content and over 20 unique page types, the site demanded a complete overhaul of flow, brand experience, product education, and consumer engagement. Our team worked closely to make sure every single detail was thought out and met the users needs while also aiming for JELD-WEN's business goals. I personally was involved in solution strategy for each feature set and iterated on new flows, wireframes and prototypes for most of those features. I was one of two UX Architects on this project but the only full-time dedicated Architect, and every piece of the project was highly collaborated on between designers, creative leads, copywriters, developers, technical leads and our project producer. Below is a quick overview of the redesigned features and beyond that is a closer look at our biggest metric win.

Responsive feature redesign overview

Site Navigation
Homepage
Footer
Inspiration Gallery

Product landing pages
Product result/filter pages
Product detail pages
Interactive Product viewer

Dealer locator
Product Inquiry Form
Support page
Document search page

Other notable items:
Component Library
Custom CMS design

Case Study - "Get help on your project"

The main purpose of this website is for JELD-WEN to elegantly showcase their products to consumers and drive sales. However, because their products need to be custom ordered by a dealer in the customer's local market the goal was to have consumers easily connect with a dealer that can help them identify and purchase the right product. There are two main ways of finding dealers on this site: A general map locator and an inquiry form. The form is the focus of this case study.

Technically, the existing form on the left worked from a basic functionality point-of-view. It collected most of the information JELD-WEN needed to connect prospective customers with dealers and prospective customers received responses. However, based on the submissions received —and as we would later learn, lack of submissions received— there were significant opportunities for improvement.

First, we interviewed stakeholders within the organization to better understand the business goals for the form and collect feedback on area for improvement. Then we interviewed the employee directly charged with handling form submissions. From this interview, we learned common submisson mistakes, and observed that we had an opportunity to significantly improve the questions in order to direct prospective customers to the right dealers faster and provide those dealers with more information, making the transaction easier. We also worked with our internal Salesforce developer to assess the feasibility of the proposed changes and learn any limitations we would need to plan to work around.

With the information we gathered we began forming hypotheses to help explain issues that we had observed, while also establishing additional goals around improving other aspects of the overall experience.

Taking into account information about the users that could be looking to inquire: their age, role, project type, etc.

A few things we learned from internal interviews and research:
  • The outcome/purpose of the form was unclear to users. For example, dealers themselves were often submitting to this form when the purpose was generate sales leads for dealers.
  • Submissions were often incomplete and the required data wasn't always sufficient enough for the JELD-WEN representative to seamlessly hand off leads to dealers.
  • We needed to request more information from the user as not all dealers provide the entire product line up, so in order to mitigate extra follow-up we needed to ask more questions.
  • Interaction through this form was seen as a major business metric for the company.
User types & information:
  • Homeowners - New Builds & Remodelers
  • Builders / Contractors
  • Architects
  • Dealers (While we knew the purpose of the form wasn't directly for them, we realized we needed a means for them to submit inquiries to JELD-WEN.)
  • General demographics: People typically aged 40+ seeking premium home products.
General approach
  • One of the main goals of this entire redesign was to uplevel the experience to feel "premium," so we knew we needed the form to feel welcoming to users. It needed to convey that JELD-WEN was more interested in helping than collecting their data.
  • Provide greater clarity as to who the form was for and what the outcome would be. This would mean testing different language on users to understand what worked best for each context.
  • Keep it simple: Don't overwhelm the user with too many questions and make the questions easy to understand and answer.
  • Iterate and user test to improve submissions.
First round implementation

The existing CMS was too limited to support the revisions the site needed, which meant when we started this project the planned rebuild would take place over the course of a year. However, the client understandably wanted to see results more quickly, so they opted to improve some features of the existing site as a stopgap measure. This provided a valuable opportunity for our team to test new solutions in the current production site before the relaunch. Because the client preferred to deploy these improvements directly to production prior to user testing, we continued to leverage the form submission data as our primary data source.

30%

Increase in submissions
during the first month of implementation.

User testing

While a 30% increase in submissions is a huge win we knew we had more to learn from the user perspective. We held guided remote user tests employing the "Think out loud" method, providing valuable feedback directly from customers in the target audience.

Testing Results

Above is a glimpse of some of our feedback from the 12 users we interviewed. Due to client-provided constraints, naming the form proved a significant challenge As you can see we did not receive positive feedback on the naming of the form but the form is still named this today. While we had some client naming constraints to consider the biggest lesson we learned was the context/location in which the link was located was key to providing better sense of clarity to our users. We also learned areas to improve clarity about the actual questions being asked in the form as well as some of the UI interactions.

Final production results

300%

Increase in submissions within the first
3 months of site relaunch.

Yes, that number is correct. The form combined with the extensive redesign of the entire site produced an amazing result for our client.

Project Summary

While this case study focused on the biggest metric win this was just one small portion to a huge website that our team poured lots of thought and effort into every detail. We focused our efforts on providing not only an elegant and easy to use experience but on understanding prospective customers priorities and finding opportunities to educate and guide them to products that would best fit their needs. I'm incredibly proud as to how this project turned out and I encourage you to check out the website at jeld-wen.com/en-us
‍
‍If you are curious as to the previous version of the site and want to enjoy the differences as well that site can currently still be found at jeld-wen.com/en-ca.