Design/Archive/Design audit

We want a lightweight means of organizing and presenting MediaWiki UX elements. Over the long term categorizing on-wiki screenshots is the lowest-overhead way to do it. Anything else is harder to maintain, too granular, and leads to repetition.

Category pages and image File: pages are regular wiki pages with talk pages, so people can comment on them, watch them, discuss them. (And/or people can create regular wiki articles referring to these images.)

Go see it &mdash; Category:Design audit

How to
Just add all the subcategories of Category:Design audit that apply to a screenshot. You can find screenshots by browsing Category:MediaWiki screenshots.

New screenshots
If there isn't an existing screenshot,
 * 1) Open a new browser window
 * 2) Turn off all browser toolbars and chrome, dismiss the find bar.
 * 3) reset your browser's zoom to standard (in Chrome View > Actual Size, in Firefox View > Zoom > Reset)
 * 4) If possible log out of the wiki site, or create a fresh account, or otherwise be sure you have no gadgets or custom CSS
 * 5) Visit enwiki if possible
 * 6) Visit a low-drama simple page as plain as possible
 * 7) Set up the page or dialog
 * 8) Resize it sensibly (no 2000-pixel wide screenshots)
 * 9) Take a screenshot either of the window or the relevant region
 * 10) Name it 2024-August- Name of UI feature.png (Explanation: cruft accumulates! putting the date in the filename saves people wasting time looking at a three-year old screenshot that hasn't been un-categorized.)
 * 11) Visit Special:Upload here to upload it
 * 12) In the description, expand on the description of what's shown in the screenshot. If it's not obvious, add a sentence explaining how to get to the state, e.g. "Log in, visit another user's page, click the WikiLove 'heart' icon."  Add a sentence identifying the browser version and system you used, e.g. "Captured in Chrome 29 on Mac OS X Lion".
 * 13) Choose "MediaWiki screenshot" as the Licensing.
 * 14) Click [Upload file]]

Immediately click [Edit source] on the new file's page and replace   with the following wiki markup

, where you choose all the subcategories of Design audit that apply. Explanation: content=none means your screenshot only contains MediaWiki UI elements rather than copyrighted material (hence "Visit a low-drama simple page"), you're probably using the Vector skin.

New design audit subcategories
You can add new categories: name them either "MediaWiki element names" or "Inconsistent element names". (Explanation: category names need to make sense on their own, so a plain name like "Validation" is bad.) After saving, click each red (=new) category link and add   to it to make it a subcategory.

Discussing screenshots
The Category: and File: pages are wiki pages, so we can comment on them, e.g. mention relevant UX bugs (use  NNNNN).

If you comment on an existing screenshot, put your comments in a subheading == Agora design discussion == so other clients of the screenshot aren't confused.

To Do
Is there an on-wiki image annotation tool to annotate screenshots?