Improved Conversion Rates by 30%

Introduction

A home page is often the customer’s first impression of a company. It tells customers what your company is about and what they can do on your website. It’s imperative to provide users with a leading unique value proposition (UVP) so that your website can be distinct and memorable from others. It’s also imperative to provide users with the right information and a user-friendly layout to accomplish the primary goal of the website.

In this portfolio piece, I detail how I spearheaded the redesign of my previous employer’s website home page using data-driven insights I gathered from heatmap, click rate, and competitor analyses. I iteratively refined the design through collaborative feedback sessions with cross-functional teams, including marketing and development. I worked with development to A/B test the redesign, resulting in a 30% increase in loan application starts.

The Original Design

The primary goal of the student loan website I worked on is to have users apply for a student loan. On the original page, shown here, the primary “Get Started” CTA in the hero takes users to a second page to pick which loan product to apply for, college loans or bootcamp loans. Users could select a loan product from there and begin a loan application.

The first section below the fold shows the two loan product cards with links to “Learn More,” where users are taken to pages with more information on each product.

Heatmap Analysis

I independently conducted a heatmap analysis of the home page to identify UX enhancement opportunities. I found that 50% of mobile and desktop users do not reach the first section below the fold. I also found that the average rate of clicks per visitor is nearly double for mobile users compared to desktop, primarily due to top nav dependency.

My proposed solutions were to:

  • Bring more content above the fold and design a layout that will draw more users down the page on mobile and desktop

  • Create a direct path to the loan applications from the home page hero and eliminate unnecessary clicks to reach goal

  1. Log In - 13.12% of total

  2. Apply Now (in the top nav) - 3.7% of total

  3. Get Started (in the page hero) - 3.36% of total

  4. Learn More (in the college loan card) - 2.16% of total

  5. Loans (in the sub nav) - 1.03% of total

Top Clicked Items on Mobile

  1. Hamburger menu - 14.72% of total

  2. Get Started (in the page hero) - 5.31% of total

  3. College Loans (in the nav menu) - 5.13% of total

  4. Apply Now (in the top nav) - 2.53% of total

  5. Learn More (in the college loan card) - 1.18% of total

In my mobile analysis, I found that the top clicked items were similar to those on desktop, except that more users clicked on the “College Loans” tab in the nav menu on mobile. This again suggests that users are seeking more information on the product, but were unable to find the the direct link on the home page as it was below the fold. It may also suggest that there may be confusion about where the “Get Started” and “College Loans” links take users as they were clicked at similar rates.

My proposed solutions were to:

  • Bring links to start the application and learn more about the products above the fold on mobile

  • Design the layout and copy to clarify the intended action for the “Get Started” button in the hero and links to the informational college loans page

Click Rate Evaluation

Top Clicked Items on Desktop

During my click rate evaluation of the desktop page, I found there was significant engagement with both CTA buttons above the fold, which suggests returning users are anxious to log in to their accounts, and many new users are anxious or start their loan application process.

The 4th and 5th most clicked items are centered around product information and user research, which suggests some new users are still in the research phase of their journey.

  • Proposal: Provide a research-centric user path for info seekers by adding secondary 'learn more' CTAs above the fold for College Loans and Bootcamp Loans that go to their respective information pages

Competitor Analysis

I conducted an analysis of three competitor website home page hero sections. I noted information about their headlines and sub-headlines, how they illustrated their products, and how they helped users accomplish their main goal, application starts, and learn more about their products.

Competitor 1:

  • Clear UVP in headline

  • Differentiated hero sections for all pages

  • Direct links to loan application and to check status of application above the fold

Competitor 2:

  • Clear UVP in headline

  • Loan category cards above the fold with direct paths to product pages (on hover the tiles flip over to reveal more information about the loan)

Competitor 3:

  • Weak UVP

  • First step of the application is embedded above the fold

  • Influential information above the fold (rates)

The Redesign

I took a new approach to redesign the home page hero section. I aimed to give it a modernized appearance while preserving the familiar brand identity loved by returning users. I also prioritized addressing the key issues identified through my heatmap analysis, click rate evaluations and competitor analysis.

Primary changes I made in the redesign:

  • Clarified the unique value prop (UVP) in the headline. Reduced and decluttered copy to reduce cognitive overload

  • Leveraged more above-the-fold real estate to appeal to users and naturally drive them down the page

  • Moved and redesigned product cards to sit above the fold with direct and clear primary CTA’s to “Get Started” on each loan application (without additional clicks) and secondary CTA’s to “Learn More” about each loan product for those who are still in the research phase

  • Created an engaging and unique design that stands out amongst competitors and other pages on this site

  • Created a modern, illustrated landscape that aligns with the company mission and brand identity, making the website more memorable amongst competitors

The Results of the Redesign

By prioritizing the insights illustrated above, I not only revitalized the aesthetic appeal of the home page hero but also significantly enhanced user engagement and interaction, ultimately driving tangible improvements in conversion rates.

I worked closely with development to run an A/B test of the redesign with the original design, and the results showed a clear winner.

There was an average 30% increase in conversions of college and bootcamp loan application starts from the redesign with a 99.56% confidence level.

Conclusion

The significant increase in conversion rates showcased in this portfolio piece underscores the effectiveness of taking a strategic approach and the impact of my design initiatives. By meticulously analyzing our website scroll and click rates, reviewing competitors, and optimizing user experience, I not only achieved measurable results but also demonstrated a commitment to driving growth. Moving forward, I remain dedicated to innovation, data-driven decision-making, and continuous improvement to sustain and further enhance these remarkable outcomes.

Next

Decreased Drop-Off Rates by 15%