Topic on Talk:VisualEditor on mobile/Edit cards

A living list of tickets resulting from the feedback below:

- Characters in external link URL field should be lowercase by default: T229845

- Consider ways to make entering an external URL require less manual effort: T229839

📲 Instructions

1. Please tap this link on your mobile device: http://visualeditor-prototype.wmflabs.org/wiki/Pride_and_Prejudice_5
2. On your mobile device, please complete the five tasks listed in the next section: “Tasks to test”
3. In you reply, please fill in your answers to the questions in the “Feedback” section*

*You are also welcome to send feedback via email. Please email Peter Pelberg at ppelbergwikimedia.org

☑️ Tasks to test

You will be working on a test version of Wikipedia. This means any changes you make will not affect actual Wikipedia articles.

Here are the five things we want you to try in the prototype.  Be sure to try these on your mobile device at 📲Edit Cards v2.0 prototype

1. Add a new link to another Wikipedia article; publish your changes
2. Edit the label of an existing link; publish your changes
3. Change the target of an existing link to another Wikipedia article; publish your changes
4. Change the target of an existing link to an external link; publish your changes
5. Remove an existing link; publish your changes

📢 Feedback

In your reply, we are curious to know your answers to the questions below. Of course, if you have other thoughts, we would like to know those too!

1. As you were completing the tasks above, at what points was it not clear what to do next? If all steps were clear, please tell us!

2. As you were completing the tasks above, did anything behave in a way that you did not expect?

3. What are some of your overall impressions of the Edit Cards v2 prototype? Do you find it clear? Confusing? Helpful?

4. Were you *not* able to complete any of the tasks listed above? Please tell us which tasks you were *not* able to complete.

5. How frequently do you edit using the visual editor on desktop and/or mobile?

1. All steps were clear! 2. All behaved as expected! 3. I find it well done and simple to use. 4. I completed all the tasks. 5. I almost always use the visual editor on desktop but usually I don't edit on mobile because the experience wasn't good.

Oh, wow – this is great to hear! Thank you for taking the time to try our the prototype and share your thoughts with us.

Out of curiosity: what do you remember about editing on mobile using the visual editor?

Btw, I'm Peter. I am the product manager for the Editing Team 👋

⚠️ Another thing...

As you test the prototype, please keep in mind that some links might not work, and there may be other quirks. With this said, if and when you encounter something that is not what you expect, please let us know.

1. As you were completing the tasks above, at what points was it not clear what to do next? If all steps were clear, please tell us!

No.

2. As you were completing the tasks above, did anything behave in a way that you did not expect?

Task 4 was unnecessarily difficult when one types a link from scratch. It is hard enough typing a full page name, and so is requiring users to add http or https is unnecessary, it'd suggest adding the drop down to allow the user to choose it instead of requiring them to type those hard to find keys symbols on the keyboard. Also, i'd suggest normalizing the inputted text, and make everything before and including the domain name as lowercase, because the mobile keyboard automatically makes these uppercase which looks odd. Even when pasting, one may grab a link that doesn't include the full url.

3. What are some of your overall impressions of the Edit Cards v2 prototype? Do you find it clear? Confusing? Helpful?

Perhaps put the "remove link icon" in the header, a whole line just for that is overkill.

The image seems to take quite a lot of space, and it is unnecessarily prominent. It would perhaps be better to add the image to the right hand side, so that all text remains properly aligned on the left.

For frequent actions like removing links, or potentially even stuff like removing styling, it might be useful to looking into touchscreen swiping (to the right side), as a quick way to remove these without looking for the unlink button or remove style button.

4. Were you *not* able to complete any of the tasks listed above? Please tell us which tasks you were *not* able to complete.

I completed all tasks.

5. How frequently do you edit using the visual editor on desktop and/or mobile?

Desktop, few times a month, mobile infrequent except quick typos, or using it in Structured Discussions' visualeditor.

This feedback is wonderful. We appreciate you taking the time to go through the prototype!

Now, to the points you mentioned...

1. It seems unnecessary for contributors to have to manually type https:// as they are entering an external link's URL. Typing on mobile is already hard enough.

Good catch. We're thinking through how this might work considering there are a few different protocols the URL field would need to accommodate. One idea that came up is having the URI autocomplete based on what a contributor started to type. See this task for more details: T229839#5394254

2. Some characters of the URL appear as uppercase and others as lowercase...this looks odd.

This is another good observation and this issue should now be fixed! See this task for details: T229845

3. Appearance: the "remove link" icon doesn't seem like it requires its own line. The article thumbnail seems too prominent. It might also be better to have it right justified vs. left justified as it is currently.

Remove link + thumbnail placement and prominence: it could very well be so that the visual appearance of the card needs further refinement so knowing your reaction to these particular elements gives us a good starting point if this proves to be a larger issue.

4. Removing a link is a frequent action. It should be more accessible/prominent.

Interesting. Do you often find yourself removing links? If so, have you noticed any patterns in the links you find yourself needing to remove? Are you removing links that go to the wrong places? Are you removing excessive links from an article? Something else...?

>One idea that came up is having the URI autocomplete based on what a contributor started to type.

Seems good enough.

>Do you often find yourself removing links?

Yes, it is as common as removing styling from text. Often when content is pasted it may come with unnecessary links.

>If so, have you noticed any patterns in the links you find yourself needing to remove?

Yes, external links often need to be removed because they don't need to be within the text, and mostly belong in the references.

>Are you removing links that go to the wrong places?

Yes, mediawiki itself is incredibly lax with external links. Even completely invalid nonsense is allowed, e.g.: en.wikipedia.org/w/index.php?title=Draft:Sandbox&oldid=909941390 . Visualeditor itself is no better, as phabricator.wikimedia.org/T73795 notes.

Also, nowadays, and especially in these discussions I often remove external links using visualeditor (structured discussions) primarily because this wiki blocks anonymous users from adding them even to wikimedia owned sites. I had to remove the links to the two sites above when writing this very post, and it is easier on a desktop device than a mobile because of its placement in the dialog, and because the desktop devices offers an easy way to remove it using a shortcut.

> using a shortcut.

A keyboard shortcut to be exact. No such shortcuts exist for mobile devices due to the limited usability of touchscreen devices. Physical keyboards are simpler.

Ah, needing to remove external links from within the article text and on MediaWiki...that makes sense. I appreciate you explaining these workflows!

Also, we will be posting a link to a new prototype this week that we'd value your feedback on. I'll ping you here once it's up :)

Oh and I forgot to ask: will you be at Wikimania? If you will be and you're up for talking in person, maybe we could coordinate a time over email? My email is listed on my user page.

1. As you were completing the tasks above, at what points was it not clear what to do next? If all steps were clear, please tell us!

That I need not log in. I was not comfortable to make an account or revealing my IP;

the tool was fine;

Do you put the experiment for non-English speakers? If so, changing the order of those test items could help; only changing the label does not use tool buttons, while changing labels is not what I care the most

2. As you were completing the tasks above, did anything behave in a way that you did not expect?

tool was fine.

3. What are some of your overall impressions of the Edit Cards v2 prototype? Do you find it clear? Confusing? Helpful?

I’m afraid I am using CX2 and not impressed with the test at all. It is as helpful as CX2 of course.

4. Were you *not* able to complete any of the tasks listed above? Please tell us which tasks you were *not* able to complete.

nothing. Only did not add citations as wondered if you include citations as test item.

5. How frequently do you edit using the visual editor on desktop and/or mobile?

everyday. Depending on the volume of changes in the article, or the device I work on at particular time, I use:

• desktop in either mobile view on FireFox or Desktop view switching between VE and wikitext edit,
• Safari on iPhone6 with both desktop/mobile view or switching between VE/wikitext,
• or at times wikitext edit on Mobile Wikipedia app to see if my edit is mobile friendly/paragraphs are not too long.

This feedback is helpful...thank you for taking the time to go through the prototype, @Omotecho!

Now, to the comments you shared...

1. It is off-putting to have to log in or reveal your IP address before needing to make an edit.

Do you feel this has to do with where this information is requested (before you begin an edit), the fact that this information is being requested...something else?

2. Consider changing the order of the tasks to test for non-English speakers.

We would like to have non-English speakers try the test! Having the test instructions translated would surely help. Although here, it sounds to me like you are suggesting the order of the tasks might make the test more accessible to non-English speakers. Are you able to explain this in more detail?

3. CX2

CX2 is a wonderful tool and I'm sure @Pginer-WMF would be happy to hear you find it helpful! I would just like to make sure I'm understanding your feedback correctly...are you suggesting that compared to CX2, Edit Cards are not as helpful?

4. Including citations in the test

I'm glad to hear you were able to complete all of the tasks. As for including adding and/or modifying citations as part of the test, that's possible. Although, I wonder: what led you to suggest this? Is there something about citations you would be seeking to learn?

Thank you to take care of my comment. I would mention the following;

> 1. It is off-putting to have to log in or reveal your IP address before needing to make an edit.

> Do you feel this has to do with where this information is requested (before you begin an edit), the fact that this information is being requested...something else?

It would be nice that we are contributing as IP users. I thought I could go around, byt was not able to create account as the system tells me I don't obtain the right; thus how I could contribute is only by IP address, which makes me fee uncomfortable.

> 2. Consider changing the order of the tasks to test for non-English speakers.

> We would like to have non-English speakers try the test! Having the test instructions translated would surely help. Although here, it sounds to me like you are suggesting the order of the tasks might make the test more accessible to non-English speakers. Are you able to explain this in more detail?

Editing existing link would be an easier way to start the process, but I understand you wish to have users try out from zero how to add/edit wikilink.

1. Add a new link to another Wikipedia article; publish your changes
2. Edit the label of an existing link; publish your changes
3. Change the target of an existing link to another Wikipedia article; publish your changes
4. Change the target of an existing link to an external link; publish your changes
5. Remove an existing link; publish your changes

> 3. CX2

> CX2 is a wonderful tool and I'm sure @Pginer-WMF would be happy to hear you find it helpful! I would just like to make sure I'm understanding your feedback correctly...are you suggesting that compared to CX2, Edit Cards are not as helpful?

They are both useful; as I am used to CX2 link editing, I did not find either of them superior to another.

> 4. Including citations in the test

> I'm glad to hear you were able to complete all of the tasks. As for including adding and/or modifying citations as part of the test, that's possible. Although, I wonder: what led you to suggest this? Is there something about citations you would be seeking to learn?

I was curious if I could compare version 2 with CX2; if search function is directly accessible from version 2, then your new function would be perfect for me.

1. All steps wer clear!
2. Yes. Please add a link to an article. Don't close the editor (or publish)! Set the cursor to a position where no word is automaticly selected when tapping the link button. Now tap the link button. Look at the label textbox. It's "prefilled" with the label of the link you've created before. I don't expect that behavior. This label prefill feature doesn't work with external links at all. Is there now a new feature that creates all external links now without label (like )? A feature to add links in this format was missing in visual editor but you might also want to add links like https://example.org that the users can see the adress of the website. When adding an external link, there is also a wrong auto-prefill. Those wrong auto-prefills have nothing to do with the result, they're just confusing.
3. That tool might be better to beginners and makes the editor look better. The only problem is the confusing auto-prefill bug as described above.
4. -
5. For most of my edits I use the desktop version of Wikipedia. Bevore every edit I decide wether I use the visual or the source code editor.

Hi,

I thought of giving some feedback about the prototype some time ago and took some notes for it. Unfortunately, I didn't get the time to refine and post it here. I intend to refine the notes and post some detailed feedback now. Before that I just wanted to know if feedback for the prototype is still considered. Let me know if it is, so that I could post the feedback (which I hope would be helpful :-)

Thanks!

hi, @Kaartic – how thoughtful of you.

We are always considering feedback, so if you have thoughts, we would be keen to see them. With this said, I should be upfront in sharing: for the next month or so, while we await the results of our analysis, our changes to the Edit Cards will likely be limited to minor fixes, provided we don't discover something urgent in the meantime.

So please, if you have the time, we'd value hearing what you have to say ^ _ ^

1. As you were completing the tasks above, at what points was it not clear what to do next? If all steps were clear, please tell us!
   • The points were clear enough to complete the tasks.
2. As you were completing the tasks above, did anything behave in a way that you did not expect?
   • Yeah, a few things. More on that in a below section :-)
3. What are some of your overall impressions of the Edit Cards v2 prototype? Do you find it clear? Confusing? Helpful?
   • Overall, the prototype looks good to me. It's clear and would be very useful to edit links.
4. Were you *not* able to complete any of the tasks listed above? Please tell us which tasks you were *not* able to complete.
   • No, I was able to complete all the tasks.
5. How frequently do you edit using the visual editor on desktop and/or mobile?
   • I don't edit much using the visual editor per se in desktop/mobile. I prefer the wikitext editor. For some time now, I've been using the Visual wikitext editor, though.

Some thoughts & observations

• When undo-ing something there doesn't seem to be any feedback indicating the intended action has been competed. This is especially an issue when the effect of the undo is in a plcae which currently not visible in the screen.

• Given that there's an undo button, the fact that there's no redo button is a bit disturbing. It would be nice to have a redo button to accompany the undo button.

• Tapping back when the link card is shown should dismiss it and shouldn't show "Discard edits" menu. Same applies for "Edit link" overlay which shows up when trying to edit a link.

• When editing a page and I tap on a link, the link card is shown. Then, when I tap on the 'X' mark in the link card I thought it would also exit from link edit mode. But the editor still remains in link edit mode.

• Automatically detecting links to external wiki pages and converting them to inter-wiki links is nice. But when pasting a link to other wiki page in "External link", preview shows it as an external link (presence of external link icon in preview). Though after saving, it is converted into an inter-wiki link (lack of external link icon after publishing). This seems a little confusing as preview and actual behaviour don't match.

Also, when pasting a mobile link to external wiki page, this conversion doesn't seem to be happening.

Overall

• There's an element of lag in the overall user experience. It would be great if the experience was even more faster.

Other

A few general things which are not specific to link card editing:

• In editing mode, when the cursor is in one place it is not possible to scroll to other parts of the page. It automatically scrolls the page back to the top.

• Interestingly, I noticed that using a HTTP link to the prototype automatically redirects to the HTTPS version of the website in desktop. But this does not seem to be happening in mobile. In mobile, the HTTP version of the page just loads. Not specifying this as an issue. Just as an observation.

• In mobile, there is no hint when user tries to edit an old version of an article (by browsing an old version via History and trying to edit it). The fact that it would overwrite current version of the article is not highlighted when publishing the article. Also, after successful edit the page redirects back to old version itself. So, editor doesn't see effect of edit after publishing.

Hope this helps. Let me know in case any clarification is needed. I'll be happy to give more information :-)