1781091 - [Cleanup] Update RTAMO about:welcome page to use MR design

Status: VERIFIED FIXED

(Firefox :: Messaging System, enhancement, P3)

Description

[Ania]

The behavior of the RT AMO page remains the same (as described here), and we simply treat is as the very first card in the new user onboarding flow that needs to be brought into consistency with the updated onboarding UI.

Current flow for Windows

1. A user goes to an extension detail page (via search, marketing campaign, browsing AMO, news article, etc) from a non-Firefox browser
2. A user selects “Download Firefox to get this extension”
3. A user arrives on 'the regular' download Firefox page, downloads Firefox.
4. Firefox opens about:welcome page with RT AMO UI
5. User clicks “Add the %extension name%” button from the about:welcome page
6. Install is initiated, and the permission prompt drops from the icon in the URL bar. The about:welcome is showing in the background.
7. User clicks “Add”, successfully installs extension into their new Firefox browser, and is directed to the next step in the onboarding flow (e.g. pin to taskbar).

7a. If a user clicks “Cancel”, they are also taken to the next step in the onboarding flow.

If the newly installed add-on includes its own onboarding tour that opens a new tab, that new tab will come into focus. To see the Firefox onboarding tour, the user would have to navigate back to the about:welcome page.

Figma file for updated designs: https://www.figma.com/file/2TrMkNefxzhMCXjUqM8KIy/MR1-2022-Onboarding?node-id=4708%3A107325

Please note that Nightly and Release builds need different background images.

Comment 1

[Emily McMinn :emcminn]

Hi Ania! I've got the RTAMO page updated based on the new Figma designs, but I wanted to double check what the expected behaviour is. The existing RTAMO page doesn't flow into about:welcome when complete; after a user installs the add-on (or clicks "not now") we call 'OPEN_AWESOME_BAR' to focus the address bar and allow the user to start browsing. Is it the intention that this behaviour goes away and we move to the rest of about:welcome instead?

Comment 2

[Ania]

Hi Emily!
I think there is value in taking users through the about:welcome flow after rt amo page. It’s dismissable, so hopefully they won’t be bothered by it, and it can potentially help us win pins/set to defaults.

Let me check with Venetia though, as perhaps there might be an idea for an experiment/alternative flow for these users (e.g. offering them more advanced features and cross-promoting other products) in about:welcome.

Comment 3

[Emily McMinn :emcminn]

Attachment: Bug 1781091 - Update RTAMO to match MR1 designs

Comment 4

[Emily McMinn :emcminn]

After some investigation, I'm going to suggest we split this into two chunks - applying the new MR1 styles to the RTAMO page (done in the attached patch) and overhauling the behaviour of RTAMO.

The way things are at the moment, the about:welcome and RTAMO flows separate very early on based on a template flag in the JSON. There's no easy way to go from one to the other without kinda breaking something - either we clear attribution and refresh/redirect after RTAMO which would break a lot of our telemetry, or we duplicate the about:welcome code inside RTAMO which isn't really efficient.

Re-styling RTAMO is a quick intermediary step, and then we can prioritize overhauling the behaviour based on the traffic to RTAMO (which has historically been pretty low, see https://mozilla.cloud.looker.com/looks/721)

Comment 5

[Punam Dahiya [:pdahiya]]

If we remove pre-MR images and styles , we should move RTAMO to use MR design

Comment 6

[Vtay]

How much effort might it take to re-style RTAMO?

Comment 7

[Emily McMinn :emcminn]

@venetia I've actually already done this, I just had to put off landing the patch due to needing review and folks being busy :) It's reviewed and ready now and should land today.

Comment 8

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/8f8f28751596
Update RTAMO to match MR1 designs r=mviar,fluent-reviewers,flod

Comment 9

[Cosmin Sabou [:CosminS]]

https://hg.mozilla.org/mozilla-central/rev/8f8f28751596

Comment 10

[Emily McMinn :emcminn]

Currently we have an issue where MacOS Monterey can't show RTAMO due to a problem with attribution; would it be possible for QA to verify that the UI is displaying correctly on a pre-Monterey Mac?

Comment 11

[Alex Cornestean]

Verified as Fixed on the latest Nightly (109.0a1/20221121153827) under Windows 10 x 64 and macOS 11.3.1 Big Sur.

The RTAMO page is properly shown in the new MR1 style, confirming the fix.

On Windows, I triggered the RTAMO flow normally and downloaded Firefox Release. After that, I copied the postSigningData file created with the install of Firefox Release and pasted it in the installation folder of the latest Nightly I also downloaded and installed. Then on Nightly I accessed about:welcome and the new RTAMO page was displayed.

On macOS, I forced attribution in Nightly based on https://bugzilla.mozilla.org/show_bug.cgi?id=1784121#c4 and the accessed about:welcome. The new RTAMO page was properly displayed here as well.

Functionality wise, clicking the “Add <add-on_name>” blue button, will install the add-on, while clicking “Not now” will open the Awesome Bar for browsing.

For further details, see the attached screenshots.

Comment 12

[Alex Cornestean]

Attachment: Screen Shot 2022-11-22 at 12.12.01.png

Comment 13

[Alex Cornestean]

Attachment: 2022-11-22_11h45_43.png