We have been doing some work at Galois that we would like to integrate
with the broader Wikimedia efforts. We were tasked with finding a way
to help improve user interface consistency, in a very general sense,
so we developed a tool called FiveUI to try and simplify the process
of manually evaluating user interface guidelines on HTML-based
interfaces. We're at the point now where our primary goal is to find
external users; and we're able to do some additional development to
help adapt the tool to fit these user's needs.
FiveUI takes sets of guidelines encoded in Javascript and runs them on
web sites. It works in either an interactive mode with a browser
extension in Chrome or Firefox, or in a "headless" batch mode, which
could be used in a continuous integration environment. Page elements
that do not conform to guidelines are flagged and reported.
We have applied this to Wikipedia by translating portions of the
Wikipedia Manual of Style into Javascript so that article content can
be checked for problems automatically. We have done the same thing
with a subset of the W3C WAI guidelines.
FiveUI is released under an Apache license and we hope that that will
enable the broadest set of uses.
We have already sent a message to the Wikimedia QA mailing list, but
were told that it is the volunteer community that generally takes
charge of enforcing the style guidelines.
The rest of this email goes into detail about how we think FiveUI
might be useful for Wikimedia, but if you want to go play with the
tool right away, you can find it on GitHub:
-
http://galoisinc.github.io/FiveUI/
- and
http://github.com/GaloisInc/FiveUI
Or the chrome store:
-
https://chrome.google.com/webstore/detail/five-ui/bbccaefdcbnnkpmekjchefnhh…
The install instructions and getting started documentation are linked
from the first url above, or directly here:
- Install docs:
-
http://galoisinc.github.io/FiveUI/manual/install.html
- Getting started:
-
http://galoisinc.github.io/FiveUI/manual/gettingStarted.html
There are a collection of encoded guidelines available on GitHub as
well. These can be loaded by FiveUI to see some of the things it's
capable of--for example, we've implemented a subset of the W3C's WAI
guidelines here:
- WAI guidelines:
https://raw2.github.com/GaloisInc/FiveUI/master/guidelines/WCAG-1.0/conform…
The accessibility guidelines can help find issues such as missing alt
text, missing (or duplicate) labels, and assorted color issues amongst
a few others. We think these could be useful checks for the Mediawiki
development process; but there are probably other areas we aren't
familiar with that could have a greater impact--we'd like to hear
suggestions!
One area that would possibly be more visible is to integrate something
like FiveUI with the wiki page editing process. We've implemented
automated checks for a number of the guidelines in the Wikipedia
Manual of Style [1]. We imagine either a style checking bot using
these guidelines to mark pages for refinement, or even integrating
with the page preview process to point out possible violations of the
manual of style when editors submit content to the wiki.
We took the liberty of running these guidelines on a small set of
Wikipedia pages, and posted the results here:
-
http://galoisinc.github.io/FiveUI/reports/wikipedia/20140107T2328Z/summary.…
The implementations are also available on github, in the 'guidelines'
directory, if you would like to use them to look at any pages in
particular, or if you would like to see how the rules were
implemented. The Manual of Style guidelines are described in more
detail here:
-
http://galoisinc.github.io/FiveUI/manual/wikipediaGuidelines.html
Does this look like a technology that may be useful to you? Are there
different directions we could take with FiveUI that would better
solve problems you run into frequently?
I'm happy to answer any questions, give a screencast demo, brainstorm
ideas, etc.. let me know how I can help.
Thanks!
Jesse Hallett
Research & Development
Galois, Inc.
[1] -
http://en.wikipedia.org/wiki/Wikipedia:Manual_of_Style