what exactly is typerighter?
Typerighter is the Guardian’s proofing extension and is available on article pages through our in-house editing software – Composer.
It’s used by our writers, subs and revisors to check that the text matches the house style and to spellcheck typos and grammar.
how does it work?
The user can “check the document” by clicking on a button.
Results come up underlined in red/ambar/green in the bodytext and in a summary-view on the sidebar.
Users can use filters to show/hide results.
This sounds great. So what’s the issue?
ARE WE doing everything we can to be inclusive IF OUR TOOLS AREN’T accessible for everyone?
Our colourblind users weren’t able to easily differentiate results.
Overall, it was also hard to tell that the filters could be turned on/off separately.
the goal
Improve accessibility on Typerighter without compromising usability.
research
Whilst we don’t have a dedicated UX researcher in the Tools team, we have something reader-facing teams don’t: the ability to ping them through chat and set up a quick session.
We run 3 usability sessions with revisors from the Opinion desk: 2 colourblind and 1 non-colourblind users. Some of them had experience using Typerighter and some didn’t.
about the user testing sessions
We recreated an article in 2 environments: one with the current Typerighter version and one with the improved version. Both had the same number of Typerighter results.
We gave them a list of tasks to understand how they would react to the usability changes without compromising their response.
Prior to the session, we run a session with the team to have a list of hypotheses to prove/debunk through the user testing. We were especially concerned around the noise in the bodytext between Typerighter and notes.
Sometimes a simple solution is the best solution
design
Adding texture to the underlines massively improved the experience for colourblind users and didn’t impact negatively non-colourblind ones. Thanks to the user testing sessions and follow up conversations we discovered issues with the appearance of the filters and modified them to make them more intuitive.
We also included icons and sticky labels on the summary view to clarify the types of results further.
huddle team
Database set up and management: Max Walker
Product manager: Calvin Dickson
Engineers: Jonathon Herbert, Thalia Silver, Sam Hession
UX support: Zeek Ikomoni
UX and design: Ana Pradas
Central Production: Katherine Purvis, Matteusz Karpow