1807121 - Make "Customize" settings screen easier to use by adding previews from first-launch experience

Status: NEW

(Firefox for Android :: General, enhancement)

Description

[Christian Sadilek [:csadilek]]

From github: https://github.com/mozilla-mobile/fenix/issues/14783.

What is the user problem or growth opportunity you want to see solved?

The first-launch experience features nice previews for selecting a theme and the position of the toolbar that make the options clearer and more intuitive. My suggestion is to use these blocks within the "customize" settings screen for a better user experience.

Quick mock-up:

<img src="https://user-images.githubusercontent.com/46764284/92324668-45efb080-f044-11ea-8b70-d789ddba97cf.png" width=350 />

Another option could be having the option in dialog menus, where the settings screen would look like this (with the dialogs appearing when tapping on the respective menu items:

<img src="https://user-images.githubusercontent.com/46764284/92325193-ef38a580-f048-11ea-8eff-e1e0413d5a77.png" width=600 />

How do you know that this problem exists today? Why is this important?

1. The previews make it a no-brainer what the different options refer to, improving ease-of-use.
2. This makes for more consistency between first launch and when the user goes back looking for these options later.
3. Specifically for the theme selection, I think the wording for the automatic theme change is much better on the first launch experience.

Currently, the customize screen looks like this:

<img src="https://user-images.githubusercontent.com/46764284/92324665-41c39300-f044-11ea-9544-929028c85bb9.png" width=250 />

Who will benefit from it?

Users wishing to customize Fenix, especially those not that accustomed to certain tech-terms (e. g., some may not know what the toolbar is).

┆Issue is synchronized with this Jira Task

Change performed by the Move to Bugzilla add-on.