VisualEditor on mobile/Section editing

In late 2018, the Editing team conducted user research to understand editors' experiences using the visual editor on the mobile site. The research showed several disruptive workflows and unclear features. These problems make it hard for editors to focus while improving and/or creating an article. Based on this research, the Editing team developed several ideas for improving the visual editor. The goal is to help editors focus on content editing, by reducing distractions and confusion about how to edit on the mobile site.

Section editing
After collecting community feedback on our ideas and conducting a usability test, the Editing team chose to fix section editing.

Existing workflow:


 * 1) Decide what you want to change, while reading the article on a mobile device.
 * 2) Then, scroll around the page to find the button that opens the editing screen.  Sometimes, editors have to scroll through many screenfuls of an article to find the button.
 * 3) Once the editing screen is open, scroll back down to find the part of the article that you want to change.  Sometimes, editors can't find the place that they wanted to change.

We believe scrolling a long distance to find the edit button is distracting. Instead, once you know what change you want to make, you should automatically be guided to the edit command function for the part of the article you want to change. This approach is called Section Editing.

The Section Editing feature for mobile will let you change any section of an article by tapping a contextual edit button. When you tap the contextual button, you will be transported from reading to editing, in the same part of the article that you were reading. You will not need to scroll as much and potentially lose your place.

Instructions
You will be using the prototype on your phone and then going to the discussion page to provide your feedback.


 * 1) Please go to the prototype on a mobile device: http://visualeditor-prototype.wmflabs.org/wiki/Sections
 * 2) Go to the main menu (the ☰ button at the top of the screen) and log in with the user name   and password
 * 3) Tap on the pencil icon next to the sub-heading titled "Reception".
 * 4) *Note: If you are in wikitext mode, you will need to change to the visual editing mode by tapping on the pencil icon in the toolbar and tapping on "" (not "").
 * 5) Add a sentence or edit to the first paragraph.
 * 6) Tap the check button.
 * 7) Tap "Save..."
 * 8) Fill in your feedback on this discussion page.

⚠ Keep in mind that since this is a prototype there might be some bugs or quirks that you'll come across, and many links will be disabled. If you think that you've encountered a bug, please describe that in your feedback.

Feedback
We are interested in your thoughts on the prototype. Is this a better experience? Was it easier for you to stay focused on where you were within your edit? Was this expected behavior? Any and all comments are appreciated! Feedback will be summarized on the main project page.

Section editing project updates
On this page we will share our progress on the development of this feature.

2019-01-11

 * Added instructions for first section editing prototype. This works on mobile and desktop. Please follow the instructions and then add your feedback.