Create a Performing Hostinger Migration Flow

Migrate the website to Hostinger

The migration flow is a vital page that deserves our close attention. It 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.

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.

By redesigning the migration flow, we can achieve 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.

My role in this project

I worked on this project as the only designer. The project began in late December 2023 and officially kicked off in January 2024. The expected release date is in mid-February 2024.

Simplifying the technical terms

After several interviews and data digging into the client segments, I found that most of the moving clients are coming from the mid-newbie segment. Meanwhile, some of the migration requirements are highly technical. So, it would be challenging to educate the user step by step in order to have a successful migration process.

Long-existed page

The team has maintained this page for a long period and prioritized incremental improvements. They are concerned about the potential impact of significant modifications on the users' experience and expectations despite acknowledging the existing issues with the current design.

First gateway of the other providers' users

This flow is designed for users who want to migrate their websites from other hosting providers to Hostinger. It is crucial to ensure a smooth and error-free experience, as any glitches or difficulties may drive the users away to look for better alternatives among our competitors. We do not want to miss out on retention opportunities just because of this flow.

Most asked issue from the user

Migration was the most frequently asked topic by our customers who contacted our Customer Success team about the Web Hosting product. Here are some examples of their questions:

Half of the migration process ended up failed

We receive more than 2,000 migration requests daily, but half of them fail. The causes are diverse, but the most common ones are:

Based on that initial data, we planned to conduct an interview and a mini-test (on the current migration page) during the interview. We invited six users, divided equally into two segments: newbies + learners and advanced users, and we conclude that the root cause of this mess in our previous migration flow is:

High-density information within a single page

The previous version visualized the migration flow on a single page with some input forms. However, some users did not understand what to enter in those forms. They also thought that the page lacked clear information.

This page has some forms that ask for user information, but they might be hard to understand for new users. It makes sense that three out of the five most common causes of migration failure are linked to the form.

Lacks data tracking points

The page consists only of forms, which limits the data tracking points we can use. For instance, we were unaware of the most problematic form on the migration page until we stopped using its previous version. Therefore, we resorted to interviews and conversation tagging as alternative methods.

This makes it hard to make quick design or business decisions. We have attempted some minor improvements to the page, but they did not produce the results we expected.

Therefore, our next step to address this issue is:

After doing several brainstorming and ideation sessions, the team came up with the solution that we will:

Break the page into smaller steps

The idea behind this initiative is one of the applications of the theories called the Goal-Gradient Effect, which states:

To avoid overwhelming the user with too much information, we divide it into smaller and manageable tasks. This way, the user will feel like they are progressing towards their goals, which are to migrate their website and manage it using Hostinger successfully.

Breaking the process into small steps also allows us to monitor every aspect more closely. We can obtain different types of data, such as the time it takes for the user to fill in the login details, the options that the user prefers (which we can consider automating later), and so on.

Overall, we broke the flow into 3 (three) major steps:

1. Website detection

   

   This step involves checking the website's availability and the platform it was built on. Our system can only automatically detect WordPress at the moment. Therefore, it will identify the platform if the user has used WordPress.

   
   

2. Method and/or platform selection

   

   In this step, the user needs to select the migration method and/or platform that they used to create their current website (if our system does not detect WordPress). The user can choose what kind of method is most convenient for them.

   

   In the previous image, one of the most common causes of failed migration is the nameserver connection issue. To solve that, we want to use a more aggressive approach to communicate this information here. We will put this information on a separate page and add something like a confirmation checkbox to make sure the user reads this information.

   
   

3. Migration output selection

   

   The next step is for the user to determine where to put the website. In the current flow, the user can't create a new empty website from the migration page, so they usually create a new empty website before even going to the migration page.

   In this new flow, we want to add the option for the user to create a new empty website and put their migrated website there. As for the confirmation screen, we added a new Summary page for the user to final-check the essential information of their website before our system starts processing the migration.

   
   

The business side was doubtful about this new flow because they believed that more steps for the user would lead to lower conversion. Therefore, we needed to provide evidence to persuade them to support this initiative.

And that's why we were doing …

To design the solution and get the buy-in from the upper stakeholders, we first tested the initial flow with wireframes and visual placeholders. We presented them to the segmented users and some peers who were not involved in the product or tech team.

This session helps us to identify new possibilities, such as:

Better backup file upload interaction

The current process requires the user to perform two steps when they want to use their backup files to migrate their website. They have to upload them to a cloud service like Google Drive and then copy-paste the link. The instructions are clear, but they expect that this step can be done in a single action.

This will be a note for the next development iteration to create a classic drag-and-drop upload interaction that most users are familiar with.

Clarity on estimated finished time

The current migration process can't be done in an instant way. It needed at least more than 24 hours to migrate the website completely. For some users, they need to know the estimated time before starting the migration process so they can decide if they want to migrate their website or create a new one.

We can quickly fix this and include the necessary information before launching globally.

Overall, however, this new approach is more comprehensible and informative, according to all of our testers.

Navigations

In terms of navigation, we don't think we need much change because we already have a similar flow that shows the smaller steps. We also use the same visuals and navigation as that flow.

Illustration style

For the illustration style, I don't want to spend too much time on it because the illustration can be changed later. I used the same basic outline for all the options and highlighted the chosen one to show what the users would get if they picked that option. Here is one of the examples:

Reflect the real-life conditions

Many people who want to migrate their websites ask how to log in to CMS. We were aware of that, and this can be confusing. So, we wanted to try a new approach and designed our login form to look like the WordPress (or another CMS) login page. This way, the user can easily enter their username and password without any hassle.

Since we protected the file, I can't attach the playable prototype, but you can see the demo video showing what the final flow looks like.

1. Website detection flow

   

   
   

2. Method selection (if WordPress automatically detected)

   

   This is the flow when the user chooses to use Admin Panel login details.

   

   This is the flow when the user chooses to use the backup files.

   
   

3. Platform selection (if WordPress is not detected)

   

   
   

4. Migration output selection and summary

   

   This is the flow when the user chooses to create a new empty website for the migrated website.

   

   And this is the flow when the user chooses the existing website. In this flow, I add a warning for the user that they will overwrite the website files and contents if they choose this option.

We just shipped this initiative globally in less than a month, but a week after the release, we could learn that this initiative:

Exponentially increasing the migration submission success rate

As the starting point, we will not be talking to the conversion or successfully migrated users. In the previous migration process, we observed a notably low submission success rate of approximately 15-20%. Indeed, this metric tracks the total number of successful migration submissions performed by the users.

Through our latest initiative, we've achieved a groundbreaking milestone, surpassing a staggering 60% success rate in migration submissions on average per week. This achievement marks a significant leap forward, marking the highest success rate ever achieved since the inception of our migration function. But still, this is still the first week after the release.

Potentially reducing the common causes of failed migration

As mentioned during the discovery phase, common causes of failed migrations included issues with login credentials, nameserver connections, and uploaded files. Since implementing this initiative, we've observed a nearly 50% reduction in these occurrences on a week-to-week basis. While we acknowledge that the data sample is still relatively small to draw final conclusions, the significant decrease in these common issues is evident. This initiative has the potential to mitigate these challenges further, and early signs are promising.

As this product is still fresh from the oven, I believe that the team will:

Track more of the user behavior

As we begin tracking user behavior with the new flow, our aim is to gather extensive data to inform our next iteration's priorities. After monitoring user activity over the past week, we've identified a significant drop-off occurring when users attempt to upload backup file links. This observation strongly indicates that addressing this issue should be our immediate focus.

More automation

To make the user finish the steps faster and to get more accurate data, we have a plan to implement more automation and auto-detection for the next iteration. For example, right now, we can only detect WordPress installation, so maybe we can detect other platforms like cPanel, etc.

Prepare the new "upload files" interaction

As mentioned earlier, one of the issues identified during testing and tracking is the 'upload backup file' step. To address this, I have designed a drag-and-drop interaction, a widely used method for this purpose.

In summary, the migration flow is a critical aspect of our platform, serving as the first point of contact for users and offering significant revenue potential. However, it's evident that the current flow is not meeting expectations, with a notably low success rate and frequent user inquiries. Through redesigning the migration flow, we aim to achieve a higher success rate, reduce user frustrations, and ultimately enhance the overall user experience. And eventually, this initiative can potentially serve that goal.

Moving forward, our focus will be on addressing common issues such as login credentials, nameserver connections, and uploaded files while also implementing automation and streamlining the upload process. By continuously monitoring user behavior and refining our approach, we are committed to delivering a seamless migration experience for our users. Thank you for your attention, and I'm excited to see the positive impact of these initiatives on our platform.