Automattic / wp-calypso

The JavaScript and API powered WordPress.com
https://developer.wordpress.com
GNU General Public License v2.0
12.4k stars 1.98k forks source link

Provide more guidance about time taken for backup & restore to the customer #82922

Open vishnugopal opened 11 months ago

vishnugopal commented 11 months ago

How do we estimate the time that will be taken for a migration? If the backup size is large, if it has lots of attachments, etc. we estimate a large backup time.

vishnugopal commented 11 months ago

See: D125512-code

vishnugopal commented 10 months ago

cc @javierarce Can you work on a better design for the in-progress screen when you get time? Here's the info that is available:

backup_percent (the real backup progress percentage)
backup_size (total size of source backup, in bytes. It's the size of the zip)
backup_started (timestamp)
site_size (total size of source site, in bytes)
restore_percent (the real restore progress percentage)
restore_message (message output during restore. It is something like "moving file", "writing DB", etc.)
restore_failure (message of failure, if any)
restore_started (timestamp)
comments_count counts of the source site
plugins_count counts of the source site
posts_count counts of the source site
tables_count counts of (DB) tables of the source site
themes_count counts of the source site
uploads_count counts of the source site
real_percent (backup + restore)
wp_version (of source site)

The intention of the design should be to give more confidence to the customer that the migration is "not stuck".

There are at least 3 stages during the migration process: init, backup, restore. During the init and backup steps, a lot of information above is not available if it's the first time doing a backup. But during the restore step, all this data should be available.

javierarce commented 10 months ago

Design-wise, I think we could use the current loading step and its title to display the different states of the migration:

image

image

In cases where we can display information about the items we are processing, we could add a counter like this:

image

Another approach I've considered is adding a new line between the progress bar and the main header, where we would display the messages of the different states of the migration:

image

I prefer the options on top, though, because they are more compact and, in a way, similar to the loading state with the animated dots we use in other onboardings.

Regarding the progress bar: the designs above assume that real_percent (or another variable) accurately reflects the progress of the entire process.

But if that's not true, I think it's ok if we treat each stage of the migration independently. In that case, when importing plugins, the progress bar would just show the percentage of plugins that have been imported, and it would reset again when we start importing the posts, etc. In this situation, we probably won't need to display the written progress label that I showed above.

cc: @crisbusquets @JanaMW27 @saygunnyc in case any of you can give this a look.

crisbusquets commented 10 months ago

@javierarce I also prefer the options on top, because the heading is dynamic and easier to spot. As for showing the current and remaining steps, have you tried adding it to the headline, with the same font-family and size?

That said, there's one thing I like about the second option: we reinforce that "we're safely importing your data", which isn't clear in the first option.

The choice will depend on what we want to highlight: the different steps in the process vs the value proposition.

javierarce commented 10 months ago

Thanks, @crisbusquets!

As for showing the current and remaining steps, have you tried adding it to the headline, with the same font-family and size?

Do you mean this? It was the first thing I tried, but I didn't like how big the numbers looked and wanted to emphasize the title. That said, I don't have a strong opinion, this could work too.

image

crisbusquets commented 10 months ago

Thanks, @crisbusquets!

As for showing the current and remaining steps, have you tried adding it to the headline, with the same font-family and size?

Do you mean this? It was the first thing I tried, but I didn't like how big the numbers looked and wanted to emphasize the title. That said, I don't have a strong opinion, this could work too.

image

Yes, I meant this :D I suggested it because that font was too small, and I think the more we inform the user about the process, the better.