Image by Pexels from Pixabay

Small Changes, Huge Impact! How design changes can make or break a website!

Omardabbas
Edraak Engineering
5 min readOct 31, 2020

--

Working on a platform that garners millions of page views per month is exciting… yet daunting!

On the one hand, we gain access to mountains of data, which we can mine and analyze. On the other, we understand that even the smallest of changes can trigger results we never expected!

At Edraak, our target audiences vary from teenagers (and younger) to older users in their sixties or seventies — a key aspect we keep in mind when implementing any new change.

In this blog post, we will examine two changes we had previously applied to the platform. Given their small scale, you’ll be surprised at the outcomes they produced!

Hiding a CTA?

When someone lands on your website, you need to do everything possible to turn them into regular users or convince them to complete a desired action (like buy a product or register for a course). This is achieved by highlighting your unique selling point and ensuring your call to action (CTA) is visible across the webpages.

While analyzing heatmaps, which we regularly utilize at Edraak using Hotjar, we discovered an interesting insight.

(Before we continue, we should mention that, based on our target audiences, over 70% of our users browse the platform on mobile devices, presenting us with the challenge of making the mobile view as convenient as possible for all visitors.)

In the image above, you can see our homepage heatmap for mobile visitors. The homepage design was meant to be direct and minimal, comprising a prominent search bar with the option to scroll down to browse courses and programs.

Still, this design had overlooked a user journey that entailed first signing up then moving on to discover the available courses. In doing so, we had unintentionally added an extra step for users seeking the signup button.

It’s evident from the ‘heat’ in the top left corner of the image that users had to click on the hamburger menu to find the signup button.

That’s why we decided to make the signup button more prominent by removing the extra search bar in the header (next to the hamburger menu) and adding a button that says ‘Sign Up’ for non-logged-in users and ‘Dashboard’ for logged-in users.

To measure the effectiveness of this design amendment, we defined an audience on Google Analytics that shared the following characteristics:

  • New users
  • Mobile-browsing users
  • Number of landings on the homepage

Before going live with the change, we calculated that 9% of users reached the signup page based on the old design.

Within hours of the new design going live, that same percentage rose drastically!

We monitored the behavior data over a month, and the ‘micro-conversion’ rate jumped from 9% to 21%! A staggering 133% increase!!

Revamping the Signup Form

Last year, while analyzing numbers related to our signup form, we noticed a high exit rate (approximately 40%) according to our Google Analytics data.

Consequently, this led to a smaller percentage of visitors converting into platform users. On average, this percentage ranged between 19% and 25%.

The form we were using was meant to gather as much user data as possible, including their educational background, age, country, and other information necessary to improve their learning experience.

Eventually, we decided to sacrifice data collection for the sake of securing more users. Having to fill in 11 fields was simply too much! We knew that as a fact. So, we revamped our signup form from this:

To this:

The new form underwent four stages of usability testing (which we take seriously at Edraak) to create a final form that caters to a broader audience.

Ultimately, following multiple iterations, we agreed on the below form:

Interested to see the results?

The exit rate dropped from 40% to 16% over a year, and the conversion rate surged from around 20% to almost 55%, marking a 190% increase!

This was one of the most expensive lessons I’ve personally learned. Signup forms are essential to any website — be it an e-commerce store, an online educational platform, or a blog just like this. If your users can’t make it through the form, you will lose them. Possibly forever…

So, when it comes to lengthy forms, let’s admit it. We avoid watching long videos and we usually skim through long articles. Why should a lengthy form be treated any differently? Moreover, for many people, data privacy can be a no go.

For this reason, we transferred the optional and detailed fields to a post-signup form, which users fill to complete their learner profile:

A/B Testing on a Small Scale

Earlier this year, we began implementing A/B testing on our users via Google Optimize. Most tests were conducted to measure the effect of minor text and color changes on main platform components. Interestingly, some changes proved capable of uplifting the conversion rate to more than 20%! We will be blogging about this in the future once more sophisticated tests are conducted.

Tests like these can have a tangible impact on any platform. To the extent that, even for a free product like ours, it would be worth tens or hundreds of thousands once you calculate the cost per action (CPA) per learner!

Stay tuned for more blogs on the science behind data investigations and testing.

--

--