wmde / mitmachen

Help new Wikipedia editors find articles with known issues
https://tools.wmflabs.org/mitmachen
GNU General Public License v2.0
2 stars 1 forks source link

DESIGN: Review the design of the Prototype #26

Closed darionewmonday closed 4 years ago

darionewmonday commented 5 years ago

Please take a look at the prototype.

How to do it:

  1. Open this link
  2. use the arrows at the bottom of th epage to scroll "left-right" through the pages
  3. Last page is page 7, ignore the others.

You can leave comments here. Thanks

@ChristineDomgoergen @tobijat

ChristineDomgoergen commented 5 years ago

@darionewmonday great, thank you. I will get back to this tomorrow.

darionewmonday commented 5 years ago

One note: I have tuned the green color to be Color-Contrast AAA approved.

ChristineDomgoergen commented 5 years ago

@darionewmonday So here is my feedback: In general:

Screen 3:

Screen 4:

Screen 5:

Screen 6:

Screen 7:

darionewmonday commented 5 years ago

@ChristineDomgoergen thanks for the feedback. We have worked on a slightly different approach. I will post the link once ready for review (today or tomorrow)

Here my comments:

  • all text needs to be in German and some of it needs to be updated (just to keep in mind). Please let us know in advance when you need the texts from us
  • what will be behind the "Help" button in the top menu?

  • You can tell us. I was thinking the page with the explanation of the 10 errors?

  • top menu: log in and sign up are tbd depending if we can use oauth (https://www.mediawiki.org/wiki/OAuth) in the tool see issue #17

  • yes. We can open an overlay and let the user sign-in or up there.

  • the preview article screen is missing. Do you need more input from our side for the design?

  • no. We need to try a few solutions. Still in progress.

  • I will get some feedback on the styleguide conformity of the Wikipedia logo the next week

  • Ok, the sooner the better.

  • On which screen do users start if they skip the interest selection at the beginning?

  • The screen with all the topics and no articles. The flow has changed though. The interest section is not anymore at the beginning but only visible in the "Your topics" tab

Screen 3:

  • what will be shown in "your interests"? Articles? Categories? Last Queries?
  • Topics depending on your selection, if the user didn't select any, the system will simply keep prompting the selection mask. The layout is exactly the same as "Popular"

How do we get this data?

  • not sure if users will see the "refresh topics" next to "your interests", since it doesn't really look like a button. Should be checked in the user tests.

  • Sure we can check

  • will this also be the startscreen if users do not enter via Screen 1 but via search bar?

  • yes

Screen 4:

  • first impression: the screen seems to have a lot of interaction possibilities for the user, it seems a bit crowded and might be overwhelming. Should be checked in the user tests.

  • it's maybe because you see all panels open at the same time, it's actually not that full

  • are the article names also links? If not I wouldn't let them look like links and choose a different color

  • Yes they are links

  • as a user I would probably still want to click on the button like tags like "ungeprüfter link"... either we could make them clickable or redesign a bit more. should be checked in the user tests.

  • We remove the border and leave only the word

  • I like the filter by tasks possibility

  • how can users load more articles?

  • at the bottom we will use the lazy loader, the more you scroll, the more articles come, no need for a button

  • Is there a reason for showing exactly six results? it gives a sense of control, to know how many articles belong to a topic. If a topic has only 1 article, it may seem like an error. By mentioning the number, we avoid this situation

  • what happens when you click on "refresh topics" here? Does it reload the suggestions in the scrollbar at the top or the results (articles)? Might be confusing for users

  • it's quite straightforward: 1) Click reload 2) Loading spinner appears 3) New topics with the first clicked and articles visible

Screen 5:

  • I think I do not understand this one. What function does the filter of general categories have?
  • which general categories? Can you elaborate your doubt?

Does it change the suggestions in the scroll bar?

Screen 6:

  • nice, I like it
  • the content of the help panel at the bottom will need some updating. Please let us know in advance when you need this information from us
  • I need this info from you: 1) Copy 2) Links Thanks

Screen 7:

  • looks good
  • Thanks
darionewmonday commented 5 years ago

We have elaborated a new version where the UX is more "round" and fluid. The "preview" feature is still under concept.

https://www.figma.com/proto/RkkY3uy7fYE9PvBr4lNKx6/Mitmachen?node-id=380%3A361&viewport=-857%2C-32%2C0.34869682788848877&scaling=min-zoom

darionewmonday commented 5 years ago

https://www.figma.com/proto/RkkY3uy7fYE9PvBr4lNKx6/Mitmachen?node-id=503%3A2985&viewport=-857%2C-32%2C0.34869682788848877&scaling=min-zoom

ghost commented 5 years ago

Hi @darionewmonday so you decided to go "full-screen" with the article-preview? I do like the "in your face" attitude about showing the required edits on top of the article! At the same time, I didn't quite get some aspects, about which I wanted to ask:

I also got a question about another part of the design: the list view. It seems to me like there's a lot of whitespace below the task-type-filter: image

-> In mobile, it might work, but on desktop it seems a little off. Might it be an idea to go more "listy" and actually have columns instead of article-tiles? That way, you need less space and make good use of the one you're occupying. Arguably, it's more challenging when users go mobile - for those the current tile-style works better. But I see no harm in having a list in desktop and tiles in mobile.

Best! Lukas

darionewmonday commented 5 years ago

@LukasWMDE

Hi @darionewmonday so you decided to go "full-screen" with the article-preview?

It opens in a new browser's tag simply.

I do like the "in your face" attitude about showing the required edits on top of the article! At the same time, I didn't quite get some aspects, about which I wanted to ask:

  • how do you return to the list-view, if you end up not wanting to work on the article? I don't see an "X" or a "back" [UPDATE: Just found it - but the "close" is well hidden :)].

See above. the "close" button will be removed

  • in seems like the wikipedia-article "dissipates", so that you can't actually preview all of it. What about necessary edits with sources and links in the footer? The way it is now, it wouldn't be possible to preview those

The article is shown entirely, until the end.

  • What about "storing" articles by opening them in tabs of your browser in order to have a look at them later? Will this be possible?

See above.

I also got a question about another part of the design: the list view. It seems to me like there's a lot of whitespace below the task-type-filter: image

-> In mobile, it might work, but on desktop it seems a little off. Might it be an idea to go more "listy" and actually have columns instead of article-tiles? That way, you need less space and make good use of the one you're occupying. Arguably, it's more challenging when users go mobile - for those the current tile-style works better. But I see no harm in having a list in desktop and tiles in mobile.

I don't get what you mean. Can you please sketch it and send it over?

thanks

Best! Lukas

ghost commented 5 years ago

Hi @darionewmonday , I see - didn't notice the "new tab"-approach. Answers quite some questions!

Here a scribble of what I mean by "listy". Of course, it's far from looking nice:

image

darionewmonday commented 5 years ago

@LukasWMDE thanks for the sketch.

In your version we show article views which was not mentioned nor I believe brings much value to users. Then you have 3 columns for the errors, about it:

Thanks for the ideas anyway