Moderator Tools/Content moderation on mobile web/Preferences/Design
Below you will find some early design explorations and options for the different ways we could present this interface for mobile users. We have now made decisions about how to proceed, but your input is still welcomed.
[edit]
The scrollable tabs in Preferences are unclear to users and not a common design pattern for menus with this many items. It takes users time to realise that the tabs can be scrolled, and locating a particular category is difficult. Additionally it isn't clear what settings will be found in any given category in advance. When we reviewed other mobile websites and apps we found that it was much more common for this kind of browsing to occur via a vertical menu of options, often with explanatory text to guide users. We designed a few different options for Special:Preferences:
| Option A | Option B | Option C | Option D |
|---|---|---|---|
 |
 |
 |
|
Which option do you prefer, and why?
We added explanatory text under the menu headings in some variations - what do you think about the wording?
Modals[edit]
Preferences currently includes some items, like 'gender', which take up a lot of screen space with multiple options. If a user doesn't want to change that setting we could save screen space by not showing them all the options while they browse the page. We could, for example, move these to sub-menus that only display once clicked:
| Current behaviour | Proposal |
|---|---|
 |
 
|
In this design we've re-used a modal system used in other mobile web systems. The page wouldn't reload to open the modal. What do you think about using the modal system for submenus?
Saving[edit]
The Save button takes up a substantial amount of screen space - we wanted to explore how preferences are saved to see if there were better options. One option is to have changes save automatically upon being changed, as is currently the case in Special:MobileOptions.
| 1) Tap "Unspecified" | 2) Modal is open | 3) Tap "Use masculine terms", tap back icon (changes are automatically saved) | 4) Display changed setting and (optionally) highlight it |
|---|---|---|---|
|
|
 |
|
What do you think about automatic saving? How intuitive do you think it would be?
MobileOptions and Preferences[edit]
MinervaNeue has a 'Settings' option in the main menu, which takes users to Special:MobileOptions. In a previous iteration we suggested to have both a 'Settings' and 'Preferences' option in this menu. We are now exploring a less confusing approach where we keep the menu as is, and add a "Additional preferences" section that links to Special:Preferences.
What do you think of this approach?