From Pain Points to Production: A Newsroom Text Editor OverhaulTwo rounds of usability testing that reshaped how kumparan writers draft, edit, and publish every day.
UX ResearchUsability TestingInternal ToolsDesign Iteration

From Pain Points to Production: A Newsroom Text Editor Overhaul

Two rounds of usability testing that reshaped how kumparan writers draft, edit, and publish every day.

2018
1 Month
1 Product Designer, 1 Frontend, 1 Backend
Product Designer, and Researcher

Overview

kumparan's internal text editor was the tool reporters and editors used every day to write and publish stories, which meant every point of friction in it had an outsized, daily impact on the newsroom. I led a full usability-testing-driven redesign of the editor, run across two rounds of real user testing, from initial diagnosis through a validated, production-ready redesign.

The Problem

The editor had accumulated friction across nearly the entire writing workflow: confusing iconography (embed options, formatting icons, "block code" that most writers didn't understand or use), missing features writers actively needed (image captions, block quotes, GIF upload), and most seriously, unreliable autosave and draft behavior that had caused writers to lose completed work. That last issue had eroded enough trust that some writers had started drafting in external tools and pasting into kumparan's editor instead, which introduced its own new bug: extra, broken spacing on paste.

The editor being tested

Screenshot of the text editor product being tested:

The product's user flow diagram:

Solution

Round 1: Baseline usability testing. I ran moderated, task-based usability testing with 8 kumparan newsroom writers and reporters (ages 22–40, mixed beats from entertainment to lifestyle to general news), each completing a real writing task, composing a full listicle story with embedded media (images, YouTube video, social embeds), while thinking aloud. I observed behavior, body language, and verbal feedback throughout, and logged pain points and completion time for each participant.

Synthesizing findings across all 8 participants surfaced a clear, consistent pattern:

  • Remove: font color, paragraph alignment, and "block code", all rarely used and a source of confusion, not value
  • Add: image captions (for credit and context), block quotes with clearer visual distinction from body text, keyboard shortcuts, a real safeguard against losing work (draft warnings before navigating away, more reliable autosave), and GIF upload support
  • Redesign: unclear icons (especially embed and formatting icons), toolbar placement, and the topic-tagging flow

Redesign. Based on these findings, I redesigned the editor's UI and underlying behavior, reworking icons and layout, removing the clutter of unused legacy features, and adding the capabilities writers had been improvising workarounds for.

Round 2: Pre-production validation. With the redesign in place, I ran a second round of usability testing, this time organized into 3 separate user groups, each given a more advanced task: writing a complete review article using every major supported content type (headings, bold/italic/underline, hyperlinks, bulleted and numbered lists, blockquotes, and embeds from Facebook, Twitter, Instagram, and YouTube). Each group's session was synthesized into a completion assessment plus structured qualitative feedback, rated by how strongly it was raised (strong / medium / low) alongside positive feedback.

Before the "Redesign.":

The redesigned editor UI that came out of the "Redesign.":

What Round 2 Confirmed

Across all three test groups, the core functionality and overall UI landed well, the main friction that remained was in copy clarity and icon meaning rather than the underlying flow. Specific, recurring feedback included: embed icons still needing clearer differentiation from hyperlink icons, blockquote styling needing to visually separate itself from regular paragraphs, and a consistent request for image-size control before publishing.

Outcome

Following the second round of testing, the team moved forward with the redesigned editor, most writers adapted to the new design well, and the remaining feedback was scoped into a prioritized backlog rather than blocking the release. The redesign shipped to production with the trust-breaking data-loss issues resolved, unused legacy features removed, and the missing capabilities (captions, block quotes, safer autosave) delivered, with the team continuing to monitor usage and iterate as new issues surfaced.

Results & Impact

Ran 2 full rounds of moderated usability testing (8 users, then 3 test groups) with real newsroom writers

Diagnosed and resolved trust-breaking autosave/draft-loss bugs that had pushed writers to work around the tool entirely

Removed unused legacy features (font color, block code, alignment) and shipped the capabilities writers actually needed (captions, block quotes, safer autosave)

Validated the redesign against a full real-world writing task before shipping to production

Like what you see?

I'm always excited to collaborate with teams and individuals who value thoughtful, user-centered design. If you're hiring, or have a project in mind, let's talk.

Get in Touch