Whenever reviewing changes to a document, it’s essential to have a way of seeing what changed: a “diff view.”
Diff views appear in source control tools, such as the red/green line-based view in the diff unix utility. Writers have seen the blue (added) and red+strikethrough (removed) syntax found in word processors.
But two common problems we’ve noticed ourselves and heard from others about existing diff views for prose:
- They’re often very noisy, making it hard to review (e.g. suggested edits in Google Docs).
- It can be hard to get a high-level glance of what’s changed, in addition to the details.
Here are some small experiments we tried in this area to improve legibility and utility.
First, diff visualization in the full-size document editor:
Hover over the deletion glyph to see the removed text.
We also used the right-side gutter, traditionally used for comments, to call out additions and deletions. Most promising here was showing replaced text, which is a common operation in copyediting but can get noisy with strikethrough-based diff views.
There’s another type of diff visualization we need, which is a summary or thumbnail view. Git shows a commit summary in the style of “+added/-removed,” but no such thing exists for prose writing.
Some experiments we tried for a summary diff:
Breaking these down top to bottom:
- Stats ala Git/GitHub, with characters added and removed, and comments added. We’ve found that character count isn’t the right metric for prose, but word/sentence counts are better.
- Blobs as a visual representation. Several contigous paragraphs added will show as a large central circle, with small edits orbiting it. Red and green differentiate addition and deletion. We don’t love this solution, but we do think the problem of differentiating “one big edit” from “many small edits” is important.
- Minibar . The horizontal bar gives a sense for where in the document changes happened, and the section headers diagonally above give further orientation clues. We found this most helpful in longer documents.
- Sections stats uses the document section headers to infer the table of contents. Here we have the same +added/-deleted syntax, broken down by section.
Our team’s favorites so far are the hover-to-show-deleted (full document) and the minibar (summary). What directions do you think we should try next?