Woocommerce-admin: Onboarding - store profiler: change JP and WCS screen placement

[pmcpinto]

Currently having this screen as the welcome screen is not producing great results. We think that in terms of experience it will be better if we allow users to fill first information about their store and then giving them the option to install & connect Jetpack and WooCommerce Services. This screen and subsequent install & connect flows should be placed at the end of the Store Profiler. So just to summarize:

• The first screen becomes the Store Details screen and the usage tracking authorization message is triggered in this screen (it already happens when the user has JP and WCS installed, because the JP/WCS is skipped). I guess that we need to change the logic to always display the auth message in this screen.
• The JP and WCS screen start being displayed after the user completes the Theme step
• We need to change the name of the event that's triggered when the user clicks in one of the buttons on this screen (wcadmin_storeprofiler_welcome_clicked) to wcadmin_storeprofiler_install_plugins. The event props stay the same.
• We need to add a new event to track when we just have a pageview on this screen: wcadmin_storeprofiler_install_plugins
• If we have time during this cycle we should also consider revamping the design of this screen, to make it more compelling. Design proposal here.*
• The rest of the JP and WCS install & connect flow remains the same.

*- it would be useful to have an estimation of how long it will take to finish this with or without the screen redesign.

[joshuatf]

If we have time during this cycle we should also consider revamping the design of this screen, to make it more compelling. Design proposal here.*

So it looks like in the new design those 3 benefits are always shown and never change- is that right?
/cc @pmcpinto @jameskoster

Note the estimate for this issue does not include the design changes which I'll open another issue for so we can tackle.

[jameskoster]

@joshuatf I added situational designs here. One for when neither Jetpack or WCS are present. And one for when WCS isn't present, but Jetpack is.

[joshuatf]

One small issue we have updating this flow is that currently the cart modal shows products for purchase on the last step. But since the last step is possibly sending users to connect Jetpack, they won’t see the cart modal.

Maybe this is a good opportunity to also focus the cart modal efforts in the task list, showing the cart modal after the initial task list welcome modal. What are your thoughts, @jameskoster @pmcpinto ?

[jameskoster]

Good point. I wonder if we should just skip the connection flow altogether at this stage. Installing the plugins is the main CTA, and we have a prompt to connect during the tax configuration task.

[joshuatf]

I wonder if we should just skip the connection flow altogether at this stage.

I'm okay with this as well since we have multiple opportunities to connect later on where needed. @pmcpinto Any thoughts on this?

[pmcpinto]

It seems to be the best approach, I'm just not sure about displaying the cart modal right after the welcome modal. I would go with the following:

• Display Jetpack/WCS screen
• Install and activate extensions (skip the connection flow)
• Redirect to the task list and show the welcome modal

We already have a task for finishing the purchase, so I feel that we don't need to show the modal beforehand. Makes sense?

[pmcpinto]

I created a funnel and 85% of users that select paid products skipped moving forward to the checkout, so we're ok moving forward with this approach.

Actually we don't have any true value for the purchase_install prop of wcadmin_tasklist_modal_proceed_checkout. @joshuatf can you check if the event tracking is ok and if it's being displayed just in the cart modal displayed in the task list or in the modal displayed at the end of the store profiler as well? Thanks

[joshuatf]

@pmcpinto Sounds good on the changes.

It looks like I must have incorrectly set the purchase_install prop in the modal previously or broken it somewhere on the way. Will fix that in the PR for this issue.

[pmcpinto]

It looks like I must have incorrectly set the purchase_install prop in the modal previously or broken it somewhere on the way. Will fix that in the PR for this issue.

@joshuatf, thanks for the heads up. Pls ping me when the issue in the event tracking is fixed.

[pmcpinto]

Hey @joshuatf, I think that the change to the loading screen that's being discussed in this p2 should have a different GH issue. What do you think? Is it something that can be implemented relatively quickly?

[joshuatf]

What do you think? Is it something that can be implemented relatively quickly?

It's relatively quick, but to keep the size of https://github.com/woocommerce/woocommerce-admin/pull/3739 down, we'll handle in a follow-up so another issue for that would be better.