Increasing Migration Success Rate

Hostinger International

Effective Onboarding

Churn Analysis

Figma

Prototyping

User Research

Data Analysis

Increasing Migration Success Rate

Hostinger International

Effective Onboarding

Churn Analysis

Figma

Prototyping

User Research

Data Analysis

Increasing Migration Success Rate

Hostinger International

Effective Onboarding

Churn Analysis

Figma

Prototyping

User Research

Data Analysis

The migration flow is a vital page that deserves our close attention. It is the first impression that migrated users get from our dashboard. It also represents a possible source of revenue if the users continue to use our services.

However, the migration flow is not performing well. It is one of the most common issues that users contact our customer support about. The data shows that the migration success rate is very low. We need to improve it.

After redesigning the migration flow, we achieved a higher success rate and more revenue potential. Moreover, we can reduce the number of user inquiries related to the migration.

This article will give a brief overview of the process and the outcomes without revealing any sensitive data, as per the company policies.

Project Background

Migration flow is the first impression that users get from our dashboard. It also represents a possible source of revenue if the users continue to use our services.

After a deeper review, we got that this flow have some problems, such as:

  • Migration issue has the most tickets from customer success team
  • Only ~20% from the total visitors are successfully submitted
  • From the successfully submitted requests, less than half of them are successfully migrated

Research

The problems that we discovered are still wide, so we need some further and deeper research to get into the core problems and what disrupt the users from achieving their goals. For this case, I used these methods:

Desk Research

Frequent issues from the users' conversations with agents:

  • Why my migration request rejected?

  • What URL should I type when I want to upload my backup files?

  • Very unclear information on what should I fill

  • What do you mean by login URL in this form?

  • I can do it easier by myself in another provider, why I can’t do that here?

Here are the cause of the failed migration, based on what our system been captured:

  • Unaccessible WordPress or other CMS’ login URL

  • Nameserver connection issue

  • Unsupported uploaded files


Here was the funnel analysis results (the numbers are confidential)

Qualitative Research

Conducted user interviews

I invited 3 users that migrated from another hosting providers, and I asked them these key questions:

  • What motivate you to migrate into our service?

  • What step do you think is the most difficult in order to migrate your website? And how you solve that?

  • What kind of ideal process that you expect to do in order to migrate your website?

  • How can you say the migration process of your website is successfully done?

Conducted evaluative testing sessions

In the same session with the interview, I also gave the users some scenario to get their way of thinking on filling out the migration form. These are the key scenarios:

  • How do you find the migration feature?

  • Fill the form using the details from the brief

  • Try to use the admin credentials

  • Try to use the website backup files

  • How do you know if the process is finished?

From those researches, we got the conclusion that this was how the user's doing and feeling when submitting a migration request

From those researches, we get these key themes and insights:

Density

There’s a lot of technical information and things going on inside the current version of migration page that makes some users failed to understand the context of the needed questions.‍

Transparency

The user can’t really tell what comes next after they submit the website migration request, and that makes some of them feel anxious when clicking the Submit button.‍

Error prevention

In the current version, the user will get the error notification after the migration request submitted and processed, and it takes too much time for them to recover from that errors.

In summary,

The user that wants to migrate their website needs a clear and detailed explanations about the migration requirements, so they can migrate their website easily.

Constraints and challenges

Before jump to the ideas and to got the happy-ending for all of the parties, I collected the insights from the team as well, moreover the engineers and product higher-ups. And these what they were concerning about this project:

‍Short timeline

As the project was to solve a "generational" problem, the team already felt the frustration as well when working on the tasks that related with this issue. So the team want to have a tight timeline and limited resources to solve this migration issue

Tracking-rich design

One of our bottleneck in solving this migration issue was the lack of behavioral data on the previous version of the migration page. It was because the team had a lot of constraints when want to add the tracking due to the dense page layouts. So the new solution must be tackling this one as well.

Main concept

From the mentioned constraints and some brainstorming sessions, the team converge the rough ideas into the main concept, we can quickly get the idea and refer to these main concepts:

Expand
  • Instead of fit all of the information and form fields in a single page, we prefer to make the form as step-by-step

  • Simple questions, but a little bit longer process

  • Reuse the existing Hosting Onboarding overall layout to fasten the process and iterate later

Automate
  • Automatically detect user’s website details, like CMS details, platform used, etc …

  • That can leads to auto-filling or even skipping some of the needed field

  • Can be done gradually in several iterations, learnings, and code research needed

New User Flow

From previous main concept, we decided to break the page into several key steps: Platform Detection, Method Selection, and Destination. We also add a summary to let the user double-check and validate their website information before requesting.


Let me break it down and compare with the previous version:

  1. Flow 1 - Platform Selection
    • Automatically detect the platform or CMS that the user currently use in their website

    • As the starting points, we will only detect WordPress as they are the majority-used CMS and then add the others gradually based on the data

    • We can also check if the user's website is online or not, so we can give them the right action recommendations


  2. Flow 2 - Method Selection
    • Similar with the previous one, but we can add more context and explanations on each methods if we separate it into different steps

    • The system will check if the inputted URLs or files are incorrect or not supported

    • Special visual treatment is needed for this step as this is one of the most cause of the failed migration


  3. Flow 3 - Destination & Summary
    • We move the order to place the destination last to make it more conversational, as we want the user to focus on what they have (their website) first, and then focus on what on our side

    • Additional information and logic needed as this is one of the most cause of the failed migration

    • Add a summary for the user to make suer about the website details, and for us to show some important post-process information

Layouts and Illustrations

As mentioned before, the team decided not to do a lot of efforts and reusing something that we already developed before and existing right now to give the users familiarity of our system.

So we reused our existing Hosting Onboarding template as the main layout, and modified some steps that needing a unique visual treatment to give the user guidance of what they should fill, and here are the layouts and illustrations style:

Final Prototype

Here is the final result of the project. This one is the base iteration that the team will explore more and evaluate. So there will be a lot to be evaluate and iterate in the future.

Evaluative Research

As the development goes because of the tight timeline, I tried to evaluate the approach to the users so we can mitigate the worst part better and to define what to do next faster so we can deliver it faster as well.

Research Questions

In this case, I used evaluative usability testing as a method. The task is: Migrate this (demo) website to Hostinger, and this is the key points that I focused on to get the behavior details of the tester:

  • How did the testers find the migration feature

  • What did the testers write in domain input step, ask expectation

  • What did the testers write in login information input step, ask expectation

  • What did the testers write in file upload directory input step, ask expectation

  • Ask about warning step key point

  • How did the testers insert the new website destination, ask expectation

Result

Compared to the previous user journey map, this was a huge improvement. All of the testers are completing the task and the design satisfaction reaching 93.33%.

Goal and Impact Measurement

To make sure that this initiative works, the team released it only on several locale and after 2 weeks, we get these results:

~60% increase of the migration submission success rate

~40% decrease of the major-caused migration submission rejection (nameserver issue, false login credentials, and unsupported backup files)


We also will measure drop-off rate, placed the tracking all over the flow, start by the page visit and primary CTAs, and keep expanding

We solved the problem, so what's next?

  1. Track more behaviors

    • Place trackers on each possible actions

    • Prioritize the expected places like

    • Make more evaluative survey at least for a whole quarter

    • Monitor heatmaps of each pages, moreover the most error and drop-off pages

  2. Better & wider automations

    • Add more client’s website detail parameters that can be identified automatically

    • Fully skip platform selection if our system can detect all of the platforms used by the client’s website

    • Completely automate the migration for Hostinger-related products, like 000webhost

  3. New interaction for File Upload

    • Implement drag-and-drop upload function, similar to Google Drive or Dropbox

    • Give a clear indication of the needed files

    • Add ability to add more or delete the uploaded files

SYAIFFOLIO

SYAIFFOLIO

SYAIFFOLIO

Create a free website with Framer, the website builder loved by startups, designers and agencies.