VisualEditor on mobile/Draft:Edit cards
|
Edit cards
Give mobile contributors more space and guidance to complete their edits.
|
This page talks about the Editing Team's work to implement new mobile context items in the mobile VisualEditor. These "edit cards" as we are calling them, refer to the part of the editing interface that shows additional details about, and actions related to, elements within articles. Elements like links, citations, images, infoboxes, templates, etc.
For this quarter's work, we will focus on two elements in particular:
- Adding and modifying links
- Adding and modifying citations
This initiative sits within our team's larger effort to simplify contributing on mobile, described in the Foundation's 2018-2019 annual plan.
You might find value in watching this page if you are interested in:
- Sharing what you think about the current design for these new "edit cards" (see below)
- Testing prototypes
- Getting real-time updates about new designs, user testing findings, measurement specifications,
Updates
[edit]
8-May-2019: The first set of wireframes for the new adding and modifying links edit cards are ready for your feedback. You can see a mockup of the links edit card to the right and the whole adding and modifying links workflow in this Invision Freehand: Linking with contextual inputs. To view the "freehand" as a guest, follow these steps:
- Tap this link: https://wikimedia.invisionapp.com/freehand/document/s1duRw6io
- Tap "Continue as Guest -->" in the top-right corner of the page
- Enter an email address
- Tap "Continue"
Background
[edit]This year, we are committed to helping contributors be more successful contributing on mobile, using the mobile visual editor. Core to their success, as the Design Research team's Mobile Contribution Research has shown, is:
- Contributors being able to easily find the editing tools they need to complete their edits
- Editing tasks being simple enough to complete on-the-go
However, as the Mobile contribution research and our team's user testing has found (see: Confusion modifying a link using mobile VE), where mobile context items are shown on the page, and the limited amount of space they are given, can make it difficult for to contributors to discover and use the editing tools needed to make edits. We have also found that the steps for completing these edits can be confusing and complex.
In exploring this new "edit card" design pattern we are striving to make the editable elements embedded within articles (links, citations, images, infoboxes, templates, etc.) more visible and the steps needed to edit them more clear and straightforward. We think doing so will lead to contributors having more success completing the edits they open the mobile VisualEditor with the intention of making.
Glossary
[edit]- Mobile context items
- The parts of the mobile editing interface that shows details about, and actions related to, different elements within articles, like links, citations, images, infoboxes, templates, etc.
- Edit cards
- What we are referring to the new design of the mobile context items as. These "edit cards" will show details about, and actions related to, different elements within articles, like links, citations, images, infoboxes, templates, etc.
- Context items
- The parts of the editing interface that shows details about, and actions related to, different elements within articles, like links, citations, images, infoboxes, templates, etc.
Confusion modifying a link using mobile VE
- The parts of the editing interface that shows details about, and actions related to, different elements within articles, like links, citations, images, infoboxes, templates, etc.
.gif)