LegalMatch Landing Page AB Test

LegalMatch-landing-laptop
Analyzing the existing landing page

The goal for this project was to increase conversion rate by giving some visual update without changing the content structure very much since the company site is huge and it uses template that might affect in many different places.

LegalMatch-landing
Defining the problems

Main problems that I targeted were two things.

1. Site looks old: The site looks very old and brand message was not conveying to the users very clearly. The brand wanted to convey the message that helpful resource for users who needs legal help. However the old look and massive contents are rather adding the needs to make effort for users to get the right goal achieved.

2. Typography can improve to display text heavy contents: the site is very content heavy, although the typographically the contents were not sorted out for the better information architecture. The useful contests are existing but it is not welcoming or tempting for users to easily click through.

Solutions

Typographical update

Because this page is text heavy, differentiating and contrasting the text was important. I applied header font as serif font, content fonts for sans-serif for visual hierarchy, as well as legibility for users.

Displaying article contents

Since there are a lot of contents we could display, I incorporated similar design as newspaper companies’ websites. The content became more visible and each article looked more different from each other by having its own photos.

Design and implement

For this project, since the structure of the page was set, I directly implemented the site with HTML and CSS basing on the existing sources. This way, the design and implementation and iteration process happen quickly.

LegalMatch-AB-index
Test result

Within 10 days, the effect of this updated design became obvious winner. We made improvement rate for one of our goal for about 29.3%.

The conversion rate went up from 6.88% to 8.90%.

AB-test-result1