533033 - Re-Design the Editor Tools

Status: RESOLVED FIXED

(addons.mozilla.org Graveyard :: Admin/Editor Tools, defect, P3)

Description

[Jorge Villalobos [:jorgev] (he/him)]

Since Christmas is around the corner, here's my AMO Editor tools wishlist. I'll attach 3 mockups I came up with for the review pages, queue pages and performance pages. Just as a warning, I might have gone a little feature-crazy here.

Hopefully Santa Clouser will put his elves to work on this :)

Comment 1

[Jorge Villalobos [:jorgev] (he/him)]

Attachment: Review page mockup

The review page is the most important one IMO. This one is very long because I wanted to include several versions in the history, with different combinations of approvals, comments, etc.

There's one thing I missed, though, and that is automated messages for when: 

1) A version changes its status in the admin UI.
2) A version is removed by the author.
3) A verion is auto-approved due to trusted status.

I'll come up with the look of those eventually.

Comment 2

[Jorge Villalobos [:jorgev] (he/him)]

Attachment: Queue page mockup

The queue page mockup is not very different than the current design. I rearranged the columns a bit, and added a more informative status column.

Comment 3

[Jorge Villalobos [:jorgev] (he/him)]

Attachment: Performance page mockup

I feel the performance page is too wasteful in terms of space. This new design includes more relevant information (I think) condensed in a single page.

Comment 4

[Andrew Williamson [:eviljeff]]

They look good.  I'll try to keep my comments organised and brief.

Review Page: 
1) agreed, if the version notes and links to the previous xpis are in the history;
2) Needs an Edit Item link and/or can we have an Admin page link too please
3) I think we need to be able to see all of whats been entered by the author, including preview images and summary info.  Privacy policy & EULA preferably in expandable divs (first few lines, then a [expand] or [more]).
4) Is the validation summary going to go?  Probably for another bug but it'd be great if Validation auto-ran if it wasn't there. 
5) can we get some background colour coding for the parts of the version history (light red for rejection notice, etc)
7) is the idea to replace the admin control panel here also or supplement it?
8) the horizontal/vertical layout isn't particularly clear - it may make more sense laid out in html with appropriate spaces/disabling though.

Queue Page:
2) Can we get the text for the icon as well as the icon.  I'm a bit concerned the most important bit of information is summarised in something so small.  A nice to have would be an icon for the addon type too.

Performance Page:
1) Unless its a difficult task I think we should keep the date ranges filter.  On 1st month you may want to check last month, etc.
I/We need to still see the table with all the reviews in too - I hope its not being removing.
3) It'd be an interesting chart to see occasionally but I'm not sure it adds much value on the performance page tbh.

Tell Santa Clouser we've been good this year and deserve to get our presents :)

Comment 5

[Scott McCammon [:mccammos]]

The points in comment #4 are all reasonable. Here are my additions.

Reviews Page:

1. Does unchecking "include author" make the comment visible only to editors and admins? If so, then some visual indication (yellow background?) would be useful to indicate this visibility. I like this as a simpler alternative to  current "Editor Comments".

2. Would a "reply" link be useful next to each comment? Just like bugzilla, this would simply prepopulate the comment textarea. Replying to comments hidden from the developer would uncheck "include author".

3. When checking "Watch this add-on", is the editor notified only of the next update from the developer (current behavior)? Or is the editor notified of any changes (including comments from other editors) until unsubscribed via the "Watches" tab? I like the simplicity of "notify on any change", but that may generate too much email for some editor's tastes.

Performance Page:

1. Currently "team average" does account for inactive editors, but the formula for determining who is active may need adjusting. That said, I do like the idea of adding top N averages.

2. Charting queue state would be quite feasible. We would just need to collect and save queue counts on a daily basis (or more often if really desired).

Comment 6

[Jorge Villalobos [:jorgev] (he/him)]

(In reply to comment #4)
> 2) Needs an Edit Item link and/or can we have an Admin page link too please

This is a nice to have for admins. I personally use a GreaseMonkey script that sticks admin links all over the place :)

> 3) I think we need to be able to see all of whats been entered by the author,
> including preview images and summary info.  Privacy policy & EULA preferably in
> expandable divs (first few lines, then a [expand] or [more]).

On second though, preview images is a good idea to have, specially for themes. Privacy policy and EULA I would prefer that they link to other pages, so that the review page doesn't get too bloated. If they are included, though, I agree that they should be toggled off by default.

> 4) Is the validation summary going to go?  Probably for another bug but it'd be
> great if Validation auto-ran if it wasn't there. 

I think it's a good idea to force editors to run the validator instead of relying in cached results or a summary. That's one reason I want to only have a link (that, and space limitations).

> 5) can we get some background colour coding for the parts of the version
> history (light red for rejection notice, etc)

Yes!

> 7) is the idea to replace the admin control panel here also or supplement it?

The admin control panel will remain separate.

> 
> Queue Page:
> 2) Can we get the text for the icon as well as the icon.  I'm a bit concerned
> the most important bit of information is summarised in something so small.  A
> nice to have would be an icon for the addon type too.

I was thinking about a tooltip, but you're right, there's no reason to include some small text describing it. It'd be nice to have icons for add-on types as well. I don't know if we have those already, though.

> 
> Performance Page:
> 1) Unless its a difficult task I think we should keep the date ranges filter. 
> On 1st month you may want to check last month, etc.

I wanted it out because it fails half the time, and it's very poorly designed from a UI perspective. I'd include it again, but in a second tab.

> I/We need to still see the table with all the reviews in too - I hope its not
> being removing.

Do you need this?

(In reply to comment #5)
 
> Reviews Page:
> 
> 1. Does unchecking "include author" make the comment visible only to editors
> and admins? If so, then some visual indication (yellow background?) would be
> useful to indicate this visibility. I like this as a simpler alternative to 
> current "Editor Comments".

Yes, this is the same as Editor Comments, but located in the right place.

> 2. Would a "reply" link be useful next to each comment? Just like bugzilla,
> this would simply prepopulate the comment textarea. Replying to comments hidden
> from the developer would uncheck "include author".

Sounds good.

> 3. When checking "Watch this add-on", is the editor notified only of the next
> update from the developer (current behavior)? Or is the editor notified of any
> changes (including comments from other editors) until unsubscribed via the
> "Watches" tab? I like the simplicity of "notify on any change", but that may
> generate too much email for some editor's tastes.

I prefer the idea of a permanent flag. This makes it more like a setting that can be always changed in an add-on review page. Maybe it should also be possible to change the setting without having to post a comment. I didn't think about this in the current mockup, though.

> 
> Performance Page:
> 2. Charting queue state would be quite feasible. We would just need to collect
> and save queue counts on a daily basis (or more often if really desired).

Weekly should be good enough, but maybe daily can be more useful. I can give you the queries I've been using for our daily reports.

Thanks!

Comment 7

[Andrew Williamson [:eviljeff]]

(In reply to comment #6)
> (In reply to comment #4)
> > I/We need to still see the table with all the reviews in too - I hope its not
> > being removed.
> 
> Do you need this?

yes, its the only way of being able to see what you've done 'today' and I'm using it regularly to track what I've done.
Its also a good reference for common follow-up queries because you have the review links.  In theory you could use the review log for this but its too slow to load and you can't filter it by editor.

Comment 8

[Jorge Villalobos [:jorgev] (he/him)]

Something that came up in a conversation and I forgot to mention in my previous comment: in order to reduce the size of the review pages, it's a good idea to hide some of the review history by default. However, I think it's good to give a good chunk of context to reviewers.

I'm thinking that a decent compromise is to show the review history for the last 5 versions, and have the possibility to expand the rest (maybe a show 5 more link at the top or something).

I'll try to come up with a modified mockup that includes some of the feedback. It may take a couple of weeks due to time constraints.

Comment 9

[(no longer active)]

Friendly reminder of testing the page in RTL mode before the code goes live!  I can help with RTL-specific QA if needed.

Thanks!

Comment 10

[Wil Clouser [:clouserw]]

(In reply to comment #8)
> Something that came up in a conversation and I forgot to mention in my previous
> comment: in order to reduce the size of the review pages, it's a good idea to
> hide some of the review history by default. However, I think it's good to give
> a good chunk of context to reviewers.
> 
> I'm thinking that a decent compromise is to show the review history for the
> last 5 versions, and have the possibility to expand the rest (maybe a show 5
> more link at the top or something).
> 
> I'll try to come up with a modified mockup that includes some of the feedback.
> It may take a couple of weeks due to time constraints.

Hey Jorge, what's the status of the mockup?

Comment 11

[Jorge Villalobos [:jorgev] (he/him)]

Attachment: Review page mockup 2

Updated review page mockup. This one only shows the latest 4 versions by default, with the rest collapsed and viewable through a Toggle link. This link also appears on several other locations, allowing editors to control the page height easily.

Also added the image gallery, links to see the eula and privacy policy, and links for admin user convenience.

Comment 12

[Jorge Villalobos [:jorgev] (he/him)]

Attachment: Queue page mockup 2

Revised queue page mockup. This only adds text to the state icons, making it easier to understand the state quickly.

Comment 13

[Jorge Villalobos [:jorgev] (he/him)]

Attachment: Performance page mockup 2

Revised performance page mockup. This includes the option to add arbitrary ranges in the review count table.

Both charts (2 and 3) should be for the past 12 months, not only the current year.

As for showing the recent review list for an editor, I think the log is the best place for this. I'll open a bug for adding an editor filter to the log and add it as a dependency, since we don't want to be losing useful features.

Comment 14

[Andrew Williamson [:eviljeff]]

(In reply to comment #11)
> Created an attachment (id=418725) [details]
> Review page mockup 2

great.  Btw, where are the reply box and resolve options going to be?  Below the history? 

(In reply to comment #31)
> Created an attachment (id=418729) [details]
> Performance page mockup 2
> As for showing the recent review list for an editor, I think the log is the
> best place for this. I'll open a bug for adding an editor filter to the log 
> and add it as a dependency, since we don't want to be losing useful features.

okay, that should work if it can be filtered by editor.

Comment 15

[Jorge Villalobos [:jorgev] (he/him)]

(In reply to comment #14)
> great.  Btw, where are the reply box and resolve options going to be?  Below
> the history?

Yes, the link would make the Response section appear in its place.

Comment 16

[Justin Dolske [:Dolske]]

Will the Queue Page's search + "Include Resolved" allow looking at arbitrary extensions / versions with the editor tools?

I've had a few occasions where I've wanted to do so (to look at previous comments, source viewer, etc), and it would be nice to be able to do that through the UI. Currently I've had to bug someone with admin rights to look up the URL I can then explore from as an editor.

Comment 17

[Andreas Wagner [:TheOne] [use NI]]

(In reply to comment #16)
> Will the Queue Page's search + "Include Resolved" allow looking at arbitrary
> extensions / versions with the editor tools?

This is bug 531910 which is marked as blocking this bug, so I assume it will be possible.

Comment 18

[Scott McCammon [:mccammos]]

Attachment: Horizontal Navbar

Here is a snapshot of a horizontal editor tools navbar. "Logs" is also a drop down containing "Review Log" and "Event Log".

If anyone prefers the old vertical navbar or has other suggestions, let me know.

Comment 19

[Justin Scott [:fligtar]]

I might change "Editor Summary" to just Dashboard or remove it completely since clicking the big red Editors Tools should take you back there. Also, can probably remove "Add-on" from the header before Editor Tools.

I'm also wondering if we need to keep the "Featured Add-ons" tool under Editors. It should really be called "Category Features", and only admins use the tool I think. At one point in the past we encouraged editors to use it, but since we have a different process for managing these lists now, it should probably be moved to the admin tools.

Comment 20

[Jorge Villalobos [:jorgev] (he/him)]

I agree on changing the name to Dashboard and removing Featured Add-ons. I would keep the "Add-on" in the header just because of the coloring. A completely red title looks a little off to me.

Comment 21

[Justin Scott [:fligtar]]

We don't have "Add-on" in the new admin tools header and I think it looks fine: https://bug535680.bugzilla.mozilla.org/attachment.cgi?id=418289

Comment 22

[Jorge Villalobos [:jorgev] (he/him)]

Note: in the review page, please change 'Notes to Reviewer' to 'Approval Notes', so that the language is consistent with what authors see. Often I tell them to add stuff to the 'Notes to Reviewer' and that's probably confusing for them.

Comment 23

[Scott McCammon [:mccammos]]

Attachment: Redesign v1

This is several patches in one. Key changes include:

- updated all tools to work with new layout and navigation
- moved "Featured Addons" to admin tools
- split queue search form into basic and advanced pieces

In this set of patches, my goal was to preserve existing functionality. However, creating new editor comments is currently broken. Supposedly these are not ever used? If so then I'll just focus on the new (simplified) implementation moving forward.

Comment 24

[Jorge Villalobos [:jorgev] (he/him)]

Editor comments are rarely used, but this is partly because the current UI sucks. Even with the new UI I don't think they'll be heavily used, so - if necessary - this feature could be pushed to a later release.

Comment 25

[Wil Clouser [:clouserw]]

Comment on attachment 420191 [details] [diff] [review]
Redesign v1

This is a good v1.  Notes:

- /en-US/editors/ needs a new design.  Maybe a graph of overall progress, maybe some other numbers, maybe a picture of the new google phone.  Jorge, can you throw a mockup together of what would be useful on this page?  Oh, the MOTD should be on this page at a minimum.
- "___('MOTD')" should have an <abbr> around it and an L10n comment to explain what it is
- Mousing over a header pops down another menu, but clicking on the header without choosing something from the submenu goes nowhere.
- The current event log shows the past month of entries by default.  This one shows nothing.
- click "Show/Hide Replies (1)" on a view page and it doesn't work
- [rtl] The 4 main button should be on the right
- [rtl] There is some clipping on the dropdown in the "queues" menu
- Editor comments should work.  If you replace the weird markup with htmlpurifier that's a bonus, but don't spend much time on that since we'll have to change it in python anyway.

I think the above is the minimum we need to push it live (minor polish, bug testing aside).  I know you said it's mostly a reskin at this point so I'll skip comparing it to the mockups for now, but there is a lot to do there for all the pages.  Judging from the length of this bug we should probably split those off into their own bugs, perhaps for zamboni.

This is looking good and I'm going to r+ it but I don't want it to land in 5.5 so I'm pushing to 5.6.  That will give us some extra time to get the final polish on the pages and make sure it's well tested.  Thanks for the patch - it's looking great.

Comment 26

[Jorge Villalobos [:jorgev] (he/him)]

Attachment: Editor Summary mockup, V1

Here's my take on the editor summary page. This is focused on the queue links because we want editors to get busy :). I'll attach the queue stats queries I've been using so far.

Comment 27

[Jorge Villalobos [:jorgev] (he/him)]

Attachment: Queries for the Queue Report of 2010-01-08

Here are the queries I used for today's report, which should help generate the stats for the Editor Summary and some of the Performance page. They're pretty straighforward. The only trickiness involved would be figuring out some of the dates, but I'm sure there's some sort of date library that facilitates this.

Comment 28

[Scott McCammon [:mccammos]]

Attachment: Fixes to Redesign v1, unified styling

This set of patches addresses all items mentioned in comment #25 and makes the look and feel consistent across all editor tools components.

Comment 29

[Wil Clouser [:clouserw]]

Comment on attachment 422663 [details] [diff] [review]
Fixes to Redesign v1, unified styling

do it

Comment 30

[Scott McCammon [:mccammos]]

r60847

Unless there are any objections, I'll file the remaining work into smaller bugs for zamboni and then close this one out.

Comment 31

[Jorge Villalobos [:jorgev] (he/him)]

After checking out preview.amo, here are my notes:

* Queues page *

1) The search icon in the search box overlaps with the default search text.

2) The Age of Submission filter is confusing. I wasn't sure if it meant exactly X days or X days or more. I think it would make more sense for the combo to show ranges: 0-3 days, 3-6 days, 6-9 days, 10+ days.

3) The hover state of the tabs doesn't look very good, because they look exactly the same as the active tab. I think the expected look should be some highlight that looks like an intermediate state between inactive and active.

* Editor summary, review page, performance page *

Looks like these were updated to the new style and don't really follow the mockups. I'm not sure if it's a good idea to take all the remaining work and toss it out for the future. I can understand this taking much more time, but I'd like to see some of these ideas implemented on 5.7, 5.8, etc.

Overall I think the new editor tools look very good, and the new style is much nicer and cleaner. Great work!

Tested on:
Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; en-US; rv:1.9.2) Gecko/20100115 Firefox/3.6

Comment 32

[Wil Clouser [:clouserw]]

(In reply to comment #31)
> Looks like these were updated to the new style and don't really follow the
> mockups. I'm not sure if it's a good idea to take all the remaining work and
> toss it out for the future. I can understand this taking much more time, but
> I'd like to see some of these ideas implemented on 5.7, 5.8, etc.

As mentioned above, this is a reskin.  Changing to mockups will be other bugs done in [z]

Comment 33

[Jorge Villalobos [:jorgev] (he/him)]

That's kind of my point. It looks like it was a different bug that was fixed.
Anyway, let me know if you want me to file the new bugs.

Comment 34

[Scott McCammon [:mccammos]]

I split the redesign portions of this bug into more manageable chunks for [z]:

summary page: bug 541141
add-on review page: bug 541151
queue listings: bug 541147
performance page: bug 541156

Comment 35

[Jorge Villalobos [:jorgev] (he/him)]

Actually, I'd like to bother you with one last, important thing: the MOTD should appear in the Queue and Moderation list pages. This is where editors choose what to review, and where it makes more sense to have something to direct their attention.

Comment 36

[Scott McCammon [:mccammos]]

Attachment: MOTD above queue listings

Comment 37

[Wil Clouser [:clouserw]]

Comment on attachment 423011 [details] [diff] [review]
MOTD above queue listings

Do it.  If there are more tweaks to this bug please file them separately as reopening this bug spams a bunch of people (including dependent bugs).

Comment 38

[Scott McCammon [:mccammos]]

r61009 for MOTD above queues

Comment 39

[Jorge Villalobos [:jorgev] (he/him)]

Reclassifying editor bugs and changing to a new whiteboard flag. Spam, spam, spam, spam...