This client wanted to create a new “get a quote” landing page for their site. They already had a design for the page chosen, but since we had previously been working with them, they wanted our input before publishing it. A designer on our team mocked up a redesign for it, but the client wasn’t thrilled about the direction since they were making uniform updates site wide. They asked me if I could take it over and send them a second option.
My Role:
Primary UX Researcher and Designer
Scope:
5 Week Client Project
The First Iteration:
The original design sent to us by the client was essentially a page-view version of their quote modal. The first iteration the design team presented, was a more structured version of the form field, with a few questions removed and value-props added on the right.
Results:
The client raised concerns over the layout of the form. The site was moving towards a more uniform layout, with a hero image and CTA, and they worried this design went against that. When we tested this for a week, we also saw no increase in contact information gathered. After this, the client asked me if I could take the design lead since I had previously worked with them.
Opportunity:
Since we knew the client wanted to place this form on a new landing page, I could use existing landing pages to make an accurate guess at the amount of traffic it would get. I also knew that I could look back to previous tests that had completed to better utilize their conclusion data. The most recent form test we ran on the homepage, showed that when we limited the number of questions on the screen at one time, the users were far more likely to fill it out. We had also seen similar successes adding value props above the fold when testing other pages.
Process:
With a plethora of information from previous tests, I needed to address the client’s main issue, which was the general layout of the page. The company was updating its layout to match some of its competitors, and was focused on keeping that same aesthetic. To help ease the clients’ concerns, and to gain a better perspective of the site’s main competitors, I ran a competitor analysis, focused on specific elements. In particular, I noticed that a few used steps to keep the number of questions at one time to a minimum, and others used a side-bar type design to keep all the information above the fold and in a prominent location.
Competitor Analysis
With our quantatative data organized, I wanted to bring more qualitative data into the fold. To do this, I began creating user personas with the market research and previous surveys we ran. The findings closely matched what are previous data had found. Users wanted a more simplified way to get the plan they want.
Final Design:
The final design is the culmination of our findings. I incorporated different parts of the competitor analysis including the side-bar and multi-step form. I also matched the new direction of the site, using lifestyle imagery and a darker background color in the hero of the page. For mobile, I convinced the client that the imagery was not as important as getting the CTA above the fold, so we agreed to remove it.
Results:
Compared to the first iteration of this test, we saw an increase in lead gen rate by nearly 15 percent. We also saw an decrease in bounce rate from 56% to 34%. The results we received on this test, led to the client updating other pages on the site to match the style we implemented here.