User:JKlein (WMF)/guerilla-user-testing/Adding+EditingLinks-May2019

From mediawiki.org


Learnings: Prague Hackathon 2019[edit]

Prototyping and Testing Notes:[edit]

  • Bring 2 devices
    • One for testing; one for recording
    • This would resolve a couple issues we encountered at the Hackathon:
      • Tester would not need to turn off their notifications. Contributors don't want the contents of their notifications/messages recorded and shared
      • Tester and test administrator would not need to share a link to the prototype(s) via email/SMS/etc.
  • Create notes template ahead of time
    • "Test administrator" shouldn't have to think about a) Where do I take notes? and b) What format should I take notes in?
  • Prototype: don't "middle"
    • It's better to have a lower fidelity prototype (that does not look finished and will not create an expectation that it is) or an interactive prototype (read: high fidelity) that looks and functions as if it's real.
    • Middling in between, as we did for this test, is potentially distracting to the tester in so far as the prototype looked real enough that people expect it to behave like the real thing (i.e. being able to place the cursor anywhere)..

User Experience Notes:

  • W / pencil - experienced users found the / confusing
  • After inserting the external link an extra tap on the link card is unexpected (w/ a change in state to confirm changes have been made successfully)
  • Should unlink and edit buttons feel more obviously like buttons?
  • It’s hard for to discern if the a/b test is super effective here because the prototype was a bit cumbersome
  • It does seem that folks are used to utilizing a top toolbar (current)
  • There’s an expectation of double tapping into text to edit
    • Editing link’s label: expects to be able to edit label text directly within article/document (extra step not intuitive/expected)
  • Seems like there’s a preference for the “delete” icon for unlinking but also, this is a result of having to scroll on the prototype
  • External links: lack of feedback about what is/isn’t a valid link is confusing
  • Some things might depend on if you are experienced or new editor, what language you are editing in, what your area of expertise is

1. How should the test flow?[edit]

Overview:[edit]

2. Why are we doing this test?[edit]

Background:[edit]

  • This year, our team is working to help contributors be more successful editing on mobile, using the mobile VisualEditor.
  • What you're about to see is a new design pattern intended to make adding and editing links within articles simpler and more visible
  • This is a test to help figure out whether this current design does in fact make editing links within articles simpler and more visible
  • After this test, we will look back at the footage to figure out what parts of the designs needs to be revised

More info: VisualEditor on mobile/Edit cards

3. Introducing the test[edit]

Important points to get across:[edit]

  • This a test of the editing interface, not of you
  • This test is intended to identify core usability problems
  • Please do your best to "think aloud" – if you're not sure what to do next, if something is confusing, if something was surprising, please say something!
  • I (the observer) am going to do my best to resist saying anything while you're testing, so if I'm noticeably silent, this is why :)

4. Before the test begins[edit]

Confirm the following with each tester:[edit]

  1. Are you okay with me filming your hands and device as you complete the test?
  2. Are you comfortable with me sharing this recording with our team?
  3. Are you comfortable with me sharing this recording on MediaWiki?
  4. Are you open to being contacted by our team later, should we have more questions for you?
    1. If yes, what is the best way to get in contact with you?

5. Workflows to test[edit]

⚠️You can share the following link with the tester so they can access links to the prototype on their device:

https://w.wiki/48D

Add a new link[edit]

Imagine that you are on a bus reading an article about a fancy pencil. Right away, you notice that you can link the word "pencil" in the first paragraph of text to another Wikipedia article. How would you do that and publish your changes?

Prototype link

Edit the link's label[edit]

Now, try change the label of that link to say "Arya Stark" instead of pencil. Publish your changes.

Prototype link

Change the link[edit]

Instead of going to the pencil page on Wikipedia, have the link go to the Arya Stark page on Wikipedia. Publish your changes.

Prototype link

Change the link, again![edit]

This time try to add a have the link direct to the FANDOM page about Arya Stark. Publish your changes.

Prototype link

Unlink the text[edit]

Try to remove the link. Publish your changes.

Prototype link